How to show and Hide Subtitles in React Native Video

Question

is there any way to use (enable/disable) in runtime the subtitles of the running video? I am actually using this package: https://github.com/abbasfreestyle/react-native-af-video-player and does not show directly how to use them, but going to the react-native-video component . (Which is inside of the af video player) so i tried to use the textTracks and selectedTextTrack properties to make it work and tried modifiyng the general state and switching between:

selectedTextTrack={{
  type: "title",
  value: "English Subtitles"
}}

and

selectedTextTrack={{
      type: "disabled",
      value: "English Subtitles"
}}

that is exactly how the documentation and the issue that says it to do is here: https://github.com/react-native-community/react-native-video/issues/1044 The subtitles are working, but how about to disable them, does anybody knows how to do it properly?

Answer 1

Test it. Probably working

constructor(props) {
    super(props);
    this.state = {
       ...
        type:'title'

    };
}


...
render(){
   return(
      <Video
           ...
           selectedTextTrack={{
               type: this.state.type,
               value: "English Subtitles"
           }}
      />
  )

}


onuttonClick = () =>{
   this.setState({type:'disable});
}