介紹

Flutter應用是由平台來建立、初始化并啟動的，這裡我們以android為例，對啟動過程做一個走馬觀花式的了解,旨在對平台端的工作有個大緻了解。

Android端的啟動流程

啟動流程實際上還涉及了很多native 層的工作，但是宥于篇幅，暫且隻看Android端。

FlutterApplication

Flutter——在Android平台上的啟動流程淺析介紹Android端的啟動流程系列文章

flutter應用下，原生的啟動流程并沒有什麼變化，我們來看Application的onCreate函數。

@Override
  @CallSuper
  public void onCreate() {
    super.onCreate();
    FlutterMain.startInitialization(this);
  }

很簡單，繼續往裡走

public static void startInitialization(@NonNull Context applicationContext) {
    if (isRunningInRobolectricTest) {
      return;
    }
    FlutterLoader.getInstance().startInitialization(applicationContext);
  }

按上面方法的注釋來看，是初始化 native system（即C++）的，最終會調用下面的方法：

我将說明以注釋的形式寫在下面

public void startInitialization(@NonNull Context applicationContext, @NonNull Settings settings) {
    
    if (this.settings != null) {
      return;
    }
    ///確定運作在 主線程
    if (Looper.myLooper() != Looper.getMainLooper()) {
      throw new IllegalStateException("startInitialization must be called on the main thread");
    }

    // Ensure that the context is actually the application context.
    final Context appContext = applicationContext.getApplicationContext();

    this.settings = settings;

    initStartTimestampMillis = SystemClock.uptimeMillis();
    
    ///配置 aotSharedLibraryName、flutterAssetsDir、
    ///      vmSnapshotData、isolateSnapshotData
    ///等參數
    
    initConfig(appContext);
    ///初始化VsyncWaiter，并設定回調
    /// 當vsync信号到來時，就調用我們設定的回調，最終會觸發頁面的重新整理
    VsyncWaiter.getInstance((WindowManager) appContext.getSystemService(Context.WINDOW_SERVICE))
        .init();

    // 子線程
    
    ///這裡主要是抽取資源檔案，
    ///加載 flutter（架構）代碼
    Callable<InitResult> initTask =
        new Callable<InitResult>() {
          @Override
          public InitResult call() {
            ResourceExtractor resourceExtractor = initResources(appContext);

            System.loadLibrary("flutter");

            // Prefetch the default font manager as soon as possible on a background thread.
            // It helps to reduce time cost of engine setup that blocks the platform thread.
            Executors.newSingleThreadExecutor()
                .execute(
                    new Runnable() {
                      @Override
                      public void run() {
                        FlutterJNI.nativePrefetchDefaultFontManager();
                      }
                    });

            if (resourceExtractor != null) {
              resourceExtractor.waitForCompletion();
            }

            return new InitResult(
                PathUtils.getFilesDir(appContext),
                PathUtils.getCacheDirectory(appContext),
                PathUtils.getDataDirectory(appContext));
          }
        };
    initResultFuture = Executors.newSingleThreadExecutor().submit(initTask);
  }

至此FlutterApplication 的相關流程就走完了。

另外，雖然上面的代碼中使用了子線程，但是最終在這些任務沒有完成前，是不會進入flutter側的，我們接着走FlutterActivity。

FlutterActivity & onCreate

Flutter——在Android平台上的啟動流程淺析介紹Android端的啟動流程系列文章

開始的地方依然是 onCreate()方法：

@Override
  protected void onCreate(@Nullable Bundle savedInstanceState) {
  	///切換主題
    switchLaunchThemeForNormalTheme();

    super.onCreate(savedInstanceState);
	///通知生命周期
    lifecycle.handleLifecycleEvent(Lifecycle.Event.ON_CREATE);
	
    ///初始化delete，這個很重要，
    ///所有的工作都是由它來完成的
    delegate = new FlutterActivityAndFragmentDelegate(this);
    delegate.onAttach(this);
    ///是否需要恢複（包括通知插件）一些狀态
    delegate.onActivityCreated(savedInstanceState);
	///配置視窗
    configureWindowForTransparency();
    ///建立flutterView
    setContentView(createFlutterView());
    configureStatusBarForFullscreenFlutterExperience();
  }

這裡面比較重的代碼是這幾行:

delegate = new FlutterActivityAndFragmentDelegate(this);
    delegate.onAttach(this);
    ...
    setContentView(createFlutterView());

