Flutter Splash闪屏页

【Flutter Splash闪屏页】
Splash页

  • flutter也可以添加一个SplashPage
void main() { runApp(MyApp()); }class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', home: MySplashPage(), ); } }class MySplashPage extends StatefulWidget { @override _MySplashPageState createState() => _MySplashPageState(); }class _MySplashPageState extends State { @override Widget build(BuildContext context) { return Container( child: Image( image: AssetImage('images/splash.png'), fit: BoxFit.fill, ), ); }@override void initState() { // 启动的时候将屏幕设置成全屏模式 SystemChrome.setEnabledSystemUIOverlays([]); super.initState(); // 这里进行1秒后跳转 Timer( Duration(seconds: 1), () => Navigator.of(context).pushReplacement(MaterialPageRoute( builder: (BuildContext context) => MyHomePage()))); }@override void dispose() { // 关闭的时候将屏幕设置成原来的状态 SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values); super.dispose(); } }

  • Android端需要将对应的 launch_background.xml 里添加splash的图片资源
全屏显示

  • 如果想要在跳转到第一个page的时候也是当前的splash.png 的话 就需要更改另一个配置 styles.xml 文件
@drawable/launch_background false@drawable/launch_background

最后官方其实有教程的
官方地址

    推荐阅读