[Flutter] Windows平台Flutter开发环境搭建（Andorid Studio）

前两天网友在群里说起了Flutter，就了解了一下，在手机上跑了它的demo，直接就被打动了。

虽然网上有很多教程，但真正开始的时候，还是会碰到很多坑。下面详细的讲解Flutter + Android Studio开发环境搭建。

Flutter社区和资源传送门

• 字体图标生成 http://fluttericon.com/

• Flutter中文网  https://flutterchina.club

• Flutter中文开发者论坛 http://flutter-dev.cn/

• Flutter|Dart语言中文社区 http://www.cndartlang.com/flutter

• Dart开源包 https://pub.dartlang.org/packages

• Dart SDK文档 https://api.dartlang.org/stable/1.24.3/index.html

• 学习资料 https://marcinszalek.pl/flutter/filter-menu-ui-challenge/

• Flutter开源APP https://itsallwidgets.com/

Flutter支持哪些设备和操作系统版本？

移动操作系统：Android Jelly Bean，v16,4.1.x或更新的版本以及iOS 8或更新版本。

移动硬件：64位iOS设备（从iPhone 5S和更新的iPhone型号开始）以及ARM Android设备。

请注意，我们目前不支持：

• ARM32 iOS设备（iPhone 4，iPhone 5;问题＃2089）
• x86 Android设备（问题＃9253）

我们支持使用Android和iOS设备(包括Android模拟器和iOS模拟器)来开发测试Flutter应用。

我们测试了各种低端到高端手机，但我们还没有官方设备兼容性保证。

我们不会在平板电脑上进行测试，因此平板电脑上的某些widget可能会出现问题。我们尚未在我们的widget中实施针对平板电脑的改动。

1. 安装 Java SDK

百度搜索Java sdk，打开官方网站下载。

网址： http://www.oracle.com/technetwork/java/javase/downloads/index.html

下载最新版本的SDK，点击上图框出的区域，进入下载页面。

先接受协议，然后点击最后一行中的 jdk-10_windows-x64_bin.exe 进行下载。（假设你也是64位电脑！如果不是，自行搜索其它的教程。）

Java JDK就是Java Development Kit.简单的说JDK是面向开发人员使用的SDK，它提供了Java的开发环境和运行环境。

Java JRE是Java Runtime Enviroment是指Java的运行环境，是面向Java程序的使用者，而不是开发者。

Java SE 就是包含了JDK和JRE的安装包。我们下载的就是这个。

下载完成后，开始安装。

这一步配置好安装路径。然后再下一步继续安装。

出现安装jre向导，一样的配置好路径下一 步。

jdk 安装成功。

2. 配置 JDK 环境变量

打开 “我的电脑”->“属性”->“高级系统设置” 出来系统属性对话框，然后切换到“高级”选项卡，点击“环境变量”按钮打开环境变量配置对话框。

新建系统环境变量 ”JAVA_HOME“

设置JAVA_HOME值为JDK安装目录，如  D:\Android\JDK\jdk-10

新建环境变量CLASSPATH

设置CLASSPATH值为： ./;%JAVA_HOME%/lib/tools.jar;%JAVA_HOME%/lib/dt.jar

./;%JAVA_HOME%/lib/tools.jar;%JAVA_HOME%/lib/dt.jar

（注意：点号表示当前目录，不能省略）

更新系统环境变量Path

将 “;%JAVA_HOME%\bin;” (注意:这里的分号不能省略)， 添加到Path 最前面。

将 jre 安装路径的bit目录添加到path。

点击确定保存。

打开cmd，输入 java -version 可以查看到我们安装java版本。

3. 安装和配置 Git

Flutter需要使用git来获取，所以需要先安装 Git。如果已经安装，请跳过安装，但需要检查一下是否设置环境变量。

网址： https://git-scm.com/download/win

我们下载64位的安装包。下载完成后开始安装。

安装完成后，在系统环境变量Path中查看是否存在git的cmd目录，没有则添加。

4. 下载 Android Studio

网址： http://www.android-studio.org/index.php/download  （这里的版本是：3.0.1.0）

5. 安装 Android Studio

配置好安装目录，Next开始安装。

安装完成。运行 Android Studio。

这里如果没有安装过，就选“Do not import settings”，否则选择第一项，并指定路径。我这里是全新安装，所以选择第二项。

点击OK，android studio 开始启动。

启动时会弹出如下图

这个是设置http代理的，不需要点 Cancel 进入AS安装向导界面。

