timcreatedit / smooth_video_progress Goto Github PK

import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
import 'package:smooth_video_progress/smooth_video_progress.dart';

class VideoPlayerWidget extends StatefulWidget {
  final String filepath;
  final double width;

  VideoPlayerWidget(this.filepath, {required this.width});

  @override
  _VideoPlayerWidgetState createState() => _VideoPlayerWidgetState();
}

class _VideoPlayerWidgetState extends State<VideoPlayerWidget> {
  late VideoPlayerController _controller;
  late Duration _currentPosition;
  bool showVideoControls = false;
  bool showInitialPlayButton = true;

  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.network(widget.filepath,
        videoPlayerOptions: VideoPlayerOptions(
          mixWithOthers: true,
        ))
      ..addListener(() {
        setState(() {
          _currentPosition = _controller.value.position;
        });
      })
      ..initialize().then((_) {
        // Ensure the first frame is shown after the video is initialized, even before the play button has been pressed.
        setState(() {});
      });
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  String formatTime(Duration duration) {
    return duration.inHours == 0
        ? "${duration.inMinutes}:${duration.inSeconds.remainder(60).toString().padLeft(2, '0')}"
        : "${duration.inHours}:${duration.inMinutes.remainder(60).toString().padLeft(2, '0')}:${duration.inSeconds.remainder(60).toString().padLeft(2, '0')}";
    // if (duration.inHours == 0) {
    //   return "${duration.inMinutes}:${duration.inSeconds.toString().padLeft(2, '0')}";
    // } else {
    //   return "${duration.inHours}:${duration.inMinutes.toString().padLeft(2, '0')}:${duration.inSeconds.toString().padLeft(2, '0')}";
    // }

    // // Format the duration into hh:mm:ss format
    // String twoDigits(int n) => n.toString().padLeft(2, '0');
    // String twoDigitMinutes = twoDigits(duration.inMinutes.remainder(60));
    // String twoDigitSeconds = twoDigits(duration.inSeconds.remainder(60));
    // return "${twoDigits(duration.inHours)}:$twoDigitMinutes:$twoDigitSeconds";
  }

  @override
  Widget build(BuildContext context) {
    return Container(
        width: widget.width,
        child: MouseRegion(
            onEnter: (e) => setState(() {
                  if (!showInitialPlayButton) {
                    showVideoControls = true;
                  }
                }),
            onExit: (e) => setState(() {
                  showVideoControls = false;
                }),
            child: Stack(children: [
              _controller.value.isInitialized
                  ? AspectRatio(
                      aspectRatio: _controller.value.aspectRatio,
                      child: VideoPlayer(_controller),
                    )
                  : Container(),
              if (showInitialPlayButton)
                Positioned.fill(
                    child: Center(
                  child: IconButton(
                    onPressed: () {
                      setState(() {
                        showInitialPlayButton = false;
                        showVideoControls = true;
                        _controller.play();
                      });
                    },
                    splashRadius: 0.01,
                    iconSize: widget.width * 0.20,
                    color: Theme.of(context).canvasColor.withOpacity(0.50),
                    icon: Icon(Icons.play_circle),
                  ),
                )),
              if (showVideoControls)
                Positioned.fill(
                    child: Align(
                        alignment: Alignment.bottomCenter,
                        child: SizedBox(
                            height: 40,
                            child: Row(children: [
                              IconButton(
                                onPressed: () {
                                  setState(() {
                                    _controller.value.isPlaying
                                        ? _controller.pause()
                                        : _controller.play();
                                  });
                                },
                                splashRadius: 0.01,
                                icon: Icon(
                                  _controller.value.isPlaying
                                      ? Icons.pause
                                      : Icons.play_arrow,
                                ),
                              ),
                              Text(
                                  "${formatTime(_currentPosition)} / ${formatTime(_controller.value.duration)}",
                                  style: TextStyle(
                                      color: Theme.of(context).canvasColor)),
                              Expanded(
                                child: SmoothVideoProgress(
                                  controller: _controller,
                                  builder: (context, position, duration, _) =>
                                      Slider(
                                    min: 0,
                                    max: duration.inMilliseconds.toDouble(),
                                    value: position.inMilliseconds.toDouble(),
                                    onChanged: (value) => _controller.seekTo(
                                        Duration(milliseconds: value.toInt())),
                                    onChangeStart: (_) => _controller.pause(),
                                    onChangeEnd: (_) => _controller.play(),
                                  ),
                                ),
                                // child: ValueListenableBuilder<VideoPlayerValue>(
                                //   valueListenable: _controller,
                                //   builder: (context, value, _) => Slider(
                                //     min: 0,
                                //     max: value.duration.inMilliseconds
                                //         .toDouble(),
                                //     value: value.position.inMilliseconds
                                //         .toDouble(),
                                //     onChanged: (value) => _controller.seekTo(
                                //         Duration(milliseconds: value.toInt())),
                                //     onChangeStart: (_) => _controller.pause(),
                                //     onChangeEnd: (_) => _controller.play(),
                                //   ),
                                // ),
                              ),
                            ])))),
            ])));
  }
}