Flutter 2 源碼閱讀

進行源碼分析之前，先了解一下官方文檔中提供的核心架構圖，它也代表著整個 Flutter 架構,。

Flutter 的架構主要分成三層：Framework，Engine 和 Embedder。

1),、Framework：Framework

使用 dart 實現(xiàn)，包括 Material Design 風格的 Widget，Cupertino(針對 iOS)風格的 Widgets，文本/圖片/按鈕等基礎 Widgets，渲染，動畫，手勢等。此部分的核心代碼是：flutter 倉庫下的 flutter package，以及 sky_engine 倉庫下的 io，async ，ui (dart:ui 庫提供了 Flutter 框架和引擎之間的接口)等 package,。其中 dart:ui 庫是對 Engine 中 Skia 庫的 C++ 接口的綁定,。向上層提供了 window、text,、canvas 等通用的繪制能力，通過 dart:ui 庫就能使用 Dart 代碼操作 Skia 繪制引擎,。所以我們實際上可以通過實例化 dart:ui 包中的類（例如 Canvas、Paint 等）來繪制界面,。然而，除了繪制，還要考慮到協(xié)調布局和響應觸摸等情況，這一切實現(xiàn)起來都異常麻煩，這也正是 Framework 幫我們做的事,。渲染層 Rendering 是在 :🎯ui 庫之上的第一個抽象層，它為你做了所有繁重的數(shù)學工作。為了做到這一點，它使用 RenderObject 對象，該對象是真正繪制到屏幕上的渲染對象,。由這些 RenderObject 組成的樹處理真正的布局和繪制,。

2)、Engine：Engine

使用 C++ 實現(xiàn)，主要包括：Skia，Dart 和 Text,。Skia 是開源的二維圖形庫，提供了適用于多種軟硬件平臺的通用 API,。在安卓上，系統(tǒng)自帶了 Skia，在 iOS 上，則需要 APP 打包 Skia 庫，這會導致 Flutter 開發(fā)的 iOS 應用安裝包體積更大。 Dart 運行時則可以以 JIT,、JIT Snapshot 或者 AOT 的模式運行 Dart 代碼,。

3)、Embedder：Embedder

是一個嵌入層，即把 Flutter 嵌入到各個平臺上去，這里做的主要工作包括渲染 Surface 設置，線程設置，以及插件等,。從這里可以看出，Flutter 的平臺相關層很低，平臺（如 iOS）只是提供一個畫布，剩余的所有渲染相關的邏輯都在 Flutter 內部，這就使得它具有了很好的跨端一致性。