点击next进入UI界面主题选择界面，可以选择自己喜欢的风格。

继续next，下载组件 （Android SDK, NDK，编译工具等），等待下载完成。

设置好 Android SDK 安装位置。Next...

下载完成后，点击 Finish ，然后退出 Android Studio。

Android SDK安装完毕后，还需要新增一个环境变量：

变量名：ANDROID_HOME 
变量值：E:\Program Files (x86)\AndroidSDK （更新成你真正的SDK位置）

再到Path下，加入下面这段：
%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;

然后重启电脑，否则后面可能会报找不到Android SDK的错误。

友情提醒：

这个AndroidSDK文件夹最好不要放到C盘，因为安卓系统的镜像、以后会用到的各种组件都会存放到这个文件夹，随着开发量的增加，这个文件夹会越来越大，C盘可能吃不消。

如果是无脑安装Android Studio和Android SDK的，Android SDK默认是存放到C盘一个隐藏文件夹下的目录（C:\Users\Administrator\AppData\Local\Android\sdk），就像上图一样，把Android SDK文件夹剪切到C盘以外的其他盘，然后在这里改成新的路径即可。

6. 下载和安装 Flutter

官网地址： https://flutter.io/

Flutter是开源在Github上的，所以我们可以直接执行下面的命令来下载。

git clone https://github.com/flutter/flutter.git

或按照片面的步骤来下载Flutter。

注意：Flutter的下载路径要全英文并且路径不能有空格！

点击 Git GUI Here。

点击 Clone Existing Repository

设置好 Source (https://github.com/flutter/flutter.git）和 Target 目录。点击 Clone 开始获取。

等待下载完成。

注意： 

直接下载超慢，而且不停掉线，舍不得买代理翻墙的童鞋，请配置镜像服务器地址，查看官方说明：

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

这俩命令只支持mac和linux，在windows下加两个环境变量：

PUB_HOSTED_URL  https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL  https://storage.flutter-io.cn

完成后，关闭Git，开始配置环境变量。

在Windows系统环境变量中，将Flutter的路径加入。完成后如图所示。

安装 Flutter

打开 Cmd 或 PowerShell （管理员方式），输入以下命令：

flutter doctor

Flutter 就会自动配置安装。成功之后再次执行以上命令，会是这样：

注意：

确保环境变量Path中存在  %systemroot%\System32; 

确保将 Git 的 Cmd 路径加入 Path。

7. 在 Android Studio 中配置 Flutter

打开 Android Studio。

点击 Settings 打开设置界面。

设置文件编码，防止乱码

进入 Editor -> FileEncodings 中，将 Encoding 全部设为 UTF-8， 保持一致，点击 Apply。

下载安装Flutter插件

进入 Plugins ，点击 Browse repositories...

搜索 Flutter ， 找到后点击右边的 Install 按钮，安装 Flutter IDE 插件。

点击 Yes， 开始下载安装。

完成后，再搜索一下 Dart ，看是否已经安装，如果没有安装，同上一样点击 Install 下载安装。

将 Flutter 和 Dart 插件都安装完成后，点击确定关闭设置界面，重新启动 Android Studio。

如图所示，欢迎界面多出了 Start a new Flutter project 。Flutter 配置完成。

8. 第一个 Flutter Project

在 Android Studio中，点击 Start a new Flutter project 来开始一个 Flutter 工程。

默认会选中 Flutter Application，用来创建app。后面是创建插件和Package。一开始，我们就创建一个空的Flutter APP 工程就行了。

点击next，进入下一步。

在这一步，设置好工程名称，保存位置和描述信息，再次 Next。

在这里设置App的包名，然后点击 Finish ，向导完成。

Android studio会根据我们的配置，来初始化Flutter工程。

这里候，我们可以接上自己的手机，或者打开Android模拟器，然后选择该设备。

我们可以通过点击菜单中 Tools -> Android -> AVD Manager 来管理Android 模拟器。

这里可以修改CPU类型，比如修改CPU为arm64

点击图上箭头所指的 Change 按钮，修改 Android SDK.

在 Other Images 选项卡中选择一个版本（我选择最新的，但还没下载，所以要点击 Download 下载回来）

Flutter 支持 Android 4.1（及以后）和 iOS 8.0 及以后的版本。

选择好后点击OK就可以了。

然后我们可以打开这个模拟器。启动好后，它会出来在IDE右上角的设备选择框中，选择后就可以用了。

选择好设备后，我们可以直接点击 Run 图标来构建和运行我们的第一个Flutter APK了。