组织 Flutter 小部件的最佳方式是什么?

What is the best way to organize Flutter widgets?

我正在编写一个 Flutter 应用程序,我想知道什么是使我的代码更具可读性的最佳方法。

现在,我知道这两种方法:

  1. 创建最终变量并将自定义小部件存储在其上。
  2. 创建一个新的小部件作为模板。

有什么推荐的方法吗?

至于:

  1. create a final variable and store the customized widget on it

使用 class 变量来保存您的小部件,例如

final Widget foo = new Foo();

可能没有必要,或者可能指向其他一些问题。我认为你最好创建一个 returns 你的小部件的函数,例如

Widget _buildFoo() {
  return new Foo();
}

然后您可以在您的 build() 方法中使用它,例如 (我正在添加 MaterialApp Scaffold 以提供更多上下文):

@override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("My App"),
      ),
      body: _buildFoo(),
    );
  }

查看网络上的其他示例应用程序,例如 Flutter Examples,了解构建小部件的想法。

至于:

  1. create a new widget as a template

我将把这解释为创建另一个文件来保存您的小部件 class 例如foo.dart。这可能不是您要问的,但是随着应用程序的增长,为每个小部件创建新的 dart 文件可能会成为一个好主意。对于简单的应用程序,尤其是您看到的大多数示例应用程序,将 classes 保留在同一个 dart 文件中(例如 main.dart)就可以了。同样,我可能不是在回答你的问题。

回到:

best way to make my code more readable

因此,总而言之,使用 return 小部件树的不同部分的私有函数(即仅 return 一个小部件及其可能包含的任何子小部件的函数)通常比将小部件存储为 class 个实例变量。如果以后需要引用小部件或与小部件交互,则可能需要使用 class 变量;然而,这可能是一种不好的做法,可能会指出一种更好的方法来处理状态和小部件树结构的变化(例如,Flutter 的有状态和继承小部件非常适合处理需要进行命令式调用的状态变化在对象引用上)。