flutter 时间轴_Flutter 开发系列教程(1) 序

本系列讲解flutter的开发及遇到的常见问题，希望能够帮助到大家。也锻炼自己的写作能力。如果有兴趣的朋友也可以私信我，一起讨论。这是本人第一次写作，如果有不适还请多多指正。

本系列适用人群：APP开发人员。如果您还不是一个码农，那可能很难懂此文。如果您是APP的开发人员，那您可能更轻松明白。

本教程以windows开发为主，请准备一台windows机器。

本系列的大概内容：

1. 序 内容：环境搭建、常用资源、常见问题。
2. 创建项目 内容：创建第一个项目。使用插件。
3. 布局上 内容：列表的布局。
4. 布局下 内容：时间轴的布局。
5. 接口对接 内容：网络请求。与后台的数据的对接。

一、环境搭建

1、系统配置要求，要想安装和运行 Flutter，你的开发环境至少应该满足如下的需求：

• 操作系统：Windows 7 SP1 或更高的版本(64 位操作系统)。
• 磁盘空间：除安装 IDE 和一些工具之外还应有至少 400 MB 的空间。
• 工具：要让 Flutter 在你的开发环境中正常使用，依赖于以下的工具：
• Windows PowerShell 5.0 或者更高的版本(Windows 10 中已经预装了)
• Git for Windows 2.x，并且勾选从 Windows 命令提示符使用 Git 选项。
• 如果 Windows 版的 Git 已经安装过了，那么请确保能从命令提示符或者 PowerShell 中直接执行 git 命令。

2、获取 Flutter SDK

参见：https://flutter-io.cn/docs/development/tools/sdk/releases

将压缩包解压，然后把其中的 flutter 目录整个放在你预想的 Flutter SDK 安装目录中(比如 C:srcflutter；请勿将该目录放在一些需要额外操作权限的目录，比如 C:Program Files)。找到 flutter 目录中的 flutter_console.bat 文件，双击执行该批处理脚本。

3、参数配置

• 在path变量里增加 C:srcflutterbin，如果你的安装目录是(C:srcflutterbin)。
• 在用户变量还要增加一个 FLUTTER_STORAGE_BASE_URL ，值：https://storage.flutter-io.cn
• 在用户变量还要增加一个 PUB_HOSTED_URL ,值：https://pub.flutter-io.cn

path配置

变量配置

变量配置

二、常用的学习资源

1. https://flutter-io.cn 中文网站
2. https://github.com/alibaba/flutter-go 一个完整的flutter演示APP
3. https://pub.dev/ flutter插件库，可以查找想要的插件
4. https://github.com/Solido/awesome-flutter 插件及演示的汇总列表

三、常见问题

1、flutter升级遇到网络错误 - Got socket error。win7双击打开flutter_console.bat，尝试用flutter upgrade升级时，遇到错误。

 E:sdk_flutterflutter>flutter upgradeChecking Dart SDK version...Downloading Dart SDK from Flutter engine 09d05a38912a3c1a906e95099cac9a7e14fae85f...Unzipping Dart SDK...Updating flutter tool...Got socket error trying to find package mockito at https://pub.dartlang.org.Error: Unable to 'pub upgrade' flutter tool. Retrying in five seconds...

设置2个环境变量(环境配置已经说过)

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

2、Waiting for another flutter command to release the startup lock...

 // 杀死dart进程 flutter packages pub build_runner watch // 终极方案,删除flutter SDK文件夹目录下的bin/cache下边的lockfile文件 rm ./flutter/bin/cache/lockfile