0

I need to stream a video with the expo-av video component on react native.

The issue I'm having is that it has to download the entire video before it starts playing

Video component

<Video
  ref={video}
  source={{uri:viewOptionsVideoURL}}            
  style={{ width:windowWidth, height: "50%"}}
  resizeMode={ResizeMode.STRETCH}
  isLooping
  useNativeControls
  onPlaybackStatusUpdate={status => setStatus(() => status)}
  rate={1.0}
  volume={1.0}
  isMuted={false}
  onLoad={(status: AVPlaybackStatus)=>{
      console.log(status);
  }}
  onError={console.log}
/>

Calling Code

// this will set the video url on the above component using the useState hook
setViewOptionsVideoURL("https://storage.googleapis.com/clipdrop-prod/tfNttNC2RLuuxJ_VdWKKcJkm1.amgZR6y_460sv.mp4");
// these 2 will load and start playing the video from position 0
await (video?.current as any).loadAsync();
await (video?.current as any).playFromPositionAsync(0);

Not sure what else to do, as I would like it to start playing as soon as its loaded as the above invocation of the video using loadAsync()

Dean Van Greunen
  • 5,060
  • 2
  • 14
  • 28

0 Answers0