Flutter App在Windows下开发环境的搭建，以及在AndroidStudio中，创建一个项目并运行

    前言

    最近，看一些技术博客，都提到了Flutter，而且有不少大牛和一些公司在着手使用开发Flutter App。然后自己就做了一些简单的了解。Flutter是使用Dart语言开发的，万物皆Widget，和Android的布局文件不一样，Flutter不需要为每一个页面编写xml布局文件。一切界面显示都是在代码中通过Widget来实现显示的。感觉这种方式很新颖，也不同于之前的HyBrid、H5这些，不是通过原生与H5通过js交互来完成跨平台的。Flutter实现跨平台，通过编写一个项目，然后在Android和IOS两个平台上都可以运行的。

   开发环境搭建

     Flutter可以使用AndroidStudio、VS code当作编辑器，这对于搞Android开发的朋友无疑是个好消息。下面我就讲讲在Window环境下，使用AndroidStudio开发Flutter应用的环境搭建。

Git命令行工具：Git for Windows

如果已安装Git for Windows，请确保命令提示符或PowerShell中运行 git 命令，不然在后面运行flutter doctor时将出现Unable to find git in your PATH错误, 此时需要手动添加C:\Program Files\Git\bin至Path系统环境变量中。如果是32位的Windows系统，请将Program Files换成Program File (X86)

1.去flutter官网下载其最新可用的安装包，点击下载

2.将安装包zip解压到你想安装Flutter SDK的路径（如：C:\src\flutter；注意，不要将flutter安装到需要一些高权限的路径如C:\Program Files\）。

3.在Flutter安装目录的flutter文件下找到flutter_console.bat，双击运行并启动flutter命令行，接下来，你就可以在Flutter命令行运行flutter命令了。

4.配置环境变量：

• 转到 “控制面板>用户帐户>用户帐户>更改我的环境变量”
• 在“用户变量”下检查是否有名为“Path”的条目:
  • 如果该条目存在, 追加 flutter\bin的全路径，使用 ; 作为分隔符.
  • 如果条目不存在, 创建一个新用户变量 Path ，然后将 flutter\bin的全路径作为它的值.
• 在“用户变量”下检查是否有名为”PUB_HOSTED_URL”和”FLUTTER_STORAGE_BASE_URL”的条目，如果没有，也添加它们。

运行 flutter doctor：

打开一个新的命令提示符或PowerShell窗口并运行以下命令以查看是否需要安装任何依赖项来完成安装：

flutter doctor

在命令提示符或PowerShell窗口中运行此命令。目前，Flutter不支持像Git Bash这样的第三方shell。

 

5.在AndroidStudio中安装Flutter和Dart插件

• Flutter插件： 支持Flutter开发工作流 (运行、调试、热重载等).
• Dart插件： 提供代码分析 (输入代码时进行验证、代码补全等).

创建应用：

1. 选择 File>New Flutter Project
2. 选择 Flutter application 作为 project 类型, 然后点击 Next
3. 输入项目名称 (如 myapp), 然后点击 Next
4. 点击 Finish
5. 等待Android Studio安装SDK并创建项目.

上述命令创建一个Flutter项目，项目名为myapp，其中包含一个使用Material 组件的简单演示应用程序。

在项目目录中，您应用程序的代码位于 lib/main.dart.

运行应用程序：

1. 定位到Android Studio 工具栏:
   
2. 在 target selector 中, 选择一个运行该应用的Android设备. 如果没有列出可用，请选择 Tools>Android>AVD Manager 并在那里创建一个
3. 在工具栏中点击 Run图标, 或者调用菜单项 Run > Run.
4. 如果一切正常, 您应该在您的设备或模拟器上会看到启动的应用程序:
   

热重载

Flutter的这个热重载真是好用，亲测！一些改动之后，点击热重载的按钮，在模拟器或真机上，1~2秒即可看到效果，不用像AndroidStudio编译运行那么费劲了（AndroidStudio有时还行，有时则超过5分钟，碰到项目上线时或紧急bug是干着急啊~~）。

Flutter 可以通过 热重载（hot reload） 实现快速的开发周期，热重载就是无需重启应用程序就能实时加载修改后的代码，并且不会丢失状态（译者语:如果是一个web开发者，那么可以认为这和webpack的热重载是一样的）。简单的对代码进行更改，然后告诉IDE或命令行工具你需要重新加载（点击reload按钮），你就会在你的设备或模拟器上看到更改。

1. 将字符串
   'You have pushed the button this many times:' 更改为
   'You have clicked the button this many times:'
2. 不要按“Stop”按钮; 让您的应用继续运行。
3. 要查看您的更改, 只需调用 Save All (cmd-s / ctrl-s), 或点击 热重载按钮 (带有闪电⚡️图标的按钮).

你就会立即看到更新后的字符串。

结束语

好了，到这里，Flutter开发环境的配置，以及创建一个Flutter项目，并把这个项目运行起来，就结束了。快去体验试试吧。