MediaPlayerState #

MediaPlayerState creates an instance that controls video states internally, which can be shared between media components and control components. The simplest workflow is to create a MediaPlayerState, and hook it with components:

class VideoPlayer extends React.Component { constructor(props) { super(props); this.state = { playerState: new MediaPlayerState({autoPlay: true, muted: true}), // init with muted, autoPlay }; } render() { return ( <View> <Video style={{height: 2.25, width: 4}} source={{uri: 'assets/1.webm'}} playerState={this.state.playerState} /> <VideoControl style={{height: 0.2, width: 4}} playerState={this.state.playerState} /> </View> ); } }

To control video playback, you can directly call functions on playerState

this.state.playerState.play(); this.state.playerState.pause(); this.state.playerState.setMuted(false);

Methods #

constructor(options) #

Create a new MediaPlayerState.

@param options (optional) - Configure the initial state.

  • autoPlay {boolean}: whether the media should start playing automatically. Default is false.
  • muted {boolean}: whether the media should be muted. Default is false.
  • volume {number}: Volume of the media, generally in the range 0 to 1. Default is 1.0

play() #

Begin or resume playback.

pause() #

Pause playback.

seekTo(timeSec) #

Seek to a position of the video @param timeSec - the position seek to.

registerUserGesture(commandID, commandArgs, reactTag) #

Register for calling a command on a Video on a user gesture on a Component @param commandID - the command id. @param commandArgs - the command arguments. @param reactTag - the tag of the component that listen to the user gesture.

unregisterUserGesture(reactTag) #

Unregister for calling a command on a Video on a user gesture on a Component @param reactTag - the tag of the component that listen to the user gesture.

setVolume(value) #

Set the volume of the media (0.0 ~ 1.0). Default is 1.0

setMuted(value) #

Whether the audio should be muted. Default is false.

onDurationChange(event) #

onTimeUpdate(event) #

onPlayStatusChange(event) #

You can file an issue on GitHub if you see a typo or error on this page!