我家小花儿

这个屌丝很懒，什么也没留下！

热门标签

化解Android 和iOS“恩怨”的Flutter ,凭的是什么？_ios团队和flutter团队

作者：我家小花儿 | 2024-04-02 22:20:29

踩

ios团队和flutter团队

移动研发由来已久，从早期的 J2ME 开始，到后来居上的 Windows Mobile 、 Symbian ，小众却各领风骚的 BREW 、 Palm 、 BlackBerry ，以及当前几乎平分市场的 Android 和 iOS 。面对如此多的平台和技术，开发者可以择其优者而习之，公司却不得不兼而用之，但随之而来的必然是成本的上升。

因此，跨平台的呼声一直很高，各种方案也不断面世： PhoneGap( 即 Cordova) 、 React Native 、 WEEX 以及最近的 Flutter 。 Flutter 无疑是其中的佼佼者，一经问世就已引起广泛关注，无论是其革新的理念，还是其“正统的出身”（毕竟 Flutter 与当今两大移动平台之一 Android 师出同门）。

在有多种选择时总要进行一番对比，孰优孰劣众说纷纭，抱着小马过河的心态，各大公司也不乏实践，做出一些有益的尝试。接到本书的翻译任务时，正值译者将 Flutter 技术尝试运用于公司的 ToB 项目之刻。

《 Flutter实战》既然名为实战，内容紧扣主题，不会涉及太多概念介绍、原理深究，一切以实用为目的，是快速入门的好帮手。作者Frank Zammetti 深耕移动研发多年、亲历跨平台技术发展，并且撰写了多部相关技术书籍，是一位当仁不让的资深技术专家。值得一提的是，Frank Zammetti 言语诙谐、娓娓道来，令读者在阅读时宛如与真人对话一般，确实是一种不可多得的阅读体验。

望读者在阅读的同时，亲自实践 ( 下载源码并在模拟器或手机上运行 ) 一番以加深理解。

节选自《 Flutter实战》一书

-------------------------------------图书基本信息----------------------------------------------------

书名：《 Flutter实战》

ISBN:9787302556084

定价：79.8

出版时间：2020年7月

京东移动端链接： https://item.m.jd.com/product/ 12900254 .html

内容简介：

《 Flutter实战》围绕Flutter的跨平台能力及其来龙去脉展开讲解。当今，移动开发领域发展迅速，Flutter是由Google公司推出的开源移动应用开发SDK，使用Flutter可以为Android、iOS和Google Fuchsia系统开发应用。
　　通过学习本书，你将掌握三个可直接安装在自己的移动设备上并实际体验的应用(个人信息管理、聊天系统和游戏)。你将扎实掌握Flutter基础知识，并由此快速构建两个常见应用，你还将通过学习构建游戏项目，从完全不同的角度了解Flutter的强大功能。通过构建这三个应用，你将了解现实世界中发生的问题，并通过相关提示及技巧掌握解决办法，所有这些都将使你的Flutter学习高效且充满乐趣！
　　本书将使你掌握使用Flutter构建应用的能力，进而可以自行构建更高级的应用。完成本书的学习后，你将站在更高的起点并且能够做好充分准备，在Flutter开发领域从容应对任何挑战。本书是学习Flutter不可错过的经典作品。

----------------------------------------样章试读--------------------------------------------------------

第1 章

█ █ █

初识Flutter

欢迎来到起跑线！

如果向十个移动开发者问起：他们是如何在Android 和iOS 设备上开发移动应用

的？你很可能得到十种不同的回复。不过由于新技术Flutter 的出现，这样的情形可能

不会持续太久。

在本章中，我们将聚焦移动开发，讲解Flutter 在移动开发方面扮演的角色，及其

在某些方面是如何彻底改变移动开发的。我们将初步理解Flutter 的方方面面，为在本

书随后的部分构建一些真正的应用做好准备。

好了，让我们这就开始吧，下面首先介绍一点儿有关移动开发的内容。

1.1 在深渊中沉思

软件开发无易事！

对有些人来说，编程就是家常便饭，我也是其中一员。我不是要炫耀我的个人经

历而让你觉得无聊，而事实是从7 岁那年起，我就已经开始使用各种方式进行编程了。

也就是说，我从事这个行业已经快40 年了(其中有25 年从事专职软件开发)。经历了

这么多，我领悟到一个真谛，正如开篇所说：软件开发无易事。不可否认，有些独立

