亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

Flutter啟動(dòng)頁(yè)(閃屏頁(yè))的具體實(shí)現(xiàn)及原理詳析

 更新時(shí)間:2019年04月15日 11:06:40   作者:Android高級(jí)架構(gòu)師  
這篇文章主要給大家介紹了關(guān)于Flutter啟動(dòng)頁(yè)(閃屏頁(yè))的具體實(shí)現(xiàn)及原理的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用Flutter具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

為什么要有啟動(dòng)頁(yè)?

在以下文章中,啟動(dòng)頁(yè)就是閃屏頁(yè)。

現(xiàn)在大部分App都有啟動(dòng)頁(yè),那么為什么要有啟動(dòng)頁(yè)?這是個(gè)值得思考的問(wèn)題,如果沒(méi)有啟動(dòng)頁(yè)會(huì)怎樣,大部分的App會(huì)白屏(也有可能是黑屏,主題設(shè)置有關(guān)系)非常短的時(shí)間,然后才能展示App的內(nèi)容。

那么問(wèn)題來(lái)了,一定要有啟動(dòng)頁(yè)嗎?答案:不是,而且是盡可能不要有啟動(dòng)頁(yè),因?yàn)閱?dòng)頁(yè)會(huì)讓用戶(hù)體驗(yàn)不夠連貫,甚至IOS在開(kāi)發(fā)手冊(cè)上就不推薦使用啟動(dòng)頁(yè)。

我們深入思考一下,既然不推薦為什么這樣流行,答案非常簡(jiǎn)單,啟動(dòng)頁(yè)的成本非常低,如果你想把的App啟動(dòng)優(yōu)化到一個(gè)非常短的時(shí)間,還是有一定成本的。

Android啟動(dòng)流程

為什么要談Android的啟動(dòng)流程呢?因?yàn)镕lutter啟動(dòng)的時(shí)候,依賴(lài)的是Android的運(yùn)行環(huán)境,其本質(zhì)是Activity上添加了一個(gè)FlutterView,F(xiàn)lutterView繼承SurfaceView,那么就容易理解了,F(xiàn)lutter的全部頁(yè)面都是渲染到了FlutterView上,如果不熟悉Flutter的啟動(dòng)流程可以參考Flutter啟動(dòng)流程 這篇文章,下面是對(duì)Flutter啟動(dòng)的一個(gè)簡(jiǎn)單描述。

在Flutter中,啟動(dòng)頁(yè)的作用是在FlutterView顯示第一幀之前,不要出現(xiàn)白屏,在FlutterView顯示第一幀之前,我們分成兩個(gè)階段,Android啟動(dòng)階段和Flutter啟動(dòng)階段,Android啟過(guò)程添加啟動(dòng)頁(yè)非常容易,在主題xml中添加android:windowBackground屬性,F(xiàn)lutter怎么添加啟動(dòng)頁(yè)呢?其實(shí)框架已經(jīng)幫助咱們實(shí)現(xiàn)好了,我下面就給大家說(shuō)一下原理。

Flutter啟動(dòng)頁(yè)具體實(shí)現(xiàn)和原理

創(chuàng)建一個(gè)SplashActivity,這Activity繼承FlutterActivity,重寫(xiě)onCreate()方法,在onCreate()方法中調(diào)用GeneratedPluginRegistrant.registerWith() ,下面是啟動(dòng)頁(yè)的代碼。

public class SplashActivity extends FlutterActivity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 GeneratedPluginRegistrant.registerWith(this);
 }
}

在Manifest中添加SplashActivity作為App的啟動(dòng)Activity,設(shè)置SplashActivity的主題是LaunchTheme。下面是Manifest的配置文件。

 <activity
 android:name=".SplashActivity"
 android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
 android:hardwareAccelerated="true"
 android:launchMode="singleTop"
 android:theme="@style/LaunchTheme"
 android:windowSoftInputMode="adjustResize">
 <meta-data
 android:name="io.flutter.app.android.SplashScreenUntilFirstFrame"
 android:value="true" />
 <intent-filter>
 <action android:name="android.intent.action.MAIN" />
 <category android:name="android.intent.category.LAUNCHER" />
 </intent-filter>
 </activity>

meta-data的name = "io.flutter.app.android.SplashScreenUntilFirstFrame"的value一定要設(shè)置成true,一定要設(shè)置成true,一定要設(shè)置成true重要的事情說(shuō)三遍,如果這個(gè)屬性設(shè)置成false,效果是這樣的。

從現(xiàn)象觀察,啟動(dòng)頁(yè)中間有一段時(shí)間黑屏,這個(gè)為什么呢?前面我們說(shuō)過(guò),F(xiàn)lutter的啟動(dòng)流程分成兩部分,一部分是Android啟動(dòng)階段,一個(gè)是Flutter的啟動(dòng)階段,這個(gè)黑屏就是Flutter的啟動(dòng)階段沒(méi)有啟動(dòng)頁(yè)所造成的。我們從源碼入手,詳細(xì)分析一下,下面是FlutterActivityDelegate的部分源碼。

