AnimatedCrossFade 动画渐变

computerclass

于 2021-06-21 16:05:37 发布

阅读量161

点赞数

CC 4.0 BY-SA版权

分类专栏： flutter

本文链接：https://blog.youkuaiyun.com/computerclass/article/details/118088811

flutter 专栏收录该内容

220 篇文章

订阅专栏

这篇博客介绍了如何在Flutter应用中通过AnimatedCrossFade组件创建两个Widget之间的平滑渐变动画。示例代码展示了如何设置动画时长、选择显示的Widget状态，并实现3秒的渐变过渡效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

实现两个Widget之间的渐变动画

 AnimatedCrossFade(
            duration: const Duration(seconds: 3),
            firstChild: const FlutterLogo(
                style: FlutterLogoStyle.horizontal, size: 100.0),
            secondChild:
                const FlutterLogo(style: FlutterLogoStyle.stacked, size: 100.0),
            crossFadeState:
                _first ? CrossFadeState.showFirst : CrossFadeState.showSecond,
          ),