How to display a thumbnail of a local video

Question

Do you know a lib / a way to display a thumbnail of a local video ? I select a video from my device with react-native-image-picker and i would like to display a thumbnail of this video in a View or flatlist in case of several selections

Answer 1

You can use below plugin for get thubmnail form local path

https://github.com/phuochau/react-native-thumbnail#readme

import RNThumbnail from 'react-native-thumbnail';
let getFilePath = ''
RNThumbnail.get(filepath).then((result) => {
 console.log(result.path); // thumbnail path
 getFilePath = result.path;
})

After getting path for display purpose you can use react-native-video for play and display

react-native-video and use below code

<Video source={{ uri: getFilePath }} pause={true} />

Hope this will work for you.

Answer 2

If you are using Expo and you are not deploying to web, this package will do the job for you: https://docs.expo.dev/versions/latest/sdk/video-thumbnails/