flutter添加启动图及设置启动时间

首先贴个官方的设置方法,看这里:https://flutterchina.club/assets-and-images/#%E6%9B%B4%E6%96%B0%E5%90%AF%E5%8A%A8%E9%A1%B5
虽然官方的方法比较简单,但是有时我们可能需要自己配置启动图的生效时间,这时就需要另外实现了。思路就是第一个页面放一张全屏图片,倒数计时结束时再跳转到主页:

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:/pages/home.dart';
import 'package:flutter/services.dart';

void main() {
  runApp(new MaterialApp(
    title: '启动图demo',
    theme: new ThemeData(
        brightness: Brightness.light,
        backgroundColor: Colors.white,
        platform: TargetPlatform.iOS),
    home: new SplashScreen(),
    routes: {
      '/home': (BuildContext context) => new Home()
    },
  ));
}

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreenState createState() => new _SplashScreenState();
}

class _SplashScreenState extends State {
  startTime() async {
    //设置启动图生效时间
    var _duration = new Duration(seconds: 1);
    return new Timer(_duration, navigationPage);
  }

  void navigationPage() {
    Navigator.of(context).pushReplacementNamed('/home');
  }

  @override
  void initState() {
    super.initState();
    startTime();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Center(
        child: new Image.asset('assets/images/launch_image.png'),
      ),
    );
  }
}

最后记得将启动图在pubspec.yaml文件声明下,完毕~

你可能感兴趣的:(flutter添加启动图及设置启动时间)