Flutter框架简要介绍

什么是Flutter?

Flutter is a mobile app SDK for building high-performance, high-fidelity, apps for iOS and Android, from a single codebase.

这是谷歌给Flutter的定义，可以看到，Flutter是面向iOS和Android应用，提供一套基础代码的高性能高可靠软件开发工具包，使开发者能够在iOS和Android两个最主要的移动平台上，打造统一代码的高性能应用，这是Flutter的主要目标

Flutter有什么优点

• 高生产率
  • 一套代码可以开发出 Android 和 iOS 应用
  • Dart语言优越性，使得同样的功能只需要很少的代码。
  • 迭代更加方便， hot reload 功能
• 创建优雅的、高度可定制的用户界面
  • Flutter 内置了对Material Design和Cupertino (iOS-flavor)的 UI 组件库
  • 提供了可定制的 UI 组件，不再受制于OEM控件的限制

Flutter架构

Flutter 系统架构

Flutter 分为两个部分，上层是函数响应式的Framework（开源），下层是Engine，可以这样理解，基于Framework开发App，在Engine里运行。

与RN的区别

Flutter 视图原理

RN 视图原理

Flutter将UI组件和渲染器从平台移动到应用程序中，这使得它们可以自定义和可扩展。Flutter唯一要求系统提供的是canvas，以便定制的UI组件可以出现在设备的屏幕上。Dart程序和执行数据编码和解码的原生平台代码（蓝色，适用于iOS或Android）之间仍然有一个接口，但这能比JavaScript桥接器快几个数量级。

Flutter 工程结构

官方推荐的集成开发环境是IntelliJ，工程的层次结构大致是这样的：

Paste_Image.png

可以看到，Flutter框架自动生成了android目录和ios目录，并且框架已经做好了粘合两种平台的连接代码，开发者只需要在lib目录用Dart语言，基于其Framework编写App，即实现了一套代码产生两个平台的App。其中：

• Android：底层引擎是C++代码通过Android的NDK编译，上层通过Dart编译器编译，以native code方式运行
• iOS：底层引擎是C++代码通过LLVM编译，上层通过AOT-compiled，也是以native code方式运行

Everything’s a Widget

Widget 是每个 Flutter 应用的基础。每个 Widget 是一部分用户界面上不可变的定义。和其他框架把 View、controller、 Layout 和其他资源分开定义不一样，Flutter 具有一致的、唯一的对象模型—— Widget：

• 一个结构性的元素（比如 按钮或者菜单）
• 一个元素的风格（比如 字体或者颜色）
• 指定布局属性（比如 padding）
• 也可以包含一些业务逻辑
• 其他…

Widget 通过组合来组成层级结构。每个 Widget 都内嵌在父 Widget 中，并继承父 Widget 的属性。 并没有单独的 “application” 对象，根 Widget 扮演这个角色。Widget 可以响应用户事件来改变 UI，比如用户点击了一个按钮把一个 Widget 替换为另外一个 Widget。框架会比较变化前后 UI 的差异，并高效的更新 UI。

Paste_Image.png

• Widget Framework相关
• Widget
• Widget布局

部分FAQ

1. Flutter引擎有多大？
   官网说最小是6.7MB，我新建一个最简单的demo，编译出来一共7.1MB，整个引擎的大小还算是比较小的
2. “hot reload”是怎么做到的？
   hot reload 的原理是插桩，类似instant run，debug模式下，对每一个方法和成员进行插桩，运行时期reload就生效了，无需重新安装
   注意：全局变量初始化、静态成员初始化、main方法不能热加载。
3. 是否可以在原来的基础上，使用Flutter继续开发？
   可以，不过需要修改一些东西，包括入口和相互调用（需待研究）
4. Flutter是否有反射和依赖注入框架
   目前还没有
   ...

小结

Flutter以一种类似游戏引擎，提供通过类似游戏开发的方式，以一套代码生成Android和iOS平台两种应用，很大程度上减少了App开发和维护的资源，同时Dart语言强大的性能表现和丰富的特性，使得开发比较便利，但是Flutter目前还处于Alpha阶段，许多功能还不是特别完善，完全替代目前Android和iOS开发还有比较长的路要走。

参考

flutter官网
flutter github
Dart