1. Flutter是什么

是Google 出的一个UI SDK
是跨平台解决方案，支持移动端(iOS/Android)、Web端()、桌面

2. Flutter的特点

美观(交互)
快速(性能)
高效(热重载)
开放(开源)

3. 原理

太长后边补

4. 环境搭建

Flutter搭建教程

下载FlutterSDK(需要翻墙)
SDK下载后会自动解压，复制到家目录下
打开终端，执行export PATH="$PWD/flutter/bin:$PATH"
更新环境变量终端执行：vim ~/.bash_profile

输入：export PATH=$PATH:/Applications/flutter/bin

然后执行flutter --version查看flutter是否安装成功, 我下载安装的是2.2.3版本，显示如下

Flutter 2.2.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision f4abaa0735 (2 weeks ago) • 2021-07-01 12:46:11 -0700
Engine • revision 241c87ad80
Tools • Dart 2.13.4

配置镜像在~/.bash_profile或~/.zshrc中添加：

#Flutter 镜像配置
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

#Flutter 环境变量配置
export FLUTTER=~/flutter
export PATH=$FLUTTER/bin:$PATH

添加后更新一下配置：source ~/.zshrc或source ~/.bash_profile 6. 查看配置是否成功，在终端中输入flutter doctor 如图显示表示成功

5. Android Studio环境搭建

5.1 官网下载Android Studio

5.2 下载后安装Android Studio，首次安装需要下载SDK，安装完成后点击Finish

此时执行flutter docture 显示Android SDK的报错

5.3 解决 `cmdline-tools component is missing`问题

选择Android SDk -> SDK Tools -> 去掉Hide ObSolete Package的√ ->勾选上Android SDK Tools（Obsolete）和 Android SDK Command-line Tools，如下图所示

安装完成之后再次运行flutter doctor，此时Android对应的问题显示已解决

5.4 解决`Android license status unknown`问题

运行flutter doctor --android-licenses，然后一直选择yes就行

5.5 安装flutter插件

偏好设置 -> Plugins ->输入flutter -> 找到相应插件点击 Install

5.6 成功

再次运行flutter docture，如下图表示成功

Flutter - 1. 环境搭建