我正在尝试制作视频播放器。我正在使用Stack()在视频顶部显示一排图标按钮。我想让这些图标在一定时间后像在YouTube移动应用中一样消失。

我使用了AnimatedOpacity()小部件,但如果我将它们设置为可见,则图标保留在屏幕上;如果从一开始就将它们设置为不可见,则图标仍会保留在屏幕上。它们的不透明度永远不会改变。有人可以引导我吗?

Positioned.fill(
  child: AnimatedOpacity(
    opacity: _isVisible ? 1.0 : 0.0,
    duration: Duration(seconds: 3),
    child: GestureDetector(
      onTap: () {
        setState(() {
          _isVisible = !_isVisible;
        });
        // Future.delayed(Duration(seconds: 4), () {
        //   setState(() {
        //     _isVisible = false;
        //   });
        // });
      },
      child: Container(
          height: (MediaQuery.of(context).size.width /
              _controller.value.aspectRatio),
          width: double.infinity,
          child: PlayerControls(controller: _controller)),
    ),
  ),
)

我希望图标在3秒钟后消失,但是那没有发生。

最佳答案

您可以这样做:

            double opacityLevel = 1.0;

            Positioned.fill(
              child: AnimatedOpacity(
                opacity: opacityLevel,
                duration: Duration(seconds: 3),
                child: GestureDetector(
                  onTap: () {
                    setState(() => opacityLevel = opacityLevel == 0 ? 1.0 : 0.0);
                    // Future.delayed(Duration(seconds: 4), () {
                    //   setState(() {
                    //     _isVisible = false;
                    //   });
                    // });
                  },
                  child: Container(
                      height: (MediaQuery.of(context).size.width /
                          _controller.value.aspectRatio),
                      width: double.infinity,
                      child: PlayerControls(controller: _controller)),
                ),
              ),
            )

关于flutter - 不透明度值的更改未反射(reflect)在应用程序中,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/57775264/

10-13 03:53