Flutter实例-闪屏页动画

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/shuzhuchengfu/article/details/102399164

Flutter实例-闪屏页动画

/// 闪屏页动画
class SplashDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return SplashDemoState();
  }
}

class SplashDemoState extends State<SplashDemo>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation _animation;
  @override
  void initState() {
    super.initState();
    // 初始化变量
    _controller = AnimationController(
        vsync: this, duration: Duration(milliseconds: 3000));
    _animation = Tween(begin: 0.5, end: 1.0).animate(_controller);
    // 添加监听事件
    _animation.addStatusListener((status) {
      if (status == AnimationStatus.completed) {
        // 动画完成了
        Navigator.of(context).pushAndRemoveUntil(
            MaterialPageRoute(builder: (context) {
              return NewHomePage();
            }), (route) {
          return route == null;
        });
      }
    });
    // 动画开始
    _controller.forward();
  }

  @override
  void dispose() {
    // 销毁控制器
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return FadeTransition(opacity: _animation,child: Image.asset(
        "images/meinv.jpg",
      scale: 2.0,
      fit: BoxFit.cover,
    ),);
  }
}

/// 跳转页
class NewHomePage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("首页"),),
      body: Center(
        child: Text("我是首页"),
      ),
    );
  }
}