跨平台技术篇 - Flutter 框架一览
近期开始学习 Flutter，先来了解一下 Flutter 的整体设计。
Flutter 是一款移动应用 SDK，一份代码可以同时生成 Android 与 iOS 两个高性能，高保真的应用。Flutter 目标是使开发人员能够交付在不同平台上都感觉自然流畅的高性能应用程序。兼容滚动行为、排版、图标等方面的差异。
这是一个来自 Gallery 的演示应用程序， 你可以在安装 Flutter 并设置好环境后运行 Flutter 示例应用程序。"Shrine" 示例拥有高质量的滚动图片、互动卡片、按钮、下拉列表和购物车页面。https://github.com/flutter/flutter/tree/master/examples
无需移动开发经验即可开始使用。应用程序是用 Dart 语言编写的，如果你使用过 Java 或 JavaScript 之类的语言，则这个语言看起来会很熟悉。
Dart 官网：https://www.dartlang.org
Dart 是 Google 开发的计算机编程语言，它被用于 web、服务器、移动应用和物联网等领域的开发。Dart 是面向对象的、类定义的、单继承的语言。它的语法类似 C 语言，可以转译为 JavaScript，支持接口 (interfaces)、混入 (mixins)、抽象类(abstract classes)、具体化泛型 (reified generics)、可选类型 (optional typing) 和 sound type system。
Dart 发展史：
- 发布
Dart 亮相于2011年10月10至12日在丹麦奥尔胡斯举行的 GOTO 大会上，该项目由 Lars bak 和 kasper lund 创建。
- 标准化
Ecma 国际组织组建了技术委员会 TC52 开展 Dart 的标准化工作，并且在 Dart 可以编译为标准 JavaScript 的情况下，它可以在任何现代浏览器中有效地工作。Ecma 国际组织于2014年7月第107届大会批准了 Dart 语言规范第一版，并于2014年12月批准了第二版。
- Flutter
2015年5月 Dart 开发者峰会上，亮相了基于 Dart 语言的移动应用程序开发框架Sky，后更名为 Flutter。
- 新版本
2018年2月，Dart2 成为强类型语言。
为什么要使用Flutter?
使用 Flutter 可以帮助你：
- 提高开发效率
- 同一份代码开发 iOS 和 Android。
- 用更少的代码做更多的事情。
- 轻松迭代
- 在应用程序运行时更改代码并重新加载 (通过热重载)。
- 修复崩溃并继续从应用程序停止的地方进行调试。
- 创建美观，高度定制的用户体验
- 受益于使用 Flutter 框架提供的丰富的 Material Design 和 Cupertino (iOS 风格) 的 widget。
- 实现定制、美观、品牌驱动的设计，而不受原生控件的限制。
核心原则
Flutter 包括一个现代的响应式框架、一个 2D 渲染引擎、现成的 widget 和开发工具。这些组件可以帮助你快速地设计、构建、测试和调试应用程序。
- 一切皆为 widget
Widget 是 Flutter 应用程序用户界面的基本构建块，每个 Widget 都是用户界面一部分的不可变声明。与其他将视图、控制器、布局和其他属性分离的框架不同，Flutter 具有一致的统一对象模型：widget。
Widget 可以被定义为:
- 一个结构元素 (如按钮或菜单)。
- 一个文本样式元素 (如字体或颜色方案)。
- 布局的一个方面 (如填充)。
- 等等…
Widget 根据布局形成一个层次结构，每个 widget 嵌入其中，并继承其父项的属性。没有单独的"应用程序"对象，相反，根widget 扮演着这个角色。你可以通过告诉框架使用另一个 widget 替换层次结构中的 widget 来响应事件，例如用户交互，替换后框架会比较新的和旧的 widget，并高效地更新用户界面。
- 组合 > 集成
Widget 本身通常由许多更小的、单一用途 widget 组成，这些 widget 结合起来产生强大的效果。例如，Container 是一个常用的widget， 由多个 widget 组成，这些 widget 负责布局、绘制、定位和调整大小。具体来说，Container 由 LimitedBox、ConstrainedBox、 Align、 Padding、 DecoratedBox 和 Transform 组成。 你可以用各种方式组合这些以及其他简单的 widget，而不是继承容器。类层次结构很浅且很宽，可以最大限度地增加可能的组合数量。
你还可以通过与其他 widget 组合来控制 widget 的布局。例如，要将 widget 居中，可以将其封装在 Center widget 中。有填充、对齐、行、列和网格的 widget。 这些布局 widget 没有自己的可视化表示，相反，它们唯一的目的是控制另一个 widget 布局的某些方面。要理解 widget 以某种方式呈现的原因，检查相邻 widget 通常很有帮助。
- 分层的框架
Flutter 框架是一个分层的结构，每个层都建立在前一层之上。
该图显示了框架的上层，它比下层的使用频率更高。
这个设计的目标是帮助你用更少的代码做更多的事情。例如，Material 层是通过组合来自 Widget 层的基本 Widget 来构建的， 并且 Widgets 层本身是通过较低级对象渲染层构建的。层为构建应用程序提供了许多选项，选择一种自定义的方法来释放框架的全部表现力，或者使用构件层中的构建块，或混合搭配。 您可以实现 Flutter 提供的所有现成的 widget，或者使用 Flutter 团队用于构建框架的相同工具和技术创建您自己的定制 widget。
你可以从高层次，统一的 widget 概念中获得开发效率优势，而不会牺牲你希望深入到下层的能力。
- 构建widget
你可以通过实现 widget 的 build 返回 widget 树 (或层次结构) 来定义 widget 的独特特征。这棵树更具体地表示了用户界面的widget 层次。例如，工具栏 widget 的 build 函数可能返回一个包含一些文本和各种按钮的水平布局。 然后，框架递归地构建widget，直到该所有 widget 构建完成，然后 framework 它他们一起添加到树中。
widget 的构建函数一般没有副作用。每当它被要求构建时，widget 应该返回一个新的 widget 树，无论 widget 以前返回的是什么。 Framework 会将之前的构建与当前构建进行比较并确定需要对用户界面进行哪些修改。
这种自动比较非常有效，可以实现高性能的交互式应用程序。而构建函数的设计则着重于声明 widget 是由什么构成的，而不是将用户界面从一个状态更新到另一个状态的 (这具有复杂性)，从而简化了代码。
- 处理用户交互
如果 widget 需要根据用户交互或其他因素进行更改，则该 widget 是有状态的。例如，如果一个 widget 的计数器在用户点击一个按钮时递增，那么该计数器的值就是该 widget 的状态。 当该值发生变化时，需要重新构建 widget 以更新 UI。
这些 widget 将继承 StatefulWidget (而不是 State) 并将它们的可变状态存储在 State 的子类中。
每当你改变一个 State 对象时 (例如增加计数器)，你必须调用 setState() 来通知框架，框架会再次调用 State 的构建方法来更新用户界面。
有了独立的状态和 widget 对象，其他 widget 可以以同样的方式处理无状态和有状态的 widget，而不必担心丢失状态。 父widget 可以*地创造子 widget 的新实例且不会失去子 widget 的状态，而不是通过持有子 widget 来维持其状态。 框架在适当的时候完成查找和重用现有状态对象的所有工作。
总结
- 快速开发：Flutter 的热重载可以快速地进行测试、构建 UI、添加功能并更快地修复错误。
- 富有表现力，漂亮的用户界面：自带的 Material Design 和 Cupertino (iOS 风格) widget、丰富的 motion API、平滑而自然的滑动效果。
- 响应式框架：使用 Flutter 的现代、响应式框架，和一系列基础 widget，轻松构建你的用户界面。
- 访问本地功能和 SDK：Flutter 可以复用现有的 Java、Swift 或 ObjC 代码，访问 iOS 和 Android 上的原生系统功能和系统SDK。
- 统一的应用开发体验：Flutter 拥有丰富的工具和库，可以帮助开发者轻松地同时在 iOS 和 Android 系统中实现想法和创意。
- 原生性能：Flutter 包含了许多核心的 widget，如滚动、导航、图标和字体等，这些都可以在 iOS 和 Android 上达到原生应用一样的性能。
最具有吸引力的就是统一的应用开发体验，一套代码运行在多个平台，以及它的热重载。