的任务和项目可以轻松搞定；但总的来说，我们程序员从事的是一项从根本上就相当

棘手的工作。

而且我还没提及移动开发呢，它可能更难！

大约二十年前，我开始从事移动开发工作。那时还是Microsoft 公司的Windows

CE/PocketPC 系统和Palm 公司的PalmPilot 系列设备及其PalmOS 系统(尽管还有一些

其他的设备和操作系统，但可以说，在一定程度上它们是当时的主流)的天下。就这一

点来说，移动开发还不是太糟糕：只需要关注有限的几种设备及功能，并且在开发工

具方面也并不缺乏。虽然这些工具不像今天我们所使用的那样优秀，但基本上只有一

种用于开发PocketPC 或PalmOS 应用的方式，而不是有一大堆的选择。这听上去糟透

了，并且在某些方面的确十分糟糕，但选择减少的同时也省去了开发者的困扰，而选

择的多寡正是当今软件工程领域最大的争议之一。

另外，当时完全没有人意识到要进行跨平台开发。如果需要在两个平台上运行，

只能各自编写一套代码，而这在今天看来是多么不可思议。不过在当时，只需要考虑

两个平台的差异性，编写两次代码也就不那么令人难以接受了。你很容易就能找出一

个应用在不同平台上的特性，因为开发者不可能或无法将其从一个平台迁移到另一个

平台(事实上，最大的理由是，这样做并不值得付出相应的时间和精力)。

从那时起，移动开发领域经历了诸多革新，见证了诸多改变、扩张与收缩。一段

时间以来，我们需要支持诸多平台：Android、iOS、webOS、Tizen、Windows Mobile，

也许还有其他一些我未记住的平台。在那个年代，在各平台间迁移应用仍然十分普遍，

因为并没有一种好用的跨平台解决方案，至少没有一种不做出重大妥协。是的，随着

时间的推移，迁移变得更友好，因为至少原生开发工具有了长足改进，尽管你不得不

为同一个应用编写多次代码，但是每次编写都较过去容易不少。Apple 公司于2008 年

发布了iOS SDK，随后Google 也于一年后发布了Android SDK，而为这两种平台开发

应用意味着(直到今天仍然是)使用两种SDK，因为iOS 开发使用的是Objective-C 语言

(现在Swift 也用得越来越多了)，而Android 开发主要使用Java 语言。

最终，平台的数量开始逐渐减少，因为在这一领域的胜败早已尘埃落定。今天的

赛道基本上是Android 和iOS 双雄争霸(尽管还有一些其他的平台，但此刻它们的影响

力几乎可以忽略不计，并且多数开发者，在我看来甚至可以说是绝大多数开发者，都

倾向于无视它们，除非有特别的目的必须包含它们)。于是，真正的跨平台开发理念开

始变得更加吸引人和可行了。

互联网的兴起提供了一种选择，因为你可以基于Web 技术开发并打包成一个移动

应用，使它在Android 和iOS(甚至更多平台)上的表现几乎一致。但我们需要为此做出

一些妥协，而这些妥协尽管随时间的推移减少了，但却一直存在。比如性能和真正的

原生能力，对Web 技术来说仍然有些棘手。

除了Web 技术，在过去几年中，我们还见证了数种跨平台开发技术和工具的诞生，

使用这些技术和工具，只需要编写应用一次，就可以运行于所有设备，在保持一致性

的同时获得原生般的体验。其中广为人知的有Corana SDK(主要用于游戏，尽管并非

唯一选择)、Xamarin、PhoneGap(本质上仍然是Web 技术，但巧妙地使用一个原生的

WebView 组件进行了包装)、Titanium、Sencha Touch(虽然还是基于Web 技术，但提供

了较好的抽象)等，其他就不一一列出了。当下并不缺少选择，并且它们也各有拥护者

和反对者。

自从Flutter 以全新竞争者的身份进入该领域后，便远胜其他一切技术，成为编写

跨平台移动应用的唯一正确方式。

1.2 透过名字这一表象

众所周知，Flutter 是由Google 公司发明的，这是一家对互联网发展有着重要影响

力的公司。在2015 年的Dart 开发者峰会上(请记住Dart，因为我们很快就会回顾与之

相关的内容)，Flutter 以Sky 为名诞生了。最初，Flutter 只是运行在Google 自家的Android

操作系统上，但不久后就被迁移到Apple 的iOS 操作系统上，而这两种系统正是引领

当今移动操作系统的佼佼者。

