Emre Turan
Emre Turan

Reputation: 113

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

Upvotes: 2

Views: 1561

Answers (1)

thaovd1712
thaovd1712

Reputation: 318

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;
        }
}

Upvotes: 1

Related Questions