《Flutter》-- 2.Windows系统下搭建开发环境

参阅书籍：

《Flutter跨平台开发入门与实践》-- 向治洪（著）

《基于Android Studio的案例教程》-- 宋三华（著）

2. Windows系统下搭建开发环境

学习Flutter，推荐使用mac OS系统，因个人是Windows系统的电脑，暂时只进行Android环境的搭建。开发工具可以使用Android Studio或VS Code，这里使用Android Studio，需要先安装配置JDK。

2.1 JDK

2.1.1 下载

在Oracle官网中选择对应版本进行下载。

2.1.2 安装

和安装其他软件类似，双击安装程序，然后基本下一步下一步，直到安装完成。

2.1.3 配置环境变量

需要将JDK的安装路径（例如：C:\Program Files\Java\jdk-11.0.6\bin）配置到环境变量中，然后打开cmd运行窗口，输入“java”，若能看到Java命令的帮助信息，说明JDK环境变量设置成功。

2.2 Android Studio

2.2.1 下载

在官网（https://developer.android.google.cn）中下载。

2.2.2 安装

程序下载完成后，双击安装，单击“Next”按钮，按照默认选项安装即可。

安装完成后，运行Android Studio程序，在弹出的对话框中选择“Do not import settings”单选按钮，单击“OK”按钮。

因为网络问题，Android Studio会提示设置代理服务器，单击“Cancel”按钮。

弹出欢迎界面后，按照默认提示，一路单击“Next”按钮，等SDK下载完成后，单击“Finish”按钮。

2.2.3 配置

安装完成后，进入Android Studio建立/导入项目的界面，先配置Android模拟器。

选择Configure -> SDK Manager，在弹出框中选中需要的Android平台，单击“Apply”按钮，确认后进行下载。

选择Configure -> AVD Manager，在弹出框中单击“+ Create Virtual Device...”按钮，进入虚拟机的硬件信息选择界面。

左侧选择Phone，中间选择Pixel 2，单击“Next”按钮，进入AVD对应的硬件产品类型界面。

选择要下载的Android系统镜像文件（例如：Oreo 27），单击Download进行下载，下载完成后单击“Next”按钮，进入设置对应虚拟系统的外观信息界面。

可以设置虚拟机的名称、屏幕显示方式，然后单击“Finish”按钮完成虚拟机的设置。

单击Actions列的三角启动按钮启动虚拟机。

2.3 Flutter

2.3.1 下载

在Flutter官网（https://flutter.dev/docs/get-started/install/windows）进行下载。

2.3.2 配置

将下载的压缩文件解压到某个位置（看作是安装位置），然后将该位置的路径配置到环境变量中。

然后在cmd命令窗口中执行“flutter doctor”命令对环境进行初始化。

然后在Android Studio中安装Flutter和Dart插件。

然后需要把Flutter SDK path和Dart SDK path配置到Android Studio中。

注：

1. 不要将Flutter SDK安装/解压到需要高级权限的路径上，例如C:\Program Files或C:\Program Files (x86)。

2. 因为网络原因，有时候直接从官方默认地址拉取Flutter项目所需的依赖包会失败，Flutter官网为中国开发者搭建了临时镜像，可以在用户变量中进行添加。

FLUTTER_STORAGE_BASE_URL表示Flutter SDK的初始化地址，PUB_HOSTED_URL表示pub包下载的地址。

官方默认地址：

FLUTTER_STORAGE_BASE_URL=https://storage.googleapis.com

PUB_HOSTED_URL=https://pub.dartlang.org

2.4 创建第一个Flutter项目

选择file -> New -> New Flutter Project...，进入创建项目界面。

选择Flutter Application，单击“Next”按钮，进入项目配置界面。

可以修改项目名称、项目放置位置、项目描述，然后单击“Next”按钮，进入包名设置界面。

修改包名后，单击“Finish”按钮，项目创建完成。

单击运行按钮，在模拟器中可以看到运行的项目。

2.5 项目结构

在Flutter应用开发中，图片、静态配置和资源都可以放在assets目录下。

2.6 热重载

Flutter的热重载功能可以帮助开发者在不重新启动应用的情况下，快速地构建用户界面、添加功能以及修复漏洞。

在Flutter的热重载操作中，通过将更新后的源代码注入正在运行的Dart虚拟机即可实现热重载。在虚拟机使用新的字段和函数更新类后，Flutter框架会自动重新构建应用的Widget树，并刷新效果。

2.7 运行模式

Flutter一共提供了3种运行模式，分别是Debug、Release和Profile模式。

Debug模式又叫调试模式，主要用于软件编写过程中，可以同时在物理设备、仿真器或模拟器上运行。默认情况下，使用flutter run命令运行程序时就是使用的Debug模式。

Release模式又叫发布模式，主要用在应用发布过程中，只能在物理设备上运行，不能在模拟器上运行。使用flutter run--release命令运行程序时就是使用的Release模式。

Profile模式又叫分析模式，主要用于应用性能分析，只能在物理设备上运行，不能在模拟器上运行。

2.8 Flutter常用命令

1）创建项目：

flutter create <项目名称>

2）查看本地版本：

flutter channel

3）切换版本：

flutter channel <版本名称>

4）开启Flutter对桌面和Web的支持：

flutter config --enable-windows-desktop

5）升级Flutter SDK和依赖包：

flutter upgrade

6）只升级依赖包：

flutter packages get 
flutter packages upgrade

2.9 Flutter包管理

一个完整的应用往往会依赖很多的第三方包。在原生Android开发中，通常使用Gradle来管理依赖包，在iOS中则使用Cocoapods或Carthage来管理依赖包。对于Flutter，可以使用配置文件pubspec.yaml来管理第三方依赖包。

pubspec.yaml支持多种方式的插件依赖，如常见的Pub依赖，Git依赖和本地依赖。

在pubspec.yaml配置的dependencies节点中添加需要依赖的第三方插件，在命令行中输入flutter packages get命令即可下载依赖的插件。

2.10 安装配置VS Code

除了Android Studio外，VS Code也是官方推荐的一款可视化Flutter开发工具。

2.10.1 安装

在官网（https://code.visualstudio.com/Download）中下载对应安装包，和安装其他软件类似，基本下一步下一步，直到安装完成。

2.10.2 安装Flutter和Dart插件

点击左侧的

（Extensions）按钮，搜索Flutter和Dart进行安装。

2.10.3 创建一个Flutter项目

选择 View -> Command Palette... ，在弹出框中选择Flutter: New Application Project。

然后选择放置项目的目录。

最后在弹出框中修改项目名称，按回车创建项目。

2.10.4 运行项目

运行前需打开模拟器。

可以在终端输入flutter run命令运行项目。

修改main.dart中的代码，保存后，在终端输入r，实现热重载。