Chewie flutter video Player
Asked Answered
P

1

6

I am using the chewie player with a custom made control bar, When the player switches to full screen I can not see the controls.. I need to show the controls even if the player goes to full screen. I am not using the controls provide by chewie because I do not want the progress seek bar to be touchable i.e I do not want the user to rewind the video ....

Below is the code :-

@override
  void initState() {
    super.initState();

    _videoPlayerController1 = VideoPlayerController.network(widget.videoURL);

    _chewieController = ChewieController(
      videoPlayerController: _videoPlayerController1,
      //  aspectRatio: 3 / 2,
      autoPlay: false,
      looping: false,
      autoInitialize: true,
      showControls: true,
      fullScreenByDefault: false,
      //seekTo:value,
      startAt: Duration(milliseconds: widget.time),
      //customControls: customControl(),

      placeholder: Container(
        color: Colors.black87,
        child: Container(
          child: Center(
              child: CircularProgressIndicator(
            valueColor:
                new AlwaysStoppedAnimation<Color>(Colors.deepPurpleAccent),
          )),
        ),
      ),
    //  overlay:

      // autoInitialize: true,
    );

    setState(() {
      _loading = true;
    });

   

  }



@override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: _onWillPop,
      child: SafeArea(
        child: MaterialApp(
          home: Scaffold(
            backgroundColor: Colors.black,
            body: Column(
              children: <Widget>[
                Expanded(
                  child: Center(
                    child: GestureDetector(
                      onDoubleTap: () {
                        _chewieController.enterFullScreen();
                      },
                      onTap: () {
                        if (_videoPlayerController1.value.isPlaying) {
                          setState(() {
                            _chewieController.pause();
                            isPlaying = false;
                          });
                        } else {
                          setState(() {
                            _chewieController.play();
                            isPlaying = true;
                          });
                        }
                      },
                      child: Chewie(
                        controller: _chewieController,
                      ),
                    ),
                  ),
                ),
                Row(
                  children: [
                    FlatButton(
                      onPressed: () {
                        if (_videoPlayerController1.value.isPlaying) {
                          setState(() {
                            _chewieController.pause();
                            isPlaying = false;
                          });
                        } else {
                          setState(() {
                            _chewieController.play();
                            isPlaying = true;
                          });
                        }
                      },
                      child: Icon(
                        !_videoPlayerController1.value.isPlaying
                            ? Icons.play_arrow
                            : Icons.pause,
                        color: Colors.white,
                        size: 30,
                      ),
                    ),
                    ValueListenableBuilder(
                      valueListenable: _videoPlayerController1,
                      builder: (context, VideoPlayerValue value, child) {
                        //Do Something with the value.
                        if (value.initialized && value.isPlaying) {
                          return new LinearPercentIndicator(
                            width: MediaQuery.of(context).size.width - 180,
                            lineHeight: 8.0,
                            percent: (value.position.inSeconds.toDouble() /
                                value.duration.inSeconds.toDouble()),

                            linearStrokeCap: LinearStrokeCap.roundAll,
                            backgroundColor: Colors.grey,
                            progressColor: Colors.amber,
                          );
                        } else {
                          return new LinearPercentIndicator(
                            width: MediaQuery.of(context).size.width - 180,
                            lineHeight: 8.0,
                            percent: 0.0,
                            linearStrokeCap: LinearStrokeCap.roundAll,
                            backgroundColor: Colors.grey,
                            progressColor: Colors.amber,
                          );
                        }
                      },
                      //child:
                    ),
                    FlatButton(
                      onPressed: () {
                        _chewieController.enterFullScreen();
                        setState(() {
                          isFullscreen = true;
                        });

                      },
                      child: Icon(
                        Icons.fullscreen,
                        color: Colors.white,
                        size: 30,
                      ),
                    ),
//
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
Papke answered 19/8, 2020 at 5:43 Comment(1)
Hi Guys - how we can change the background color of the play button on the center of the video (Chewie)?Revelry
C
2

you can control the color button with

  materialProgressColors:ChewieProgressColors(backgroundColor: Colors.red,bufferedColor: Colors.red,

handleColor: Colors.blue,playedColor: Colors.orange),

add to your cotroller

Chinn answered 26/8, 2021 at 12:15 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.