Flutter进阶学习

1、创建flutter组件使用示例项目

学习 Flutter SDK

1
2

flutter create --list-samples=samples.json
cat samples.json

1
2
3
4
5
6
7
8
9
10
11
12
13

{
     "sourcePath": "lib/src/widgets/basic.dart",
     "sourceLine": 1596,
     "id": "material.FittedBox.1",
     "channel": "stable",
     "serial": "1",
     "package": "flutter",
     "library": "material",
     "element": "FittedBox",
     "file": "material.FittedBox.1.dart",
     "description": "In this example, the image is stretched to fill the entire [Container], which would\nnot happen normally without using FittedBox."
 },
 ...

1
2
3
4
5

# samples.json 中 id
flutter create -sample=material.FittedBox.1 sample_fittedbox
code sample_fittedbox
flutter pub get
flutter run

2、app示例源码

官方示例代码库

3、好用的工具包

• 模块化开发 flutter_modular

• 权限 permission_handler

• 图库 image_picker

• 相册 image_gallery_saver

• 外链 url_launcher

• 存储 path

• 网络 dio

• 日志 logger_flutter

• 动画 lottie

• 日历 table_calendar｜syncfusion_flutter_calendar

• 唯一值 uuid

• 二维码 qr_flutter

• 本地化 easy_localization

• 对话框 awesome_dialog

• 列表头 flutter_sticky_header

• 图片加载 image

• 屏幕适配 flutter_screenutil

• 应用信息 package_info_plus

• 设备信息 device_info_plus

• 组件绘制 after_layout

• 日期选择 syncfusion_flutter_datepicker

• 手写签名 signature

• 多行文本 readmore

• 日期格式化 date_format

• 网络请求包

  • rxdart
  • dio
  • retrofit
  • json_annotation
  • json_serializable

4、dart包使用

• collection
• convert

5、关键字使用

• extension on 扩展

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

  http.get().mapFromResponse<A, B>((json) => xxx); extension on Future<http.Response> { Future<R> mapFromResponse<R, T>(R Function(T) jsonParser) async { try { final response = await this; if (response.statusCode == 200) { return jsonParser(jsonDecode(response.body)); } else { throw GenericHttpException(); } } on SocketException { throw NoConnectionException(); } } }