自首次亮相后，Flutter 陆续发布了多个预览版本，最终于2018 年12 月4 日发布

了第一个稳定版本：Flutter 1.0。这标志着Flutter 迎来大爆发，对开发者来说是时候转

向Flutter 阵营了——事实上他们已经这么做了。由于一些非常正确的决策，Flutter 的

流行可以说是如流星般迅速。其中一个是：Flutter 最初的目标，或者说主要目标之一，

就是无论如何都要使应用的UI 渲染速度达到流畅的120fps。Google 的工程师们非常

明白流畅的UI 正是用户喜闻乐见并且想要拥有的体验，因此在设计Flutter 时它被列

为所要考虑的首要特性之一。这是明确要实现的最高目标，到目前为止还没有一个跨

平台的移动框架可以达成这一点(即使那些并非跨平台的移动框架也曾为此付出过巨

大努力)。

Google 在设计Flutter 时做了一系列不同于其他移动开发方案的关键决策，其中之

一是Flutter 自主渲染其UI 组件。与其他框架不同，Flutter 并未使用原生平台的组件。

换句话说，当你告诉Flutter 显示一个按钮时，Flutter 将自主完成该按钮的渲染；而非

转嫁给底层OS 来渲染该按钮，这也是其他大多数框架的做法。这一点展示了Flutter

与其他几乎所有的跨平台方案的重要区别，也正因此而保证了Flutter 在不同平台上的

流畅性。受益于此，新的UI 组件、微件(也请记住这个概念，它即将像Dart 一样隆重

登场)可以被快速且简单地添加至Flutter，而无须担心底层平台是否支持。

自主渲染的特性使得Flutter 可提供特定风格的微件。Flutter 支持两种风格的微件：

Material 风格的微件和Cupertino 风格的微件。前者实现了Google 自家的Material 设计

语言，也就是Android 默认的设计语言；后者实现了Apple 的iOS 设计语言。

Flutter 内部可从概念上划分为4 个主要部分。首先是Dart 平台，因内容庞杂，需

要用一整章来介绍，我将暂时跳过它并在下一章中专门讲述。

接下来我们来看第二个组成部分：Flutter 引擎。这是一个(绝大部分)由C++语言

实现的代码库，其核心性能接近原生级别，同时使用Skia 图形引擎来完成渲染工作。

Skia 是一个轻量级的开源图形库，也是由C++实现的，经改进后在所有兼容平台上都

可获得极其优秀的性能。

作为第三个主要组成部分，Flutter 提供了一套所谓的基础类库——用于封装两个

平台的原生SDK 的接口。其目的在于消除原生平台API 的差异，以便支持Flutter API

的一致性。也就是说，你无须关注如何在iOS 及Android 上启动拍照应用，也不必费

心调用两个平台特定的API。你只需要了解调用哪个Flutter API 来启动拍照应用，它

将自动适配两个平台。

最后一个组成部分是微件，但正如Dart 一样(内容庞杂)，也须另起一章专门介绍，

我们稍后再讨论它们。

简而言之，以上内容就是Flutter 的全部。老实说，以上所述并未覆盖多少开发

Flutter 应用所需掌握的知识点。尽管如此，我仍然认为了解一点发展历史以及所使用

开发工具的原理，总是有用的。希望你也有同感！

接下来将辨析几个我刚刚提出的概念，对这些概念稍作扩展并究其细节，下面就

从Dart 开始吧！

1.3 Dart：众神的语言

当Google 启动Flutter 项目时，有一个早期决策需要做出：应该使用何种编程语

言？或许可以选择基于网页的语言(比如JavaScript)，或许因Android 使用Java 的缘故

而自然而然地选择Java。或许，既然他们打算支持iOS，Objective-C 或Swift 也是不

错的选择(毕竟Swift 表面上是开源的，因此我敢打赌，Flutter 团队内部早期一定就此

有过争论)。或许，Golang、Ruby 之类的语言更好。传统的C/C++怎么样？还是响应

Microsoft 的号召加入C#阵营(因为C#也是开源的)？

我相信有太多的选择，但最终Google 决定(由于诸多因素)使用了一种多年前他们

自己开发的语言：Dart。

由于接下来的整个第2 章都用来介绍Dart，因而在这里我将避免涉及太多细节，

但浏览一下下面这个简单的示例还是有必要的：

import "dart:math" as math;

