创建窗口小部件的函数和类有什么区别？

Question

我已经意识到，可以使用普通函数创建小部件，而不是将StatelessWidget子类化。一个例子是这样的：

Widget function({ String title, VoidCallback callback }) {

  return GestureDetector(

    onTap: callback,

    child: // some widget

  );

}

这很有趣，因为它需要远远比一个全面的类更少的代码。例：

class SomeWidget extends StatelessWidget {

  final VoidCallback callback;

  final String title;

  const SomeWidget({Key key, this.callback, this.title}) : super(key: key);

  @override

  Widget build(BuildContext context) {

      return GestureDetector(

        onTap: callback,

        child: // some widget

      );

  }

}

所以我一直在想：创建小部件的函数和类之间在语法上是否有区别？使用函数是否是一种好习惯？

Answer 1

永远不要在类上使用函数来制作可重用的widget-tree。始终将它们提取到StatelessWidget中。使用函数而不是使用类之间存在巨大差异，即：框架不知道函数，但可以看到类。考虑以下“窗口小部件”功能：Widget functionWidget({ Widget child}) {  return Container(child: child);}用这种方式：functionWidget(  child: functionWidget(),);它相当于类：class ClassWidget extends StatelessWidget {  final Widget child;  const ClassWidget({Key key, this.child}) : super(key: key);  @override  Widget build(BuildContext context) {    return Container(      child: child,    );  }}这样使用：new ClassWidget(  child: new ClassWidget(),);在纸上，两者似乎做的完全一样：创建2 Container，一个嵌套在另一个中。但是实际情况略有不同。对于函数，生成的窗口小部件树如下所示：Container  Container在使用类时，小部件树为：ClassWidget  Container    ClassWidget      Container这非常重要，因为它从根本上改变了更新小部件时框架的行为。以下是精选的差异列表：类：允许性能优化（const构造函数，operator ==覆盖，更精细的重建）有热装集成到小部件检查器（debugFillProperties）可以定义键可以使用上下文API确保所有小部件都以相同的方式使用（始终是构造函数）确保在两个不同的布局之间进行切换可以正确处理资源（功能可以重用某些先前的状态）功能：更少的代码（甚至在那里，我都制作了代码生成器以使类与函数一样小：functional_widget）？结论应该已经很清楚了：不要使用函数创建小部件。

Answer 2

调用Flutter小部件时，请确保使用const关键字。例如const MyListWidget();