(一)简单实现组件淡入淡出动画
1,定义一个Container对象 2,定义一个StatefulWidget组件 3,定义一个button,切换Container显示还是隐藏 4,实现Container的淡出淡出
对以上步骤做简要说明
1,定义一个Container对象
2,定义一个StatefulWidget组件,因为需要管理Container显示还是隐藏动画,所以定一个StatefulWidget组件,StatefulWidget类创建了一个State对象,对象可以定义一些数据,然后方法可以更新这些数据,然后就可以告诉Flutter重新绘制UI,使用这些变化的数据,Android studio 和VSCode可以使用stful快捷键快速创建一个StatefulWidget组件
3,定义一个button,切换Container显示还是隐藏, 我们创建一个自己的Scaffold组件,在_MyScaffoldState类中返回一个Scaffold,使用命名可选参数floatingActionBar,定义一个button
4,实现Container的淡出淡出,要给Container包裹一个AnimatedOpacity组件,有两个必填的参数,opacity和duration,透明度和动画的时间
最后在代码中简单实现,如果组件是可兼得,动画从1.0到0.0不可见,如果组件是隐藏的,动画从0.0到1.0到显示可见
完整代码如下
显示效果如下图