Flutter的初步配置(基于Android Studio)

最近见到很多介绍Flutter的文章,特意打开官网看一眼究竟是何方神圣。https://flutter-io.cn/

Flutter的初步配置(基于Android Studio)

经过搜索发现大概是和react native类似的存在。实现原理不同,性能更好。

点击查看中文资源,会看到入门教程:

Flutter的初步配置(基于Android Studio)

Flutter的初步配置(基于Android Studio)

1.下载并安装Flutter SDK

Flutter的初步配置(基于Android Studio)

选择相应的版本Windows Flutter SDK

Flutter的初步配置(基于Android Studio)

将压缩包解压到相应文件夹即可

2.配置环境变量

Path下补充flutter路径,例如:XXXXX;D:\flutter\bin

由于 flutter 有一些命令需要联网,所以我们在国内使用还需要做个简单的设置 
(参考 Using Flutter in China )

我们继续设置两个环境变量

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

打开CMD窗口,输入flutter,出现以下内容说明配置正确:

Flutter的初步配置(基于Android Studio)

Flutter的初步配置(基于Android Studio)

输入flutter doctor:

Flutter的初步配置(基于Android Studio)

有时会出现如下内容:

1.按照它给出的解决命令输入即可

Flutter的初步配置(基于Android Studio)

2会提示没找到Android SDK安装路径,需要在环境变量加上 ANDROID_HOME:XXXXXXXXXX

3.提示没有连接设备(我之前遇到过这种情况,无论真机还是模拟器都说检测不到)

3.Android Studio安装插件

Flutter的初步配置(基于Android Studio)

之前遇到了Browse里边什么都没有的情况,过了两天没理它,自己又出现了。

搜索安装Flutter 会弹窗提醒是否安装Dart 点击是 安装重启即可。

4.新建项目

Flutter的初步配置(基于Android Studio)

Flutter的初步配置(基于Android Studio)

直接运行会看到如下界面:

Flutter的初步配置(基于Android Studio)

我当然又遇到了神器的事情,有的设备能显示,有的不能

Flutter的初步配置(基于Android Studio)

这样的界面,什么都没有,啊哈

打开窗口会看到:

Flutter的初步配置(基于Android Studio)

解决办法: --enable-software-rendering

Flutter的初步配置(基于Android Studio)

还有一个问题啊,那就是Android Studio的版本,之前我用的Canary,有提示我只能用Beta。

Flutter的初步配置(基于Android Studio)

flutter还有一个很好用的功能啊,热重载,点一下小闪电就行了。

Flutter的初步配置(基于Android Studio)