我們一步一步來,首先建立了FlutterActivityAndFragmentDelegate 并調用了它的attact(this)方法。

FlutterActivityAndFragmentDelegate

void onAttach(@NonNull Context context) {
    ensureAlive();
	///初始化engine
    if (flutterEngine == null) {
    ///這裡面會對已有的engine進行複用
      setupFlutterEngine();
    }
	
    ///初始化平台插件
    ///本質上，是将engine的 channel回調與平台的系統服務進行綁定
    ///如：震動、複制粘貼、聲音播放等...
    platformPlugin = host.providePlatformPlugin(host.getActivity(), flutterEngine);

    if (host.shouldAttachEngineToActivity()) {

      Log.v(TAG, "Attaching FlutterEngine to the Activity that owns this Fragment.");
      /// 激活 原生viewController
      /// 并通知相關插件
      /// PlatformViewsController 這個類你應該很熟悉（如果你接入過原生view的話）
      flutterEngine
          .getActivityControlSurface()
          .attachToActivity(host.getActivity(), host.getLifecycle());
    }
	///注冊插件
    ///通過反射調用 “io.flutter.plugins.GeneratedPluginRegistrant”
    ///的 “registerWith”方法，這個過程走完了，你的插件基本就能用了
    host.configureFlutterEngine(flutterEngine);
  }

通過上面，我們大緻了解了，在flutter端使用的平台功能是什麼時候裝配的了。

我們回到FlutterActivity，繼續重要的第二步:

setContentView(createFlutterView());

  @NonNull
  private View createFlutterView() {
    return delegate.onCreateView(
        null /* inflater */, null /* container */, null /* savedInstanceState */);
  }

這裡插一句，可以看一下這篇文章：

Flutter&Android 啟動頁（閃屏頁）的加載流程和優化方案

最終會調用 delete的onCreateView :

@NonNull
  View onCreateView(
      LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    Log.v(TAG, "Creating FlutterView.");
    ensureAlive();

    if (host.getRenderMode() == RenderMode.surface) {
    
    	///一般flutter應用是 RenderMode.surface，是以會進入到這裡
        ///建立FlutterSurfaceView
      FlutterSurfaceView flutterSurfaceView =
          new FlutterSurfaceView(
              host.getActivity(), host.getTransparencyMode() == TransparencyMode.transparent);

      // Allow our host to customize FlutterSurfaceView, if desired.
      host.onFlutterSurfaceViewCreated(flutterSurfaceView);

      // flutterView 建立完成後，便會調用addView
      //将 flutterSurfaceView 顯示出來，隻不過啥都沒有而已
      flutterView = new FlutterView(host.getActivity(), flutterSurfaceView);
    } else {
      ...省略代碼...
    }

    // Add listener to be notified when Flutter renders its first frame.
    flutterView.addOnFirstFrameRenderedListener(flutterUiDisplayListener);

    flutterSplashView = new FlutterSplashView(host.getContext());
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
      flutterSplashView.setId(View.generateViewId());
    } else {

      flutterSplashView.setId(486947586);
    }
    ///這裡顯示閃屏頁 預設是個白屏
    ///即，AndroidMainfest.xml 的<metadata>所設定
    flutterSplashView.displayFlutterViewWithSplash(flutterView, host.provideSplashScreen());

    ///将flutterview 綁定到 engine上
    flutterView.attachToFlutterEngine(flutterEngine);

    return flutterSplashView;
  }

flutterView 内部持有flutterSurfaceView （一個Surface），并最終通過attachToFlutterEngine綁定到engine上，我們來看一下其内部實作：

