Introduction to Flutter Widgets

小部件（Widgets）是Flutter应用程序的基本构建块。它们描述了界面在任何给定时刻的外观。换句话说，您在屏幕上看到的每个元素（以及一些看不见的元素）都是一个小部件。这包括按钮、文本、滑块、图像，甚至应用程序本身。

在本单元中，我们将深入探讨Flutter小部件的世界。我们将首先了解无状态（stateless）小部件和有状态（stateful）小部件之间的区别，然后指导您创建自己的自定义小部件的过程。

理解无状态和有状态小部件

在Flutter中，小部件可以是无状态的或有状态的。

无状态小部件是不可变的，这意味着它们的配置在创建时设置，并且无法更改。它们描述的是用户界面的一部分，可以依赖构造函数中的配置信息，并且仅在该信息发生变化时才会改变。例如，Text小部件是无状态的，因为在创建时我们给它一个文本字符串，除非销毁并重新创建带有新文本的小部件，否则文本不会更改。

另一方面，有状态小部件可以随时间变化。它们可以在小部件本身或外部保存可变状态，并且可以通过调用setState在屏幕上重新绘制。例如，复选框是一个有状态小部件，因为它可以随时间被选中或取消选中。

构建自定义小部件

在Flutter中构建自定义小部件是每个Flutter开发者都应该具备的基本技能。它涉及将较小的小部件组合成更大、更复杂的小部件。

要创建一个自定义小部件，您需要创建一个新的类，该类扩展自StatelessWidget或StatefulWidget，然后覆盖build方法。build方法描述了小部件在任何给定时刻的外观。它返回一个新的小部件树，其中可以包括您创建的自定义小部件和标准Flutter小部件。

以下是一个自定义无状态小部件的示例：

class CustomButton extends StatelessWidget {
  final String label;

  CustomButton({this.label});

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      child: Text(label),
      onPressed: () {
        print('Button pressed');
      },
    );
  }
}

在这个例子中，CustomButton是一个无状态小部件，它接受一个标签作为参数，并创建一个带有该标签的RaisedButton。当按钮被按下时，它会在控制台打印一条消息。

通过本单元的学习，您应该对Flutter中的小部件如何工作有了扎实的理解，并且能够创建自己的自定义小部件。随着我们继续前进并开始构建更复杂的Flutter应用程序，这将是一项关键的技能。