flutterdartvideoflutter-video-player

How to disable rewinding and forwarding the video using Flutter Chewie package?


I am basically trying to prevent the user from rewinding or forwarding the video via progress slider but user should still be able to pause and play the video and see how many seconds/minutes remains till the end of the video.

How can i achieve this using Chewie package in Flutter?

@override
  void initState() {
    super.initState();
    _chewieController = ChewieController(
      videoPlayerController: widget.vpController,
      aspectRatio: widget.vpController.value.aspectRatio,
      autoInitialize: true,
      allowFullScreen: true,
      allowPlaybackSpeedChanging: false,
      deviceOrientationsAfterFullScreen: [DeviceOrientation.portraitUp, DeviceOrientation.portraitDown],
      showControls: true,
      playbackSpeeds: [1.0],
      showOptions: false,
      errorBuilder: ((context, errorMessage) {
        return Center(
          child: Text(errorMessage),
        );
      })
    );
  }

Need to disable the blue progress bar


Solution

  • you can did it by use customControls property in ChewieController

    _chewieController = ChewieController(
          videoPlayerController: _videoPlayerController!,
          allowFullScreen: false,
          showOptions: false,
          looping: false,
          autoPlay: true,
          hideControlsTimer: const Duration(seconds: 1),
          customControls: const CustomMaterialControls(
            showPlayButton: false,
          ),
        );
    

    in CustomMaterialControls, just clone MaterialControls from chewie and you will see that a function called _buildProgressBar()

    Widget _buildProgressBar() {
        return Expanded(
          child: VideoProgressBar(
            controller,
            colors: chewieController.materialProgressColors ??
                ChewieProgressColors(
                  playedColor: Theme.of(context).colorScheme.secondary,
                  handleColor: Theme.of(context).colorScheme.secondary,
                  bufferedColor: Theme.of(context).backgroundColor.withOpacity(0.5),
                  backgroundColor: Theme.of(context).disabledColor.withOpacity(.5),
                ),
            handleHeight: 0,
            drawShadow: false,
            barHeight: 4,
          ),
        );
      }
    

    You can disable function onDragStart, onHorizontalDragUpdate in VideoProgressBar then you will get your expectation

    onHorizontalDragStart: (DragStartDetails details) {
            if (!controller.value.isInitialized|| widget.disableDrag) {
              return;
            }
    }