Use first frame of video as thumbnail

Question

I am using react-native-video

And it have a props called poster which is working fine. But my requirement is to get that thumbnail from video (first frame of video). If I don't use poster (which accept an url) then it is showing blank screen.

Any idea how to use first frame of video as thumbnail?

Thank You!!!

Answer 1

You can use the onLoad function callback to achieve it,

const player = useRef(null);

<Video
  source={{uri: uri}}
  ref={player}
  paused={true}
  style={styles.backgroundVideo}
  onLoad={() => {
    player.current.seek(0); // this will set first frame of video as thumbnail
  }}
/>

For more details on onLoad prop: here