public void attachToFlutterEngine(@NonNull FlutterEngine flutterEngine) {
  
   ...省略部分代碼...

    this.flutterEngine = flutterEngine;

    ///通過engine的 getRenderer，
    ///可以将flutter的紋理繪制到android 上。
    FlutterRenderer flutterRenderer = this.flutterEngine.getRenderer();
    isFlutterUiDisplayed = flutterRenderer.isDisplayingFlutterUi();
    renderSurface.attachToRenderer(flutterRenderer);
    flutterRenderer.addIsDisplayingFlutterUiListener(flutterUiDisplayListener);

    ...省略部分代碼...
    
    ///輸入插件
    textInputPlugin =
        new TextInputPlugin(
            this,
            this.flutterEngine.getTextInputChannel(),
            this.flutterEngine.getPlatformViewsController());
    ///國際化插件
    localizationPlugin = this.flutterEngine.getLocalizationPlugin();
    ///與上面的textInputPlugin相關聯
    androidKeyProcessor =
        new AndroidKeyProcessor(this.flutterEngine.getKeyEventChannel(), textInputPlugin);
        
     /// 觸摸事件的初始化
     /// 相關觸摸資料會發送到flutter端
    androidTouchProcessor = new AndroidTouchProcessor(this.flutterEngine.getRenderer());
    ///輔助功能
    accessibilityBridge =
        new AccessibilityBridge(
            this,
            flutterEngine.getAccessibilityChannel(),
            (AccessibilityManager) getContext().getSystemService(Context.ACCESSIBILITY_SERVICE),
            getContext().getContentResolver(),
            this.flutterEngine.getPlatformViewsController());
   
   ...省略部分代碼...

    ///通過上面的初始化，将使用者相關的設定發送到flutter端
    sendUserSettingsToFlutter();
    localizationPlugin.sendLocalesToFlutter(getResources().getConfiguration());
    sendViewportMetricsToFlutter();
	
    ///将目前flutter view 綁定到 PlatformViewsController
    flutterEngine.getPlatformViewsController().attachToView(this);

    ...省略部分代碼...
  }

相關初始化工作完成，activity的生命周期也從onCreate來到了onStart()

FlutterActivity & onStart()

@Override
  protected void onStart() {
    super.onStart();
    lifecycle.handleLifecycleEvent(Lifecycle.Event.ON_START);
    ///重要入口
    delegate.onStart();
  }

delegate.onStart()此方法最終會調用doInitialFlutterViewRun（）方法：

private void doInitialFlutterViewRun() {
    
	...省略部分代碼...
	
    // 這裡就是擷取我們打包所得的 libapp.so路徑
    // 即，我們所寫的dart代碼，并執行它
    DartExecutor.DartEntrypoint entrypoint =
        new DartExecutor.DartEntrypoint(
            host.getAppBundlePath(), host.getDartEntrypointFunctionName());
    flutterEngine.getDartExecutor().executeDartEntrypoint(entrypoint);
  }

至此整個android端的啟動流程就走完了，這裡再回顧總結一下。

總結

在flutterApplication中：

初始化一些資源路徑，配置相關參數
抽取資源并加載(assets)
加載flutter.so關鍵庫
    - 最終走JNI_OnLoad 進入native進行相關工作
    - 如綁定flutter jni
初始化vsyncWaiter

在flutterActivity中：

會初始化重要類FlutterActivityAndFragmentDelegate
activity端的生命周期，也會觸發delegate來對應回調
對平台的系統功能（震動、剪貼闆）進行綁定
初始化platformViewController以及系統channel
建立flutterView（内部持有一個surfaceView）
    - 會最終進入native進行engine的初始化工作
在onStart生命周期中加載咱們的dart代碼，開始執行

在這整個過程中，會穿插進行native層的工作，并最終通過native層的調用，轉到flutter端的main()函數，由于這裡的内容很多，将會在後面的文章中介紹。

最後，謝謝大家的閱讀，如果有不對的地方，還請指出。

系列文章

Flutter 仿網易雲音樂App

Flutter&Android 啟動頁（閃屏頁）的加載流程和優化方案

Flutter版仿.知乎清單的視差效果

Flutter——實作網易雲音樂的漸進式卡片切換

Flutter 仿同花順自選股清單

Flutter——在Android平台上的啟動流程淺析介紹Android端的啟動流程系列文章

介紹

Android端的啟動流程

FlutterApplication

FlutterActivity & onCreate

FlutterActivityAndFragmentDelegate

FlutterActivity & onStart()

總結

系列文章

繼續閱讀

javascript的for (var i in data)慎用javascript中的for (var i in data)謹慎用

android SQLite事務和kotlin協程

無法正常編譯錯誤Compilation failed to complete

關于Gradle配置的小結

tab滑鼠經過菜單切換

ACS基本配置-權限等級管理

vue （vue2.0）使用總結(從大體結構總結)

父子元件間傳值的實作父子元件間傳值的實作

vue搭建過程及出現問題

/\B(?=(?:\d{3})+$)/g 一條令人費解的正規表達式

适用于JavaScript的ECMAScript 2020規範向前發展

JS生成uuid的四種方法

AOP程式設計_Android優雅權限架構(1)概念基礎，2021金三銀四前言正文大綱正文

Android APK檔案反編譯Android APK檔案反編譯

layui多任務上傳添加進度條