安装

Flutter 的安装自动带有 Dart,因此 Dart 语言环境并不需要再次安装。
此外, Flutter官方中文文档 也提供了详细的安装过程

下面只展示出现因为国内特有环境而导致 flutter doctor 报错问题:

1
2
3
4
5
6
7
8
[!] Network resources

    X A network error occurred while checking "https://maven.google.com/": 信号灯超时时间已到


    X A cryptographic error occurred while checking "https://github.com/": Handshake error in client

      You may be experiencing a man-in-the-middle attack, your network may be compromised, or you may have malware installed on your computer.

修复 maven.google 问题

在 Flutter 安装目录下,找到文件 packages/flutter_tools/lib/src/http_host_validator.dart,修改 kMaven 的路径为阿里云:

1
2
3
4
5
6
const String kCloudHost = 'https://storage.googleapis.com/';
const String kCocoaPods = 'https://cocoapods.org/';
const String kGitHub = 'https://github.com/';
/* 这里↓ */
const String kMaven = 'http://maven.aliyun.com/nexus/content/groups/public/';
const String kPubDev = 'https://pub.dev/';

模板框架

组件使用

动态列表 AnimatedList

Flutter 131: 图解 AnimatedList 动画列表-阿里云开发者社区 (aliyun.com)

tag标签 Chip

Flutter学习日记之Chip标签组件的使用_flutter chip-CSDN博客

分段控制器

Flutter CupertinoSlidingSegmentedControl 分段组件使用解析-CSDN博客

参考

  1. Flutter 开发文档 | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter
  2. 第二版序 | 《Flutter实战·第二版》 (flutterchina.club)
  3. Flutter UI Templates (fluttertemplates.dev)