Flutter是什么?他是谷歌根据Dark语言开源的跨平台开发依赖。和目前比较火的Reactive Native一样,一套代码能够实现两个不同平台的App。那么为什么要介绍Flutter而不是在国内大火的Reactive Native
之前Flutter只支持Mac OS,Linux系统。好在现在推出了Windows平台,可以说是非常奈斯了,降低了学习这么跨平台的成本。
第一步:安装Git
你需要安装Git作为Flutter SDK的下载工具。这里我推荐去百度软件中心下载,官网慢的一匹。下载完安装就可以了。
第二步:下载Flutter SDK
Windows桌面右键点击git base here。当然你也可以选择一个文件夹打开git 命令行窗口,输入以下命令下载Flutter SDK。
代码语言:javascript复制git clone -b alpha https://github.com/flutter/flutter.git
注意:Flutter的下载路径要全英文并且路径不能有空格!Flutter的下载路径要全英文并且路径不能有空格!Flutter的下载路径要全英文并且路径不能有空格!
第三步:配置环境变量
你需要在Windows 环境变量Path中添加flutter的路径。路径指向到Flutter文件的bin路径如下图:
第四步:安装
打开PowerShell(管理员)输入以下指令:
代码语言:javascript复制flutter doctor
Flutter 就会自动配置安装。当然你也可以在git上操作。前提是要在flutter目录的bin文件夹之下操作。成功了之后你就会看到如下界面:
如果当中有某些项目显示‘X’。那就需要你去安装啦,再次输入:
代码语言:javascript复制flutter
他就会自动安装对应的依赖。
第五步 开发软件
你需要安装Android Studio 以及Android SDK,之前有就不需要重新装了。除次之外,Flutter的开发暂时不支持在Android Studio中开发,只能使用同一个公司的产品IntelliJ。需要你下载一个,IntelliJ免费版功能较少,下载的时候注意下载专业版,网上有破解教程这里自行百度,不再多说。下载完成之后在Setting中选择Plugins如下图:
搜索:Flutter和 Dark安装。当然你还要下载Dark SDK 建议下载安装版本,他会帮你进行配置。
第六步:重启电脑 (我还是建议你重启一下)
第七步:创建你的Flutter项目
InterlliJ创建一个Flutter项目,如果你经常使用模拟器在调试,类似于Genymotion。他会报如下错误,导致界面空白无法渲染。
代码语言:javascript复制E/flutter (13181): [ERROR:flutter/shell/gpu/gpu_surface_gl.cc(43)] Failed to setup Skia Gr context.
我推荐你还是真机调试,成功之后就是如下界面:
如果你使用的是虚拟机,例如Genymotion。在运行时可能会出现如下提示:
进入白屏,那么你需要换一个虚拟机啦。亲测:Nexus 5X可用。
现在就开始你的Flutter学习之旅吧!