网站建设公司网址,东莞人才市场招聘官网,查看网站有没有做301,如何用dreamer做网站本文出处#xff1a;Flutter 中文开发者网站
架构 embedder嵌入层
提供程序入口#xff08;其他原生应用也采用此方式#xff09;#xff0c;程序由此和底层操作系统协调#xff08;surface渲染、辅助功能和输入服务#xff0c;管理事件循环…本文出处Flutter 中文开发者网站
架构 embedder嵌入层
提供程序入口其他原生应用也采用此方式程序由此和底层操作系统协调surface渲染、辅助功能和输入服务管理事件循环队列
嵌入层在android采用java和c编写苹果系采用object-c和object-C,Windows和linux是c
Engine引擎--核心
采用C编写提供了flutter应用所需的原语核心api的底层实现
引擎将底层 C 代码包装成 Dart 代码通过 dart:ui 暴露给 Flutter 框架层
补充android和ios采用impeller渲染图形其他平台采用skia鸿蒙arkui也是使用的skia
Framework框架层
开发者通过此层和flutter交互
build方法
build方法就是将状态转换为ui的方法widget重写该方法声明ui
此方法在框架需要时可以被调用常规是一个渲染针一次
--得利于dart语言的可以快速实例化和清除对象
应用根据事件交互同志框架替换旧widget为新widget
flutter拥有自己的ui控制实现而不是由系统自带的方法进行托管
Widget
flutter对于widget的准则是widget由更小的用途单一的widget组成
两种核心的 widget 类有状态的 和 无状态的 widget
widget 则需要被重建以更新相关部分的 UI。这些 widget 会继承 StatefulWidget并且「可变的」状态会保存在继承 State 的另一个子类中因为 widget 本身是不可变的。 StatefulWidget 自身没有 build 方法而在其对应的 State 对象中
每当你更改 State 对象时例如计数增加你需要调用 setState() 来告知框架再次调用 State 的构建方法来更新 UI
将状态和 widget 对象分离可以使其他 widget 无差异地看待无状态和有状态 widget而不必担心丢失状态
渲染方式
react native等跨平台框架一般在android和ios的ui底层库上建立一层抽象使用js等代码与android和ios系统交互构建ui界面
flutter上文提到额使用自己的widget绘制flutter图像的dart代码被编译为机器码并使用skia渲染
flutter嵌入了自己的skia副本使得开发者可以不用最新的系统也能跟进系统升级跟新自己的应用
flutter绘制代码片段时调用build方法返回一个基于当前状态的widget树build方法会在必要时引入其他的widget--如指定colorcoloredBox会被加入用于颜色布局
构建阶段flutter将widgets转换为对应的element树
在渲染树中每个节点的基类都是 RenderObject该基类为布局和绘制定义了一个抽象模型。这是再平凡不过的事情它并不总是一个固定的大小甚至不遵循笛卡尔坐标规律根据该 极坐标系的示例 所示。每一个 RenderObject 都了解其父节点的信息但对于其子节点除了如何 访问 和获得他们的布局约束并没有更多的信息。这样的设计让 RenderObject 拥有高效的抽象能力能够处理各种各样的使用场景。
在构建阶段Flutter 会为 Element 树中的每个 RenderObjectElement 创建或更新其对应的一个从 RenderObject 继承的对象。 RenderObject 实际上是原语渲染文字的 RenderParagraph、渲染图片的 RenderImage 以及在绘制子节点内容前应用变换的 RenderTransform 是更为上层的实现。
大部分的 Flutter widget 是由一个继承了 RenderBox 的子类的对象渲染的它们呈现出的 RenderObject 会在二维笛卡尔空间中拥有固定的大小。 RenderBox 提供了 盒子限制模型为每个 widget 关联了渲染的最小和最大的宽度和高度。
平台嵌入层
平台嵌入层是flutter引擎一部分充当宿主操作系统和flutter之间的粘合剂
开发者可以创建自定义的嵌入层如https://github.com/ardera/flutter-pi是支持树莓派运行的例子 与其他代码集成
flutter提供通过平台通道调用自定义代码的能力
通过创建一个常用的通道封装通道名称和编码开发者可以在 Dart 与使用 Kotlin 和 Swift 等语言编写的平台组件之间发送和接收消息。数据会由 Dart 类型例如 Map序列化为一种标准格式然后反序列化为 Kotlin例如 HashMap或者 Swift例如 Dictionary中的等效类型。 外部函数接口
dart:ffi库提供了一套直接绑定原生代码的机制比平台通道更快不用序列化就可以传输数据
flutter中渲染原生内容
flutter引入了平台widget解决在flutter应用展示原生组件的问题 目前桌面平台尚未支持平台视图但这并不是一个架构层面的限制。未来可能将增加对桌面平台的支持
即成flutter widget至原生应用
Flutter 模块模板设计简单易于嵌入。开发者可以将其作为源代码依赖项集成到 Gradle 或 Xcode 构建定义中或者将其打包成 Android Archive (AAR) 或 iOS Framework 二进制供其他开发者使用而无需安装 Flutter。
Flutter 引擎需要一段短暂的时间做初始化用于加载 Flutter 的共享库、初始化 Dart 的运行时、创建并运行 Dart isolate 线程并将渲染层与 UI 进行绑定。为了最大限度地减少呈现 Flutter 界面时的延迟最好是在应用初始化时或至少在第一个 Flutter 页面展示前一并初始化 Flutter 引擎如此一来用户不会在首个 Flutter 页面加载时感到突然地卡顿。另外Flutter 的引擎分离使得多个 Flutter 页面可以复用引擎共享必要库加载时的内存消耗。
flutter对于web的支持
Dart 语言存在之初就已经支持直接编译成 JavaScript并且针对开发和生产目的对其工具链进行了优化。许多重要的应用已经使用 Dart 编译成的 JavaScript 在生产环境上运行包括 Google Ads 的广告商工具。
然而使用 C 编写的 Flutter 引擎是为了与底层操作系统进行交互的而不是 Web 浏览器。因此我们需要另辟蹊径。Flutter 在 Web 平台上以浏览器的标准 API 重新实现了引擎。目前我们有两种在 Web 上呈现内容的选项HTML 和 WebGL。在 HTML 模式下Flutter 使用 HTML、CSS、Canvas 和 SVG 进行渲染。而在 WebGL 模式下Flutter 使用了一个编译为 WebAssembly 的 Skia 版本名为 CanvasKit。 HTML 模式提供了最佳的代码大小CanvasKit 则提供了浏览器图形堆栈渲染的最快途径并为原生平台的内容5提供了更高的图形保真度。 Flutter 框架本身和应用程序代码将一并编译成 JavaScript。同时Dart 在不同模式下JIT 和 AOT、平台原生和 Web 编译的语义几乎没有差异大部分开发者绝对可以无差异地编写这两种模式下的代码。
在进行开发时Web 版本的 Flutter 使用支持增量编译的编译器 dartdevc 进行编译以支持应用热重启尽管目前尚未支持热重载。相反当你准备好创建一个生产环境的 Web 应用时Dart 深度优化的编译器 dart2js 将会用于编译将 Flutter 核心框架和你的应用打包至缩小的源文件中可部署在任何服务器上。代码可以在单个文件中提供也可拆分至多个文件以 延迟加载库 提供。
