vlambda博客
学习文章列表

我学Flutter--1、环境搭建

我学Flutter

最近想研究一门新语言,开始选定的是kotlin,后来听同事说可以考虑Flutter。一想也对难道放着Google亲儿子不学学干儿子,所以暂时先学习Flutter。不过Kotlin可能在后期也会放入学习的历史。

由于以前也对Flutter有过一些了解,学到无法动态创建界面就放弃了,当然也有不认真的因素在里面。这一 次就想认真的研究一下,毕竟现在已经到了1.17.1版本。

本着以往学习习惯,将学习Flutter计划分为以下几步:

1、环境搭建,完成官方给定第一个Demo,并解决遇到的问题

2、网上找一篇比较好的帖子,跟着一起走一遍,并总结学习过程中遇到的问题

3、查找一个比较好的开源项目,研究一下代码。按照我的习惯,一步一步将代码迁移过来,完成主干线上的代码。

4、找一个项目,先做界面,然后拉取数据,而数据的接口是其他语言调通过的,尽可能的避免一些未知问题,比如数据接口不通等。

5、重构,重构是软件开发的重头戏,所有的优化都必须是以此为基础的。

我会尽可能详细的记录下学习过程并进行分享,希望能在介绍Flutter的学习过程中能将多年的编程心得也有所展现,能帮助一些新入门的人在Flutter上有一个大步的提高。并保证尽可能每周更新一两次。


1、开发环境搭建

[官网]    https://flutter.dev/ 官网

从官网获取 Flutter,并进行环境搭建,这个网上有太多的教程,包括官网也说得比较清楚,所以只是一笔带过。

1.1 下载

1.1.1 官网获取

1.1.2 以windows为例

我学Flutter--1、环境搭建

1.1.3 下载完整包

我学Flutter--1、环境搭建

1.2 安装

1.2.1 将Flutter解压到指定目录

我学Flutter--1、环境搭建

1.2.2 配置Path路径

我学Flutter--1、环境搭建

我学Flutter--1、环境搭建

验证

我学Flutter--1、环境搭建

1.2.3 flutter doctor查看环境

我学Flutter--1、环境搭建

1.3 配置Android Studio

Android Studio的环境搭建就不做介绍,毕竟做Android开发的人还是比较多的,介绍的文档也比较多。

1.3.1 配置Android SDK ROOT

我学Flutter--1、环境搭建

再次验证

我学Flutter--1、环境搭建

1.3.2 安装Flutter插件

在这里一直遇到不少问题,我的Android Studio无法获取插件,从网上找到很多解决方案都无效。结果将关机第二天就OK了,真让人无语。如果遇到这个问题可以在网上多找找,可能后期版本就能解决。

以下是解决后的情况,通过查找flutter,可以看到有多个插件,我们只是要安装Flutter,单击install。

我学Flutter--1、环境搭建

弹出对话框,单击Accept

我学Flutter--1、环境搭建

再次弹出对话框,单击yes

我学Flutter--1、环境搭建

进入安装过程

我学Flutter--1、环境搭建

重启IDE后就可以了开始项目。

我学Flutter--1、环境搭建

2、第一个项目

安装完成Flutter插件后,打开AS,单击File->New->New Flutter Project

我学Flutter--1、环境搭建

选择FlutterApplication,就可以新建Flutter项目

我学Flutter--1、环境搭建

选择项目名,Flutter SDK 路径等

我学Flutter--1、环境搭建

设置包名,暂时就不选kotlin和Swift等选项。

我学Flutter--1、环境搭建

进入创建Flutter项目对话框,这里要相当长的时候,最好能等待,不然就会有一些问题。

我学Flutter--1、环境搭建

由于我没有耐心等待,并进入项目目录查看到已经创建好了源码,所以我就强制关闭了AS。所以导致了以下那些问题。

我学Flutter--1、环境搭建

我学Flutter--1、环境搭建

2.1 问题:Waiting for another flutter command to release the startup lock

解决方式:

  1. 先打开任务管理器,结束掉所有dart.exe。

  2. 然后打开flutter安装目录文件夹,找到\bin\cache中的lockfile文件删除。

  3. 配置环境变量:PUB_HOSTED_URL 和 FLUTTER_STORAGE_BASE_URL。

PUB_HOSTED_URL 的值是 https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL 的值是 https://storage.flutter-io.cn
  1. 在项目根目录下,用powershell执行flutter packages get,只能是powershell,不支持其他终端。

  2. 重启idea。

我学Flutter--1、环境搭建

我学Flutter--1、环境搭建

我学Flutter--1、环境搭建

2.2 问题:Running Gradle task 'assembleDebug'...

解决办法:

参照:https://www.cnblogs.com/wupeng88/p/11455874.html

我学Flutter--1、环境搭建

同时修改Gradle到3.6.3

android->gradle->wrapper->gradle-wrapper.properties gradle改为最新版本5.6.4,这个主要是为了配置As3.6.3

我学Flutter--1、环境搭建


我学Flutter--1、环境搭建


突然发现世界一下变好了,代码可以运行了。

好,到现在为止终于将整个环境搭建完成。好像基本上一行代码没写,也没有太多技术,不过这才刚刚开始。