class Point {

final num x, y;

Point(this.x, this.y);

Point.origin() : x = 0, y = 0;

num distanceTo(Point other) {

var dx = x - other.x;

var dy = y - other.y;

return math.sqrt(dx * dx + dy * dy);

}

Point operator +(Point other) => Point(x + other.x, y + other.y);

}

void main() {

var p1 = Point(10, 10);

var p2 = Point.origin();

var distance = p1.distanceTo(p2);

print(distance);

}

是否理解每一行代码并不重要。事实上，此刻你无须理解任意一行代码。如果有

过使用Java 或类C 语言的经验，我相信你能理解它们且没什么太大障碍，这正是Dart

的一大优势：其语言特性与绝大多数现代开发者所熟悉的那样如出一辙，可以被快速

且容易地掌握。

■ 注意：

有趣的是，C语言本身以及其他类C语言都是从ALGOL这种相当古老的语言发展

而来的。

在此，我没有过多地深入探讨Dart 的本质细节(第2 章要介绍的主要内容)，只是

想适当地介绍一点Dart 的背景。如前所述，Google 于2011 年创建了Dart，首次公布

于在Aarhus Denmark 举行的GOTO 会议上。Dart 的首个版本1.0 发布于2013 年11 月，

在其发布后的大约两年后Flutter 发布了。顺便说一句，我们都应感谢Dart 的创建者

Lars Bak(他同时也是支撑Chrome 和Node.js 的V8 JavaScript 引擎的开发者)和Kasper

Lund。

Dart 语言小而美，由于对Flutter 的重要性，它很快便获得大量的关注。尽管作为

一种通用目的的编程语言，Dart 能够且已被用于构建各类应用，从Web 应用到服务器

端，再到IoT(物联网)应用以及其他领域。大概在我撰写本章内容时，JAXenter 公开了

一项关于2019 年对开发者最重要的编程语言的调查(详见https://jaxenter.com/poll-resultsdart-

word-2019-154779.html)，其结论指出有两种语言脱颖而出且远远超出其他语言，

它们是Dart 和Python，并且Dart 全面胜出。该项调查还显示Dart 在2018 年经历了蓬

勃发展，且Flutter 几乎可以说是其唯一强大的推动者，光靠Dart 自己可能还不足以解

释这些结论，但公平地讲，Dart 正迅猛进击所有领域！

因此，Dart 正毋庸置疑地受到越来越多的关注。

Dart 涵盖了哪些内容？简要来讲，有几个关键的要素，并且在前面的代码示例中

已演示了大部分：

● Dart 是完全面向对象的。

● Dart 是一种垃圾回收型语言，因此无须关注内存的分配与回收。

● 语法风格基于C 语言，易于为大部分开发者所掌握(诚然，Dart 确实有一些特

性可能会难住你，不过不会比其他有着类似语法的语言更糟)。

● 支持通用语言特性，如接口、混入(mixin)、抽象类、泛型具体化(相对于类型

擦除而言)以及静态类型检查。

● 拥有完善的输入辅助系统(但在相同类型的输入上的灵活性，使得Dart 对开发

人员而言起到真正的辅助作用而非负担)。

● 并发隔离，因此你将获得独立的线程，它们以消息传递而非内存共享的方式

通信。虽然这会损失一些性能，但能够降低其他形式的并发编程模型带来的

风险。

● Dart 可以AOT(ahead-of-time)方式编译为原生代码以达到汇编级别的最优性

能。Dart 代码可被编译为ARM 或x86 架构下的二进制代码，但同样也可被编

译为JavaScript，因此Dart 代码甚至还能在网页上勉强运行。暂且抛开这种

转译，既然Flutter 以移动平台为目标，那么Dart 代码将以AOT 为主要编译

方式。

● Dart 在其语言基础之上提供了一个相当庞大的包的仓库，其中包括几乎大部

分开发者都会用到的各种附加功能，便于他们轻松地导入自己的项目。

● 支持众多流行的开发者工具，包括Visual Studio Code 和IntelliJ IDEA。

● 将快照作为Dart 虚拟机的核心部分，从而提供了一种在运行时存储或序列化

对象及数据的方式(Dart 程序可被编译为快照，其中包含了所有的程序源代码

和经过预分析的依赖，并且可在启动时立即执行，同时快照还被重度应用于

并发编程)。

Dart 现在已成为ECMA 的标准之一，且由技术委员会TC52 管理，可以在网站

www.dartlang.org/guides/language/spec 上查阅最新的规范说明(更常见的做法是访问

Dart 语言的主页www.dartlang.org)。

