Replay a video when it is finished and a replay icon is shown to be clicked by a user

user_14048609 0
Viewed 352

Edit: I just started studying Flutter and I still have a lot to learn. For now, I had a hard time looking for ways to replay a video. My goal is to replay a video when it is finished and a replay icon is shown for a user to click. These are the only packages I imported.

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

 Widget _buildVideoPlay() {
    return Center(
      child: _controller.value.initialized ? _VideoStack() : Container(),
    );
  }

 Widget _VideoStack() {
    return Stack(
      children: [
        _VideoCore(),
        FlatButton(
          onPressed: () => setState(() {
            _controller.value.isPlaying ? _controller.initialize() : _controller.pause()
        }),
          child: Center(
            child: _controller.value.isPlaying
                ? Icon(Icons.pause, color: Colors.blue, size: 30.0)
                : Icon(Icons.play_arrow, color: Colors.blue, size: 30.0),
        ),
      ],
    );
  }

  Widget _VideoCore() {
    return Container(
      child: Center(
        child: AspectRatio(
          aspectRatio: _controller.value.aspectRatio,
          child: VideoPlayer(_controller),
        ),
      ),
    );
  }
dart flutter
2 Answers

In this case, set the finishedPlaying to be true if the duration of the current position is equal to the duration of the video. Then use this boolean to show the Replay Button.

 bool finishedPlaying = false;
  @override
  void initState() {
    super.initState();
    _controller.addListener(() {
    setState(() {
        });
      if (_controller.value.duration == _controller.value.position) {
        setState(() {
          finishedPlaying = true;
        });
        
      }
    });
  }

FlatButton(
          onPressed: () => setState(() {
                if (finishedPlaying) {
                  _controller.play(); // Replay the video
                } else {
                  _controller.value.isPlaying
                      ? _controller.play()
                      : _controller.pause();
                }
              }),
          child: Center(
              child: finishedPlaying
                  ? Icon(Icons.replay, color: Colors.blue, size: 30.0)
                  : (_controller.value.isPlaying
                      ? Icon(Icons.pause, color: Colors.blue, size: 30.0)
                      : Icon(Icons.play_arrow,
                          color: Colors.blue, size: 30.0)))),
user_141242760

i dont what you mean by reply is it like looping? you can try this

IconButton(
                        icon: Icon(
                          Icons.loop,
                          color: _controller.value.isLooping
                              ? Colors.green
                              : Colors.black,
                        ),
                        onPressed: () {
                          _controller.setLooping(!_controller.value.isLooping);
                        })
user_127892000
Related