【Flutter入门到进阶】跨平台相关

进阶】跨平台相关"/>

【Flutter入门到进阶】跨平台相关

1.回顾Android渲染机制工作流程

1.1  图例

1.2 说明 

1.Android内部自己通过skia引起完成图像构建

2.Android通过surfacefilinger来完成图像与驱动之间的处理 

2 自建渲染引擎渲染方案

        自建渲染引擎渲染方案，是有别于Web渲染采用WebView容器进行渲染UI、原生渲染通过Bridge方式转化为原生控件渲染UI等方案，另辟蹊径通过自建渲染引擎方式，直接从底层 渲染上实现UI的绘制，而Flutter就是跨平台、自渲染的代表。

2.1 结构

 2.1.1 图例

 2.1.2 说明

1、Dart App 层

        最顶层是 Dart App 层，以 Widget 为基本视图描述单元，构建起 UI 体系

2、Flutter Framework 层

        内置基础的 Flutter 组件，并根据不同平台的视觉风格体系，封装 Material 和 Cupertino 两套 UI 库供上层使用

3、Flutter Engine 层

        Flutter 框架的核心所在，包括 Dart 虚拟机、Skia 跨平台渲染引擎、文字排版、平台通道等，通过 Engine 层，建立起 Dart App 层和原生平台之间联系，从而实现二者的双向通信

4、Embedder 层

        平台嵌入层为 Flutter App 提供宿主环境、线程创建以及基于插件机制的原生能力扩展等，Flutter 在打包的时候，将 Dart 业务代码和 Flutter Engine 代码基于 iOS/Android 不同平台分别进行打包。Native 在启动时会通过调用 C++ 的各自实现（Java 通过 JNI，OC 天然支持）初始化 Flutter Engine 层提供的接口，创建 UI/GPU/IO 三个线程和实例化 Dart VM。Dart 业务代码在 Release 模式下采用 AOT 的方式进行编译，并运行在 Dart VM 中

2.2 总结 

        1、Flutter通过Dart解决代码适配问题

        2、Flutter通过Framework解决UI风格不统一问题 

        3、Flutter通过自建渲染引擎，绕过Android和iOS的绘制流程，完成图片的生成

        4、Flutter通过嵌入层完成对于不同系统的图像数据推送方案