flutter学习笔记五(写一个应用启动页)

• 在我们开发应用的时候都会写一个启动页来过渡&＃xff0c;下面我将介绍如何用flutter制作一个启动页面。
• 因为比较简单我直贴代码了,作一下说明

import &＃39;package:flutter/material.dart&＃39;;
import &＃39;dart:async&＃39;;class Splash extends StatefulWidget {&＃64;override_SplashState createState() &＃61;> _SplashState();
}class _SplashState extends State{&＃64;overrideWidget build(BuildContext context) {return new Material(child: new Scaffold(body: new Stack(children: [new Container(child: new Image.asset("images/launch.png",fit: BoxFit.fill,),),new Container(alignment: Alignment.topRight,padding: const EdgeInsets.fromLTRB(0.0, 45.0, 10.0, 0.0),child: OutlineButton(child: new Text("跳过",textAlign: TextAlign.center,style: new TextStyle(color: Colors.white),),// StadiumBorder椭圆的形状shape: new StadiumBorder(),onPressed: () {go2HomePage();},),),],),),);}&＃64;overridevoid initState() {// TODO: implement initStatesuper.initState();countDown();}// 倒计时void countDown() {var _duration &＃61; new Duration(seconds: 3);new Future.delayed(_duration, go2HomePage);}void go2HomePage() {Navigator.pushReplacementNamed(context, &＃39;/HomePage&＃39;);}
}

• 如上面所示我们创造了一个Splash类&＃xff0c;并在build方法里面写好了我们的布局&＃xff0c;countDown()方法是一个延迟执行的方法&＃xff0c;设定在3秒后启动go2HomePage(),这是一个首页的跳转&＃xff0c;我在右上角添加了一个按钮用于点击跳转&＃xff0c;如此一个简单的启动页我们就做好了&＃xff0c;自己多动手吧&＃xff01;