前面已提到，接下来的第2 章将为你提供关于Dart 的最新信息，且足以应对即将

到来的Flutter 代码。但以上介绍的相关内容，仅限于作为一种适当且足够的补充简介。

1.4 拥抱微件

让我们回过头来说一说整场演出中真正的明星——Flutter，以及一个比其他任何概

念都更为重要的、用以支撑Flutter 一切的概念——微件。

在Flutter 的世界里，任何事物都是微件。当我提到任何事物时，意指几乎所有的

事物都是微件(想在Flutter 中找出一个不是微件的事物，难度要比找出是微件的所有事

物高得多)。

那么，什么是微件？它们是应用的UI 组成部分(尽管并非所有的微件都会显示在

屏幕上，只有小部分会显示)。显然，微件也可以是代码行，如下所示：

Text("Hello!")

以下代码清单同样是微件：

RaisedButton(

onPress : function() {

// Do something.

child : Text("Click me!")

)

以下代码清单也是微件：

ListView.builder(

itemCount : cars.length,

itemBuilder : (inContext, inNum) {

return new CarDescriptionCard(card[inNum]);

}

)

最后，以下代码清单还是微件：

Center(

child : Container(

child : Row(

Text("Child 1"),

Text("Child 2"),

RaisedButton(

onPress : function() {

// Do something.

child : Text("Click me")

)

最后这个微件很有趣，它实际上使用了一种由多个微件构成的层级结构：一个

Center 微件，里面嵌入了一个Container 微件，而在这个Container 微件的内部又嵌入

了一个Row 微件，在这个Row 微件的内部又嵌入了两个Text 微件以及一个

RaisedButton 微件。它们是什么微件并不重要(尽管命名已给出含义)，重要的是你所看

到的整个微件的层级结构，正是微件在Flutter 领域内的存在形式。

没错，在Flutter 中微件无处不在。微件就在我们身边。Flutter 本身就是一个强大

的UI 框架：你得到的是一个微件！

正如开头提到的，Flutter 中几乎所有事物都是微件。当你在用户界面的上下文环

境中提到微件这个词时，人们所能想到的各种显而易见的事物有按钮、列表、图片、

文本输入框等事物。它们当然是微件。但是，在Flutter 中那些一般你不认为是微件的

事物，仍然是微件，比如图片的外边距、文本输入框的状态、显示在屏幕上的文本甚

至应用所使用的主题，所有这些事物也都是微件。

既然Flutter 中的一切都是微件，一个显然的结论就是：你的代码从本质上看就是

由众多微件堆叠而成的(这在Flutter 中有一个特别的叫法：微件树)。可见，大多数微

件都是容器，意味着它们可以嵌入其他微件。其中一些只能嵌入一个，另外一些可以

嵌入多个。同样，嵌入的微件又可以分别嵌入一个或多个其他微件，以此类推。这就

是微件的存在形式。

所有的微件都是Dart 类，所有微件只有一个明确的要求：它们必须实现build()

方法。这个方法必须返回其他微件！关于这一点少有例外，一些低级别的微件(如Text

微件)会返回一个原生类型(此处为String)，但大多数都返回一个或多个其他微件。除

此之外，从代码级别看，一个微件就是一个普通的Dart 类(除了第2 章将要展示的少

量语法之外，这与你在其他面向对象编程语言中认识的类没什么两样)。

Flutter 微件扩展自Flutter 所提供的几个少数标准类之一，符合典型的面向对象编

程范式。扩展类决定了我们将使用何种基本微件，而在99%的时间里你将围绕两种微

件进行开发：StatelessWidget 和StatefulWidget。

继承自StatelessWidget 的微件不会发生改变，它们因不含状态而被称为无状态微

件。比如显示小图的Icon 微件，显示字符串文本的Text 微件，就属于此类微件。无

状态微件的示例如下：

class MyTextWidget extends StatelessWidget {

Widget build(inContext) {

return new Text("Hello!");

}

是的，就是这么简单！

相对而言，StatefulWidget 基类在内部带有一个状态属性，当用户与之交互时将以

某种形式发生改变。如CheckBox、Slider、TextField(当你遇到此类将首字母大写的单

词写法时，意即真实的Flutter 微件类名，而普通的表达将正常译出，如文本表单域)，

都是大家熟知的有状态微件。当你编写这样一个微件时，实际上须创建两个类：有状

态微件类和相应的状态类。下面展示了一个有状态微件及其关联的状态类：

class LikesWidget extends StatefulWidget {

@override

LikesWidgetState createState() => LikesWidgetState();

}

class LikesWidgetState extends State<LikesWidget> {

int likeCount = 0;

void like() {

setState(() {

likeCount += 1;

});

}

@override

Widget build(BuildContext inContext) {

return Row(

children : [

RaisedButton(

onPressed : like,

child : Text('$likeCount')

)

]

);

}

像之前一样，无须纠结太多细节，目前并不期望你能读懂这些代码，我们将在第

2 章中深入讨论，在那之前你只需要掌握Dart 的一些基础概念即可。但同时，我相信

你多少对我们所讨论的内容有一个基本的认知，因为它们还是比较浅显直白的。除了

微件代码及其状态对象是如何交互和发生联系的部分有些难懂之外，其他大部分内容

都还算简单，不过不必担心，这样的状况不会持续太久！

暂时回到无状态微件的概念上来，我们应注意到术语“无状态”其实有些不够准

确，因为Dart 中的类封装了属性和数据，无状态微件也不例外，因此从某种意义上说，

它也拥有状态。有状态微件与无状态微件的关键不同在于，无状态微件在“状态”发

生改变时并不会被Flutter 核心框架触发而自动重新渲染，而有状态微件则会自动触发

重新渲染。当有状态微件的状态改变时，无论因何缘故导致，都将触发某些特定的生

命周期事件。这些触发生命周期事件回调的函数调用，最终引起Flutter 重新渲染微件

在屏幕上占据的部分(如果这次改变是必需的，Flutter 将替你做出决策，因为它清楚这

个微件在事件发生前后的状态)。

我们可以这样理解：两种类型的微件都有状态，不过Flutter 只关注有状态微件的

状态，甚至在某种程度上会管理其状态。因此，只有有状态微件才会在适当的时候自

动重新渲染，且受控于Flutter 框架本身而不是你的代码。

你可能倾向于认为你会一直使用有状态微件，这样就可以省很多事儿，但从后续

我们构建的应用中你将看到，事情并非如此。事实是：你会发现你将不可思议地大量

使用无状态微件。我们改天再来讨论这个话题。

你应该已经注意到有两件事的重要性非同一般。其一，微件构成了Flutter 的UI。

并形成了早些时候我曾提到的微件树。同时，微件的代码是面向对象的，UI 的构建方

式就是一种组合范例。这一点非常重要，大部分Flutter 微件本身都相当简单，并且也

只能通过组合方式来构建强大的UI。有些框架使用可以称为“全能”的组件，它们自

身就代表整个应用。Flutter 则完全不同，即使相对较小的UI 都很可能由多个微件组合

而成。

其二，Flutter 通过代码构建UI。我知道这是显而易见的，但请想一想：Flutter 不

像网页开发那样，并没有一种专门用于构建UI 的标记语言。由此带来的好处是只需

要学会一种语言，掌握一种编程范式。乍一看这没什么，但却是Flutter 与相对其他竞

争者的巨大优势。

暂时这就是所有你需要掌握的微件知识点了。我们将从第3 章开始将Flutter 自带

的微件列表整理为目录并深入介绍它们，然后在第4 章基于这些微件来构建三个应用，

以讲解每个微件的用法。最终你将对进行Flutter 开发时用到的大多数常见微件形成良

好的理解，并很好地掌握如何使用和构建微件。

1.5 言归正传：Flutter 的优劣对比

与其他任何框架一样，合格的开发者需要评价我们可能考虑的任意选择的收益和

风险，Flutter 也不例外。我个人认为Flutter 可以做很多事，但它并非灵丹妙药，它也

有自身的问题。Flutter 有其不足之处，它并不适用于所有项目，尽管如此，我仍然坚

信，即使它不是最好的，但也绝不是最差的。

既然如此，我们就来说一说Flutter 的优劣，为了容易理解，我们将它与其他可选

方案进行对比。

● 优势：热重载——当我们搭建好Flutter 开发环境并快速预览一个模板应用之

后，我们将回顾这一点，你将看到，这是Flutter 的一个巨大优势。在集成了

第三方的Expo 组件后，React Native 也可以拥有这一能力。但Flutter 的表现

更为优异，以我的经验来看，更为流畅。其他框架则很少能做到这一点。

● 劣势：专注移动应用——在撰写本书时，你只能使用Flutter 开发iOS 和Android

移动应用。有了Flutter 后，你会失望于它不能满足你的所有开发需求。不过，

你可以选择使用Flutter 进行Web 开发乃至Windows、Mac 和Linux 原生开发。

不久之后，这种劣势可能变成优势，因为整个计算机世界都可以使用Flutter

构建(对某些人来说，将成为一种意义重大的优势：Google 将比现在拥有更多

话语权——你必须自己做出决定)。

● 优势：完全跨平台——你的Flutter 应用将以最小代价运行于iOS 及Android(乃

至Android 的继任者Fuscia)平台上。与众不同的是，Flutter 提供了两组微件，

其中一组适用于iOS，而另一组则适用于Android。因此，你的应用不仅可以

表现一致，还可以与平台完美融合(这取决于你，而并非强制要求)。其他平台

则很少能像Flutter 这么轻松做到这一点(你通常需要编写大量分支代码以适配

两个平台，使用Flutter 则相对轻松很多)。

● 劣势：代码混合——一些开发者，特别是那些拥有Web 开发背景的，认为UI

与逻辑的分离是再普通不过的做法(相对于使用HTML/CSS 来定义UI，使用

JavaScript 及运行于后台的语言定义逻辑)，他们很可能对Flutter 代码将UI 与

逻辑混合在一起的做法感到惊讶。当然并非只有Flutter 这么做，React Native

也曾因此饱受诟病。

● 优势：Dart——Dart 简洁而强大、面向对象、强类型，并赋予开发者快速且可

靠的代码高产能力。一旦掌握，大多数开发者对Dart 的热爱都会高过

JavaScript、Objective-C 和Java。

● 劣势：Google——我把这点列为劣势，更多是个人主观判断，你当然可以同意

或反对(老实说，我自己也一直踌躇不定)。有些人对Google 对互联网的掌控

力之大而有所不满，即使那些掌控并非Google 有意而为之。当你作为游戏的

主宰者时，你会倾向于拥有绝对的控制力。尽管如此，有人认为使用Google

独自研发的技术开发(所有平台的)移动应用有些不自量力。当然也会有人为有

如此强大的后盾支持而拍手称快。所以，这是一场你必须自己去寻找答案的

辩论。

● 优势：微件——Flutter 自带一组丰富的微件，并且实际上将满足你构建任何应

用之需。尽管如此，你仍然可以创建自己的微件(实际上，你必须创建自己的

微件，但它们的复杂度将大有不同)，你甚至可以引入其他第三方微件以扩展

Flutter 的能力。新创建或引入的微件与Flutter 自带的微件一样容易使用。以

React Native 为例，其主要依赖添加诸多第三方微件来弥补自有微件的不足，

而Flutter 则提供了太多开箱即用的微件。

● 劣势：微件树——这点被归为劣势是由于有时你最终会因嵌套太深(如果没有

其他原因的话)，导致代码可读性太差，而难以理解其结构。在过去的二十年

中，随着万维网的兴起，我们已经变得对此有些习以为常了，因为与HTML

遇到的问题如出一辙。但因为事实上Flutter 中的任何事物都是微件，所以嵌

套有时比HTML 还要深，并且Dart 代码风格导致阅读此类代码有些棘手。当

然，你可以运用一些技术手段来减少嵌套，我将在随后带领大家阅读真实的

应用代码时就此再作讨论，但嵌套过多的劣势仍需要我们时刻注意，并自行

处理。关于这一点，Dart 和Flutter 都无能为力。

● 优势：开发工具——在1.6 节中，你将看到完成Flutter 基础开发环境的搭建是

如此简单。尽管如此，你可以抛开基础开发环境，而是使用那些你在进行其

他开发工作时所习惯使用的工具。这一点再次减少了开发者的阻力。

● 劣势：响应式编程及状态管理——Flutter 通常被认为是一种响应式编程范式，

这意味着可通过给定微件的当前状态来管理应用的UI。前面介绍过的build()

方法以当前状态作为入参，并返回包含当前状态的微件的可视化描述。当状

态发生改变时，微件通过再次调用build()方法，同时传入其最新的状态进行重

建以“响应”该变化。这一切的发生都表现为Flutter 的函数及其生命周期；

你(通常)不必考虑太多，而只需要提供build()方法。相对于其他框架，你需要

先构造一个微件，再调用一系列赋值方法以设置其正确的状态。在Flutter 或

其他框架中，这一范式被广为接受，但它也可能被当作Flutter 的一个劣势，

因为有时候，在完成一些微小的功能时无可辩驳地更为复杂(我们将在后续章

节中见识到这种复杂性以及一些相应的处理方法)。与此相关的还有状态管理

话题，并没有一种标准可用来判断对错，至少在撰写本书时，这仍是Flutter

的一大不足。你会有多种方式用来管理状态，或优或劣，但你必须决定哪种

最适合自己(当然，我也会给出我认为不错的方式)。Google 正在拟订一种标准，

但目前还未完成，所以直到它完成之前，我将把(对状态管理)缺乏有力的指导

视为Flutter 的劣势之一(尽管有些观点认为这种灵活性可被当作优势来看，但

无论如何我都不会卷入任何无意义的争论之中)。

● 优势：平台特定的微件——由于Flutter UI 通过代码构建，维护一套代码的同

时支持iOS 和Android 就变得简单直接了，即使在需要处理一些平台差异时也

是如此。举例来说，你总是可以在运行时通过查询Platform.isAndroid 或

Platform.isIOS 的值来判断当前运行环境，并借此判断应该构造何种平台特定

的微件。也许你希望在Android 平台上使用RaisedButton 而在iOS 平台上使用

扁平的Button。没有必要维护两套不同的代码，多数情况下一个简单的分支

判断即可完成此类工作。

● 劣势：应用大小——因为需要嵌入核心Flutter 引擎、Flutter 框架、支持库以及

其他资源，Flutter 应用一般要比纯原生方式开发的应用大一些。一个简单的

“Hello, World!”Flutter 应用，大小可达7MB。这当然需要权衡，如果有一个

用例对应用大小有严格要求，那么Flutter 也许不是最佳选择。

好了，至此我敢说你已经掌握了，也可以说积累了有关Flutter 的一些基本概念，

你对Flutter 有了一个大致的了解。让我们开始动手写一些真正的代码吧！

1.6 无须多言，向Flutter 进发吧

在真正动手写代码之前，我们应该先安装Flutter 以及一些需要用到的开发工具，

对吧？“工欲善其事，必先利其器！”

幸运的是，Flutter 开发环境的搭建相当简单。

1.7 Flutter SDK

毫无疑问，首先要完成的就是下载、安装以及配置Flutter SDK。这是一切的基础。

接下来，虽然不是必需的，但为配合本书使用还是建议大家下载、安装和配置Android

Studio(包括Android SDK 和模拟器的设置)。

打开网址https://flutter.io，这里是Flutter 安装过程和文档的“一站式购物平台”。

单击顶部的Get Started 按钮，在Install 页面可以选择你所使用的操作系统(Windows、

macOS 或Linux)。

■ 注意：

我是一名忠实的Windows用户。Windows是我所知道的最好的操作系统。因此，

本书将围绕Windows来讲解。说到这儿，我将努力指出不同系统间的重大区别。总体

来说，无论你是否使用Windows，都不会有太大区别。虽然安装软件的过程的确有所

不同，但是Flutter网站会在你需要协助的地方给予正确的指引。

选择适合的链接，Flutter 网站将为你提供下载及安装SDK 的信息。与其他SDK

或软件不同，你可能会遇到一点困难。必须指出的一点是如何将SDK 添加至系统环

境变量的那部分说明。尽管这样做有利于编译构建，但你仍然可以跳过这一步骤，如

果愿意的话。不过要注意，如果坚持跳过，所有命令的执行都必须位于SDK 路径之

下，否则必须指定SDK 的完整路径。一旦我们完成Android Studio 的安装，你就会发

现无须添加SDK 至系统环境变量，只有当确实需要在命令行环境下执行SDK 命令而

非通过Android Studio 执行编译构建时，设置系统环境变量才有用。

说到命令，事实上你可能需要执行的一条命令，一条按照Flutter 网站上的安装说

明需要在SDK 安装完毕时执行的命令，就是flutter doctor。大多数命令将被转发给

SDK，除此之外就是flutter，这也是实际上执行的程序，doctor 是可以发送给它的命令

之一。这可能是最重要的一条命令，可用来执行一系列的检查和配置以确保Flutter 可

以运行。

刚开始执行这条命令时，你可能会看到一些可以预见的失败条目，下一步将解决

这个问题：安装Android Studio。

1.8 Android Studio

Flutter 网站上的说明将指导你安装Android Studio，虽然在不同系统上略有不同，

但是当你下载完成后，你将启动并执行Android Studio 的安装向导。你将下载Android

SDK 和模拟器镜像，以及其他一切必需的工具。同时，你需要安装一些与Dart 和Flutter