Skip to main content
Version: Next

LiveMediaPublisher

API Reference: UI.LiveMediaPublisher

LiveMediaPublisher is a live streaming publisher. It is used for audio and video playback in RTMP/RTMPT/RTSP/HTTP/TCP/UDP/FILE format.

Original iOS library: https://github.com/NodeMedia/NodeMediaClient-iOS
Original Android library: https://github.com/NodeMedia/NodeMediaClient-Android

Edit Info.plist

You should add camera and microphone permission to workspace/config/iOS/Info.plist

<key>NSCameraUsageDescription</key>
<string>Camera usage description</string>
<key>NSMicrophoneUsageDescription</key>
<string>Microphone usage description</string>
Edit AndroidManifest.xml file

You have to edit your AndroidManifest.xml file under workspace/config/Android.\ Add below lines

<uses-feature android:name="android.hardware.camera"/>
<uses-feature android:name="android.hardware.camera.autofocus"/>

<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.FLASHLIGHT"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
Android Permissions

You should ensure that required permissions are granted before starting live streaming. Please visit this guide. It helps you to request permissions at runtime.

LiveMediaPlayer Event Callback

You can listen the changes using onChange callback. Events are listed below.

LiveMediaPublisher Events​

  • 2000: Connecting to server
  • 2001: Connect successfully and start streaming
  • 2002: Streaming failed
  • 2003: Connecting to server
  • 2004: Streaming ended
  • 2005: Network anomaly
  • 2100: Network congestion
  • 2101: Network recovery, smooth release
note

The components in the example are added from the code for better showcase purposes. To learn more about the subject you can refer to:

Adding Component From Code

As a best practice, Smartface recommends using the WYSIWYG editor in order to add components and styles to your page or library. To learn how to use UI Editor better, please refer to this documentation

UI Editor Basics
.ui/pgLiveMediaPublisher.pgx
{
  "components": [
    {
      "className": ".page",
      "id": "7217-e1e8-2b27-3fd5",
      "initialized": true,
      "props": {
        "children": [
          "9e06-5a62-c5ae-1020",
          "5417-cebd-8cb0-7525",
          "d52d-9531-149a-7e98",
          "0990-1183-785d-3eca",
          "8087-565d-44e6-b0b1"
        ],
        "name": "pgLiveMediaPublisher",
        "orientation": "PORTRAIT",
        "parent": null
      },
      "type": "Page",
      "userProps": {},
      "version": "0.0.1.a"
    },
    {
      "className": ".statusBar",
      "id": "9e06-5a62-c5ae-1020",
      "props": {
        "children": [],
        "isRemovable": false,
        "name": "statusBar",
        "parent": "7217-e1e8-2b27-3fd5"
      },
      "type": "StatusBar",
      "userProps": {}
    },
    {
      "className": ".headerBar",
      "id": "5417-cebd-8cb0-7525",
      "props": {
        "children": [],
        "isRemovable": false,
        "name": "headerBar",
        "parent": "7217-e1e8-2b27-3fd5",
        "title": "LiveMediaPublisher"
      },
      "type": "HeaderBar",
      "userProps": {
        "title": "LiveMediaPublisher"
      }
    },
    {
      "className": ".flexLayout",
      "id": "d52d-9531-149a-7e98",
      "oldName": "flLiveMediaPlayer",
      "props": {
        "children": [],
        "name": "flLiveMediaPublisher",
        "parent": "7217-e1e8-2b27-3fd5",
        "usePageVariable": true
      },
      "type": "FlexLayout",
      "userProps": {
        "testId": "HTr6MvpkD",
        "usePageVariable": true
      }
    },
    {
      "className": ".button",
      "id": "0990-1183-785d-3eca",
      "oldName": "button1",
      "props": {
        "children": [],
        "name": "btnAction",
        "parent": "7217-e1e8-2b27-3fd5",
        "text": "Start Streaming",
        "usePageVariable": true
      },
      "type": "Button",
      "userProps": {
        "testId": "UZyRbzYL43",
        "text": "Start Streaming",
        "usePageVariable": true
      }
    },
    {
      "className": ".button",
      "id": "8087-565d-44e6-b0b1",
      "oldName": "btnPause",
      "props": {
        "children": [],
        "name": "btnCamera",
        "parent": "7217-e1e8-2b27-3fd5",
        "text": "Switch Camera",
        "usePageVariable": true
      },
      "type": "Button",
      "userProps": {
        "testId": "7pd13al_Wz",
        "text": "Switch Camera",
        "usePageVariable": true
      }
    }
  ]
}