public final class FlutterActivityDelegate
 implements FlutterActivityEvents,
  FlutterView.Provider,
  PluginRegistry {
 private static final String SPLASH_SCREEN_META_DATA_KEY = "io.flutter.app.android.SplashScreenUntilFirstFrame";

 private View launchView;

 @Override
 public void onCreate(Bundle savedInstanceState) {
 String[] args = getArgsFromIntent(activity.getIntent());
 FlutterMain.ensureInitializationComplete(activity.getApplicationContext(), args);
 flutterView = viewFactory.createFlutterView(activity);
 if (flutterView == null) {
 FlutterNativeView nativeView = viewFactory.createFlutterNativeView();
 flutterView = new FlutterView(activity, null, nativeView);
 flutterView.setLayoutParams(matchParent);
 activity.setContentView(flutterView);
 launchView = createLaunchView();//1
 if (launchView != null) {
 addLaunchView();//2
 }
 }
 }

 private View createLaunchView() {
 if (!showSplashScreenUntilFirstFrame()) {//3
 return null;
 }
 final Drawable launchScreenDrawable = getLaunchScreenDrawableFromActivityTheme();
 final View view = new View(activity);
 view.setBackground(launchScreenDrawable);
 return view;
 }

 private Drawable getLaunchScreenDrawableFromActivityTheme() {
 //省略了部分代碼
 try {
 return activity.getResources().getDrawable(typedValue.resourceId);
 } catch (NotFoundException e) {
 return null;
 }
 }

 private Boolean showSplashScreenUntilFirstFrame() {
 try {
 ActivityInfo activityInfo = activity.getPackageManager().getActivityInfo(
 activity.getComponentName(),
 PackageManager.GET_META_DATA|PackageManager.GET_ACTIVITIES);
 Bundle metadata = activityInfo.metaData;
 return metadata != null && metadata.getBoolean(SPLASH_SCREEN_META_DATA_KEY);
 } catch (NameNotFoundException e) {
 return false;
 }
 }

 private void addLaunchView() {
 activity.addContentView(launchView, matchParent);//4
 flutterView.addFirstFrameListener(new FlutterView.FirstFrameListener() {//5
 @Override
 public void onFirstFrame() {
 FlutterActivityDelegate.this.launchView.animate()
  .alpha(0f)
  .setListener(new AnimatorListenerAdapter() {
  @Override
  public void onAnimationEnd(Animator animation) {
  ((ViewGroup) FlutterActivityDelegate.this.launchView.getParent())
  .removeView(FlutterActivityDelegate.this.launchView);//5
  }
  });
 }
 });
 activity.setTheme(android.R.style.Theme_Black_NoTitleBar);
 }
}

注釋1

這個(gè)段代碼很容易理解,創(chuàng)建一個(gè)LaunchView,主要邏輯在createLaunchView()中,原理也很簡(jiǎn)單,根據(jù)主題中的R.attr.windowBackground屬性,生成一個(gè)Drawable,然后創(chuàng)建了一個(gè)View,并且把這個(gè)View的背景設(shè)置成Drawable。

注釋3

showSplashScreenUntilFirstFrame()是得到Manifet中io.flutter.app.android.SplashScreenUntilFirstFrame的屬性的值,如果是false,那么久返回一個(gè)空的的LaunchView,也就不會(huì)執(zhí)行注釋2的代碼。這就是我們上面說(shuō)的如果設(shè)置成false就顯示黑屏的原因。

注釋2

調(diào)用addLaunchView(),這方法也很簡(jiǎn)單,首先看注釋4,把LaunchView添加到當(dāng)前的Activity中,然后添加了一個(gè)監(jiān)聽(tīng),在注釋5處,這個(gè)監(jiān)聽(tīng)是當(dāng)FlutterView第一幀加載完成后回調(diào),回調(diào)做了什么事情呢?很簡(jiǎn)單,把LaunchView刪除了,顯示FlutterView的第一幀。

總結(jié)一下,就是把Android的啟動(dòng)頁(yè)生成一個(gè)Drawable,創(chuàng)建了一個(gè)LaunchView,把Drawable設(shè)置成LaunchView的背景,當(dāng)前的Activity添加這LaunchView,如果FlutterView的第一幀顯示了,把LaunchView刪除。

設(shè)置主題,下面是LaunchTheme的代碼。

<resources>
 <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:windowBackground">@drawable/launch_background</item>
 </style>
</resources>

下面是launch_background的代碼。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
 android:opacity="opaque">
 <item>
 <bitmap android:src="@mipmap/ic_launch_bg" />
 </item>
 <item
 android:width="90dp"
 android:height="90dp"
 android:gravity="center">
 <bitmap android:src="@mipmap/ic_launch_logo" />
 </item>
</layer-list>

最終效果如下,沒(méi)有黑屏,非常順滑。

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對(duì)腳本之家的支持。

相關(guān)文章

最新評(píng)論