Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。
文章目录
代码语言:txt复制- [1,下载SDK安装包](https://cloud.tencent.com/developer)
- [2,配置环境变量](https://cloud.tencent.com/developer)
- [3,执行flutter doctor](https://cloud.tencent.com/developer)
- [4,创建新项目](https://cloud.tencent.com/developer)
- [5,Flutter 学习资料](https://cloud.tencent.com/developer)
- [6,Flutter macOS环境配置](https://cloud.tencent.com/developer)
学习一门新的语言、新的开发方式,先从开发环境开始配起:
1,下载SDK安装包
点击下载
如果下载不了,可以选择github下载
注意,不要将flutter安装到需要一些高权限的路径如C:Program Files
下载好安装包之后解压
2,配置环境变量
在执行flutter doctor
检测是否安装完成之前,要先配置好环境变量才行
所以先配置环境,以下为Windows示例(mac示例):
解压之后,找到bin
目录
然后桌面右键 我的电脑>属性>高级系统设置>环境变量>在用户变量中的Path中添加上图中到bin目录的路径,比如flutterbin
3,执行flutter doctor
找到解压flutter目录下的flutter_console.bat
,双击执行
执行flutter doctor检测是否安装完成
在命令提示符或PowerShell窗口中运行此命令。目前,Flutter不支持像Git Bash这样的第三方shell。
执行结果:
这里出现了4个issues
,果然万事开头难,然后中间难,然后结尾难。
先不慌,大致过一下这几个红色的×:
- 首先第一个是flutter
Unable to locate Android SDK
. 找不到Android SDK?明明有的呀,继续看,它说如果安装在一个自定义的路径,要设置ANDROID_HOME
,ok 那就加上ANDROID_HOME变量,变量值就是Android SDK路径
- 然后看下面的异常,我有两个AS版本,随便看其中一个就行,问题不大,原来是
Flutter
和Dart
的插件没安装
不慌,先配置ANDROID_HOME变量,配置好之后再次执行flutter doctor,发现结果还是不行?!
返回继续看文档,发现了无任何特效的一句话重启Windows以应用此更改
,原来是忘了重启了,既然要重启,那顺便把插件也装了吧,反正也是要重启AS的
在Settings>Plugins
中搜索flutter,然后安装,安装之前会提示先装Dart插件,同意即可
安装完成之后,重启。
重启之后,打开之前解压的flutter目录,双击打开flutter_console.bat,再次执行flutter doctor,结果如下:
ok,Android SDK路径没问题了,AS3.2的插件也装了,接下来就是创建一个新项目跑起来试试了。
4,创建新项目
重启之后创建项目就多了一条New Flutter Project...
项目名称是小写才行,然后Next、Finish 就行
然后点击运行,选择一个模拟器,效果如下:
ok,这就跑起来了,初始就是官方给的例子,顺便加了一句绿色的Hello World , Hello Flutter
ok,Flutter的环境配置就到此完成了,接下来就是Flutter开发的 入门>进阶>放弃。。
官方配置文档
5,Flutter 学习资料
- Flutter官网
- Flutter中文网
- Flutter for Android 开发者
- Flutter github
- 咸鱼技术
- 掘金Flutter专栏
- 升级 Flutter
6,Flutter macOS环境配置
https://cloud.tencent.com/developer/article/2019901