[BUG] Custom controls are always visible

[darter0]

i'm implementing custom controls widget, it worked fine but the problem is that the custom controls are stuck on screen (always visible), unlike the default material or cupertino controls which visibility can be toggled.

this is my player: ` BetterPlayerController? _betterPlayerController;

@override void initState() { _betterPlayerController = BetterPlayerController( BetterPlayerConfiguration( controlsConfiguration: BetterPlayerControlsConfiguration( playerTheme: BetterPlayerTheme.custom, customControlsBuilder: (controller, onControlsVisibilityChanged) => // I believe onControlsVisibilityChanged is responsible for visibility toggle CustomControlsWidget( controller: controller, onControlsVisibilityChanged: onControlsVisibilityChanged), ), ), //dataSource etc... );

super.initState();

}

@override Widget build(BuildContext context) { final provider = Provider.of(context); final seriesVideo = provider.seriesVideo; final mediaQuery = MediaQuery.sizeOf(context); print(mediaQuery.width);

return Scaffold(
  backgroundColor: Colors.black,
  body: seriesVideo == null
      ? kProgressIndicator
      : _betterPlayerController != null
          ? Center(
              child: Stack(
                alignment: AlignmentDirectional.center,
                children: [
                  AspectRatio(
                    aspectRatio: 16 / 9,
                    child:
                        BetterPlayer(controller: _betterPlayerController!),
                  ),

                  Align(
                    alignment: Alignment.topLeft,
                    child: Container(
                      width: mediaQuery.width / 12,
                      margin: EdgeInsets.only(left: mediaQuery.width / 15),
                      child: Stack(children: [
                        ClipRRect(
                          child: BackdropFilter(
                            filter:
                                ImageFilter.blur(sigmaX: 10, sigmaY: 10),
                            child: Padding(
                              padding: EdgeInsets.symmetric(
                                  horizontal: mediaQuery.width / 90,
                                  vertical: mediaQuery.height / 90),
                              child: Text(
                                'Seriez',
                                style: GoogleFonts.cairo(
                                  fontSize: 15,
                                  color: Colors.white,
                                ),
                              ),
                            ),
                          ),
                        ),
                      ]),
                    ),
                  ),
                ],
              ),
            )
          : kProgressIndicator,
);

}

`

this is my custom controls widget:

`class CustomControlsWidget extends StatefulWidget { final BetterPlayerController? controller; final Function(bool visbility)? onControlsVisibilityChanged;

const CustomControlsWidget( {super.key, this.controller, this.onControlsVisibilityChanged});

@override State createState() => _CustomControlsWidgetState(); }

class _CustomControlsWidgetState extends State {

@override Widget build(BuildContext context) { widget.onControlsVisibilityChanged;

return Container(
  height: 50,
  decoration: BoxDecoration(
    color: Colors.purple.withOpacity(0.2),
    borderRadius: BorderRadius.circular(15),
  ),
  child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
      InkWell(
        onTap: () async {
          Duration? videoDuration =
              await widget.controller!.videoPlayerController!.position;
          setState(() {
            if (widget.controller!.isPlaying()!) {
              Duration rewindDuration =
                  Duration(seconds: (videoDuration!.inSeconds - 2));
              if (rewindDuration <
                  widget
                      .controller!.videoPlayerController!.value.duration!) {
                widget.controller!.seekTo(Duration(seconds: 0));
              } else {
                widget.controller!.seekTo(rewindDuration);
              }
            }
          });
        },
        child: Icon(
          Icons.fast_rewind,
          color: Colors.white,
        ),
      ),
      InkWell(
        onTap: () {
          setState(() {
            if (widget.controller!.isPlaying()!)
              widget.controller!.pause();
            else
              widget.controller!.play();
          });
        },
        child: Icon(
          widget.controller!.isPlaying()! ? Icons.pause : Icons.play_arrow,
          color: Colors.white,
        ),
      ),
      InkWell(
        onTap: () async {
          Duration? videoDuration =
              await widget.controller!.videoPlayerController!.position;
          setState(() {
            if (widget.controller!.isPlaying()!) {
              Duration forwardDuration =
                  Duration(seconds: (videoDuration!.inSeconds + 2));
              if (forwardDuration >
                  widget
                      .controller!.videoPlayerController!.value.duration!) {
                widget.controller!.seekTo(Duration(seconds: 0));
                widget.controller!.pause();
              } else {
                widget.controller!.seekTo(forwardDuration);
              }
            }
          });
        },
        child: Icon(
          Icons.fast_forward,
          color: Colors.white,
        ),
      ),
    ],
  ),
);

} } ` this is player screen: