Flutter 入门安装——C#程序喵的Flutter之旅

做了一辈子的Xaml，从开始的WPF,Sliverlight,WP,到现在的UWP，喜欢C#语言的优美，更是喜欢宇宙最强IDE Vistual Studio。之前有用过Xamarin，也知道RN。

image
只是一直没有精力去深入一个跨平台方案。选择Flutter，没啥原因，因为开源，因为Google爸爸，因为Fuschia。写过UWP，也就很期待Flutter在手机/平板/电脑的表现。

首先先收藏下面网站，需要翻墙，请自带小飞机。

Flutter官网
国内

Dart官网

Flutter里面的插件和库在这里找

Dart pub
Dart pub 国内

虽然提供了国内镜像或者中文翻译网站，但是还是希望能查看英文原版，毕竟翻译/镜像信息是有延误的。

Windows10 系统，我是在一台新机器上创建环境的，首先下载安装Git.是个程序猿应该都有安装吧。。
安装Git，默认是选1，

这就会导致最后使用AndroidStudio生成Flutter项目的时候报错：android studio flutter create command was unsuccessful

各种网上查没有结果，后来想起Git安装的时候没有支持command，重装Git的时候注意到这个细节,完美安装成功

image

安装好之后开始执行：
git clone -b beta https://github.com/flutter/flutter.git
萌新先用beta，是稳定的版本，不满足好奇心（作死）的喵，还有master/dev分支，享受日更bug。

默认路径是C:\Users\你的账户\flutter

接下来配置你的环境(因为墙的原因，请保证做以下的配置)
控制面板-用户账户和家庭安全-用户账户-左边更改我的环境变量

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

在PAHT 变量里面 新增 C:\Users\你的账户\flutter\bin

重点，重启电脑生效

这里可以选择的开发工具有AS，VSCode，以我以往的经验。必选亲爹支持的软件
下载Android Studio
安装完毕之后.

image

Configure-Plugins 在搜索框中输入flutter然后点击

image

这里可能会搜索不到，在网上看了一下。需要做一个设置 到Settings 里面的按照下图的路径 找到Updates ，把Use secure connection前面的√去掉

image

下载的时候会提醒下载Dart。。这是Flutter框架的语言。一起下载好之后。
打开GitCMD 输入flutter doctor
就是检查你的Flutter的环境搭建成功没有， 然后根据提示来操作（现在应该就只有几个license需要接受下，一路Y就好了）

再次来到android studio 可以看到 已经有创建Flutter project的选项

image image

下面我们就创建第一个Flutter 项目（plugin和package 后面讲），吐槽一下creating过程有点慢

喝杯水再来。。。创建好的项目如下图。。启动页面在mian.dart

image

如果你是想用模拟器的。。请确保你的CPU支持Virtualization 你可以进去BIOS设置开启。。

启动当中说没有Intel HAXM。。好吧。又去下载 HAXM

如果你用安卓真机调试，注意开启手机的开发者模式和允许USB安装，没有识别出驱动的去下载ADB Driver

经过漫长的

image

（被墙真是尴尬）

你的第一个Flutter 程序启动了起来。。一个很简单的Demo。。点击按钮增加数字。。你可以玩一下Hot Reload。。修改下代码。。点那个闪电。。很快就能体现在应用上了。。

哎呦不错哦。

以后我都会以C#的视角来跟Flutter/Dart里面的知识进行对比，方便记忆。安装就结束了，心动的童鞋可以去动手试试了，最后放上本喵的GitHub。