flutter 小技巧

语法篇

var 和 dynamic 的区别

• var 实际上就是个“语法糖”。在Dart编译的时候会自动推导出数据的类型。
• dynamic 表示一个动态的类型，被编译后，实际是一个object类型，在编译期间不进行任何的类型检测，而是在运行期间进行类型检测。

空值处理

如果一个变量为空时，则进行赋值操作

1
2
3
4
5
6
7

// 如果 title 等于 null 则 title = 'Title' 
if (title == null) {
  title = "Title";
}

// 和上面的效果一样
title ??= "Title";

判断对象属性是否可以调用

1
2
3
4
5

// 如果 url 等于 null 则不会调用 search 方法
url && url.search()

// 和上面的效果一样
url?.search()

编辑器

快速创建 StatelessWidget

在编辑器中输入stless就可以快速创建一个StatelessWidget。

快速创建 StatefulWidget

在编辑器中输入stful就可以快速创建一个StatefulWidget

布局查看器

AndroidStudio也提供了和浏览器差不多的布局查看工具，可以通过边框的形式查看Flutter的布局

• 打开AndroidStudio右边的Flutter Inspector面板
• 点击面板左上角的小图标

JSON 转 Model

尝试了各种自动化的方法把 JSON 转换成 Model，网页版的呢太麻烦了，每次都要打开网页才行。 所以就从AndroidStudio的Plugins下手，试用了10个插件，最终选用Json2Dart，它生成的代码比较简洁，也比较符合当前开发的规范。

操作演示

快速重写方法

Mac control + o
Windows ctrl + o(没试过，只是根据Mac端转义过来的)

Flutter 资源相关

Flutter 的图标库是来自 Material design 。