I want to show the thumbnail of the video in lisviewbuilder here is the path of a video after getting from device storage.
files[index]
CodePudding user response:
You can use the video_thumbnail package to generate a thumbnail for your video file, and it's implementation would be like this :
final uint8list = await VideoThumbnail.thumbnailData(
video: files[index}, // video path
imageFormat: ImageFormat.JPEG,
maxWidth: 128, // specify the width of the thumbnail, let the height auto-scaled to keep the source aspect ratio
quality: 25,
);
you can try implementing it like this, first add this method in your class:
Future<Uint8List?> _thumbnailImage(path) async {
return await VideoThumbnail.thumbnailData(
video: path, // video path
imageFormat: ImageFormat.JPEG,
maxWidth:
128, // specify the width of the thumbnail, let the height auto-scaled to keep the source aspect ratio
quality: 25,
);
}
then use this FutureBuilder
to show it:
FutureBuilder<Uint8List?>(
future: _thumbnailImage(files[index]),
builder: (_, AsyncSnapshot<Uint8List?> snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return Center(child: CircularProgressIndicator());
}
if (snapshot.hasData) {
return Image.memory(snapshot.data!);
}
return Text("error");
},
),
You can also use it with combination with the image_picker, to get the video path from the device like this:
final XFile? image =
await ImagePicker().pickVideo(source: ImageSource.gallery);
final String pathToUse = image!.path;
then use that path in the _thumbnailImage()
method.