0

I have a series of videos in my app and each of them has a progress bar. I want to pause the progress bar on press, as well as pause the video itself. Currently, if the Video component is playing and the user presses it, the video is paused (and vice versa). The issue with this Video component is that it doesn't seem to give you very fine grain control over press events. There doesn't seem to be a way to attach a function to the Video component itself (as there's no "onPress" attribute) and if I wrap the Video component with TouchableOpacity and add an onPress event to that, then the Video component no longer registers any press events.

 
<TouchableOpacity onPress={pauseProgressBar}
<Video    
      source={{uri: stories[currentUser].stories[current]?.content}}
      rate={1.0}
      volume={1.0}
      resizeMode="cover"
      // shouldPlay={isPlaying}
      onReadyForDisplay={play()}
      positionMillis={0}
      onPlaybackStatusUpdate={(AVPlaybackStatus) => {
         setLoad(AVPlaybackStatus.isLoaded);
         setEnd(AVPlaybackStatus.durationMillis);
      }}
      isMuted={false}
      style={{ height: height, width: width }}
      // useNativeControls
   />
</TouchableOpacity>

0 Answers0