Play a Stream

You can play local stream and remote streams, including screen sharing and canvas streams by using EnxStream and EnxPlayerView tags.

Tags

  • <EnxStream streamId=StreamID eventHandlers=ListenerEvents>: To create a stream.
  • <EnxPlayerView streamId=StreamID isLocal="remote"eventHandlers=ListenerEvents>: To play a remote stream.
  • <EnxPlayerView streamId=StreamID isLocal="local" eventHandlers=ListenerEvents>: To play a local stream.

Properties

Property Data Type Description
streamId String To create a stream.
isLocal String Enum: local, remote
eventHandlers JSON Object To add all event listeners to handle the stream.

Helper Methods

Method Parameter Data Type Description
changePlayerScaleType(scalingMode, streamId) scalingMode String Enumerated Values:
  • SCALE_ASPECT_BALANCE
  • SCALE_ASPECT_FIT
  • SCALE_ASPECT_FILL
streamId String ID of the stream that needs to be scaled in the player.
setZOrderMediaOverlay(isOverlay, streamId) isOverlay Boolean Set it to true to play a stream as an overlay.
streamId String ID of the stream that you want to play as an overlay.
setConfigureOption(configObject, streamId) configObject JSON Object configObject.overlay: JSON Object. configObject.enable: Boolean. Set it to true to enable. configObject.properties: JSON Object. All properties of the Over Contents are defined here.
  • textColor: String. Hexa Color Code forText. e.g. #FFFFFF.
  • textSize: Number. Text Size. Range 5-36.
  • textStyle: String. Font Family name. e.g. Arial.
  • text_background: String. Hexa Color Code for Text Background.
streamId String ID of the stream that you want to configure.

Sample Code

var propertyDict = {
	textColor: -10053376,
	textSize: 12,
	textStyle: 1,
	text_background: 0
	}


var dict = {
	enable: true,
	properties:propertyDict
	}


var overlayDict = { overlay: dict }


Enx.setConfigureOption(overlayDict, this.state.localStreamId);
Enx.changePlayerScaleType(SCALE_ASPECT_FIT, this.state.localStreamId);


<EnxStream
	streamId={String(element.streamId)}
	eventHandlers={this.streamEventHandlers}>


<EnxPlayerView
	streamId={String(element.streamId)}
	isLocal="local"
	eventHandlers={this.streamEventHandlers}>
Handle a Remote Stream