video_thumbnail_slider

Description:

video thumbnail slider

Video Thumbnail Slider #
A Flutter package that provides a customizable video thumbnail slider widget. This widget allows you to display a slider with thumbnails generated from a video, making it easy to navigate and preview different parts of the video.
Features #

Displays a video thumbnail slider with customizable settings.
Supports custom frame builders for individual frames in the slider.
Allows seeking to different parts of the video by interacting with the slider.

Preview #

Getting Started #
To use this package, you need to add it to your Flutter project. Follow these steps:


Add the following dependency to your pubspec.yaml file:
dependencies:
video_thumbnail_slider: ^1.0.0
copied to clipboard


Import the package in your Dart code:
import 'package:video_thumbnail_slider/video_thumbnail_slider.dart';
copied to clipboard


Create an instance of VideoPlayerController to control the video playback:
VideoPlayerController _controller = VideoPlayerController.network('http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4');
copied to clipboard


Use the VideoThumbnailSlider widget in your Flutter UI:
VideoThumbnailSlider(
controller: _controller,
height: 50,
width: 350,
splitImage: 7,
backgroundColor: Colors.black,
customCurrentFrameBuilder: (controller) => VideoPlayer(controller),
)
copied to clipboard


Usage #
Here's a basic example of how to use the VideoThumbnailSlider widget:
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
import 'package:video_thumbnail_slider/video_thumbnail_slider.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
final VideoPlayerController _controller = VideoPlayerController.network('https://example.com/sample_video.mp4');

@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Video Thumbnail Slider Example'),
),
body: Center(
child: VideoThumbnailSlider(
controller: _controller,
height: 50,
width: 350,
splitImage: 7,
backgroundColor: Colors.black,
customCurrentFrameBuilder: (controller) => VideoPlayer(controller),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
if (_controller.value.isPlaying) {
_controller.pause();
} else {
_controller.play();
}
},
child: Icon(
_controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
),
),
),
);
}
}
copied to clipboard
Additional Information #

GitHub Repository

Feel free to contribute, report issues, or request features on the GitHub repository. We welcome your feedback and contributions!