Flutter 笔记 | Best Practice Tips for Flutter

1. 保持 build 方法纯净

build方法必须是纯粹的/没有任何不需要的东西。这是因为有一些外部因素可以触发一个新的小部件构建，下面是一些例子:

• Route pop/push

• 屏幕大小的调整，通常是因为键盘显示或屏幕方向的改变

• 父部件重新创建了它的子部件

• Widget 依赖的 InheritedWidget (Class. of(context)模式) 发生变化

DON’T：

@override
Widget build(BuildContext context) {
   
    return FutureBuilder(
            future: httpCall(),
            builder: (context, snapshot) {
   
            // create some layout here
        },
    );
}

DO：

class Example extends StatefulWidget {
   
    @override
    _ExampleState createState() => _ExampleState();
}
class _ExampleState extends State<Example> {
   
    Future<int> future;
    
    @override
    void initState() {
   
        future = repository.httpCall();
        super.initState();
    }

    @override
    Widget build(BuildContext context) {
   
        return FutureBuilder(
                future: future,
                builder: (context, snapshot) {
   
                // create some layout here
                },
        );
    }
}

2. 理解Flutter布局约束概念

Flutter布局有一个经验法则，每个Flutter应用程序开发人员都需要知道: 约束向下，大小向上，父元素设置位置。

• widget有来自其父组件的约束。已知约束是一组包含四个double的集合: 最小和最大宽度，最小和最大高度。

• 接下来，widget将遍历它自己的子列表。widget一个接一个地命令其子widget的约束条件是什么(每个子widget的约束条件可能不同)，然后询问每个子widget想要的大小。

• 接下来，widget依次定位它的子widget(水平x轴，垂直y轴)。然后，widget将自己的大小通知其父组件(当然，在原始约束范围内)。

在Flutter中，所有widget都基于它们的父组件或它们的框约束来提供自身。 widget的大小必须在其父组件设置的约束范围内。

3. 使用运算符以减少执行代码的行数

• 使用级联运算符

如果我们要对同一个对象执行一系列操作，那么我们应该选择 ..运算符：

DON’T：

var path = Path();
path.lineTo(0, size.height);
path.lineTo(size.width, size.height);
path.lineTo(size.width, 0);
path.close();

DO：

var path = Path()
..lineTo(0, size.height)
..lineTo(size.width, size.height)
..lineTo(size.width, 0)
..close();

• 使用集合展开运算符

当现有项已存储在另一个集合中时，可以使用展开运算符，展开集合语法会使代码变得更简单。

DON’T：

var y = [4,5,6];
var x = [1,2];
x.addAll(y);

DO：

var y = [4,5,6];
var x = [1,2,...y]; 

• 使用 Null 安全（??）和 Null 感知（?.）运算符

代码中应该总是将??（如果为null）和 ?.（null感知）运算符作为第一追求，而不是条件表达式中的null检查。

DON’T：

v = a == null ? b : a;
v = a == null ? null : a.b;

DO：

v = a ?? b; 
v = a?.b;

• 尽量使用“is”运算符，而不是使用“as”运算符

通常，如果无法进行强制转换，则强制转换运算符会抛出异常。为了防止抛出异常，可以使用“is”。

DON’T：

(item as Animal).name = 'Lion';

DO：

if (item is Animal) item.name = 'Lion'; 

• 使用字面量初始化可增长集合

Good：

var points = []; 
var addresses = {
   };

Bad：

var points =