You can play a local stream as well as remote streams including screen-share, canvas streams using EnxStream and EnxPlayerView Tags.
Tags:
<EnxStream streamId=StreamID eventHandlers=ListenerEvents>– To create stream<EnxPlayerView streamId=StreamID isLocal="remote" eventHandlers=ListenerEvents>– To play remote stream<EnxPlayerView streamId=StreamID isLocal="local" eventHandlers=ListenerEvents>– To play local stream
Props:
streamId– Stream ID of the Stream to be playedisLocal– Enum: local, remote-
eventHandlers– To add all event listeners to handle with the Stream
Helper Methods:
changePlayerScaleType(scalingMode, streamId)– Parameters explained below:scalingMode– Enumerated Values: SCALE_ASPECT_BALANCED, SCALE_ASPECT_FIT, SCALE_ASPECT_FILLstreamId– String. The Stream ID that needs to be scaled in Player
setZOrderMediaOverlay(isOverlay, streamId)– Parameters explained below:isOverlay– Boolean. Use true to overlaystreamId– The Stream ID that you want to play as overlay
setConfigureOption(configObject, streamId)– Parameters explained below:configObject– JSON ObjectstreamId= The Stream ID that you want to configure
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}>
