在APP開發的過程中,我們一般需要一個開屏頁和一個廣告頁
開屏頁
開發Android 的都知道,Android啓動的時候會有一個小的空白,我們的解決方法是給開屏頁設置style ,讓其在加載聲明週期方法之前先設置一個填位圖,消除空白
-
Flutter 項目在IOS上是秒起的,不會出現這個問題,在Android上還是會出現的,但是Flutter 項目已經將這個操作在創建項目的時候就實現了
-
打開android moudle 找到res->style 看一下啓動頁的主題 drawable 所指向的文件 launch_background 文件,就是更具Android中常用的解決方法處理的,
<style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
<!-- Show a splash screen on the activity. Automatically removed when
Flutter draws its first frame -->
<!--<item name="android:windowIsTranslucent">true</item>-->
<item name="android:windowBackground">@drawable/launch_background</item>
</style>
- 找到launch_background
<?xml version="1.0" encoding="utf-8"?>
<!-- Modify this file to customize your launch splash screen -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/splash" /> <--此處爲更換的圖片-->
<!-- You can insert your own image assets here -->
<!--<item >-->
<!--<bitmap-->
<!--android:gravity="center"-->
<!--android:src="@mipmap/splash"-->
<!--android:tileMode="disabled"-->
<!--android:autoMirrored="true"-->
<!--/>-->
<!--</item>-->
</layer-list>
這就解決了開屏的問題,但是一般會在開屏的時候初始化一些東西 這樣的話我們怎麼處理,此時我們可以使用開屏之後開啓廣告頁 既展示廣告又能初始化一些東西
需求:APP啓動的時候需要判斷是否已經登錄,跳轉相對應的page
在設置完成開屏之後會發現啓動直接就到main.dart了,沒辦法做這個處理,並且Dart 是單線程的語言,關於數據的存儲都需要異步來實現,
解決辦法
添加廣告頁,既作爲展示廣告頁初始化一些操作
class SplashPage extends StatefulWidget {
@override
_SplashPageState createState() => _SplashPageState();
}
class _SplashPageState extends State<SplashPage> {
String route;
@override
void initState() {
// TODO: implement initState
super.initState();
getCredential();
}
getCredential() {
SPUtil.init().get(TMCommonConstant.AUTH_TOKEN).then((result) {
route = result;
//異步獲取到數據之後判斷token 是否爲空
if (route == null) {
route = "/";
} else {
route = "navigation";
}
countDown();
});
}
@override
Widget build(BuildContext context) {
//展示廣告
return new Image.asset(
Images.splash,
fit: BoxFit.fill,
);
}
void countDown() {
//倒計時3s
var _duration = new Duration(seconds: 3);
Future.delayed(_duration, goHome);
}
void goHome() {
//根據判斷的路由跳轉到相應的頁面
Navigator.pushReplacementNamed(context, route);
}
}