准备好尝试Flutter开发了?那我们开始吧!

准备工作

配置AndroidStudio

首先,通过向导安装Android Sdk,请记住您Sdk的安装位置

只要网络好(10MB/s),大概两分钟就ok了,单击Finsh关闭向导,然后窗口留着备用。

获取Flutter工具

作为学习者,对于生产环境不需要那么重视,我们当然要使用最前沿的版本以学习最新的特性,因Flutter预览版需要在github获取编译,国内访问github速度感人,所以我们创建了 Flutter仓库镜像,同步频率为1小时一次。

首先打开你的终端(windows下为cmd或powershell)

cd到你想保存Flutter Sdk的路径

执行 git clone https://git.weiran.org.cn/WeFlutter/flutter.git

之后你会得到一个名为flutter的文件夹,至此获取Flutter工具结束。

配置环境变量

不同的操作系统配置环境变量的方法不同,请根据您的系统进行操作,下文以linux为例

首先,创建一个名为ANDROID_HOME的环境变量,值为你开头Android Sdk的安装位置。

$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools 添加进path,具体放方法参考您的操作系统。

将Flutter的安装路径/bin添加进path,具体放方法参考您的操作系统。

创建环境变量PUB_HOSTED_URL,值为https://pub.flutter-io.cn ,我们将使用Flutter中文社区的pub包镜像。

创建环境变量FLUTTER_STORAGE_BASE_URL,值为https://storage.flutter-io.cn,我们将使用lutter中文社区的Flutter包镜像。

至此,配置环境变量结束。

检查Flutter工具

重新打开终端,执行 flutter doctor 初始化Flutter工具,过程中会下载依赖,请保持网络畅通。

我们看到有一个Android许可协议警告,执行flutter doctor --android-licenses 然后一路y接受协议。

Hello World

接下来使用Android Studio打开flutter/examples/hello_world,这是Flutter官方送的Hello World。

将左上角Android调整为Project,这样就可以看到项目目录啦

左上角File>Setting>Plugins 搜索Flutter安装Flutter插件(过程中会一起安装Dart插件)

重启AndroidStudio

再次打开Settings,设置Flutter Sdk路径

打开项目lib/main.dart

一开始有一大堆报错,不要慌!终端执行flutter packages upgrade 获取并升级依赖。

再次执行flutter doctor,确认Android Studio没有错误警告。

使用数据线连接您的Android或ios设备(仅mac)或使用模拟器,执行flutter run或点击小三角运行 hello world。

等待编译完毕并安装完成,,

接下来,您可以尝试编译并运行examples中的其他代码,或查看这些代码并更改他们,点击小闪电,感受Flutter带来的开发效率!

本文结束,我们,下个文章见!


0 条评论

发表评论

电子邮件地址不会被公开。 必填项已用*标注