2.3　Flutter中小部件的概念

Flutter中一切都是小部件，小部件是构造块，UI组件。如果将一个Flutter应用运行到移动设备上，它通常由多个小部件组成。例如顶部的标题栏、导航栏、标题图片、包含内容的列表等，它们都是单独的小部件，通常还包含其他小部件，如图2.8所示。图2.8中的列表含列表项作为子部件。页面本身也是小部件，如图2.8所示的scaffold小部件，甚至整个应用程序都包含在一个根小部件中。

因此小部件实际上是UI组件，但它们不仅仅是视觉组件，还包含逻辑组件。例如，按钮小部件不仅会显示按钮，还会定义单击按钮时会发生什么。构建Flutter应用程序是通过创建UI，然后编写UI的逻辑来实现的，例如选择移动设备上的图片并上传到服务器上、从服务器上获取数据并渲染到屏幕上等。

图2.8　Flutter应用中的小部件

我们可以将Flutter应用视为小部件的树，一个根小部件包含整个应用程序，可能会有40个不同页面的小部件作为子小部件，然后为子小部件嵌套其他小部件，如图2.9所示。

图2.9　Flutter中的小部件树

实际上我们建立了如图2.9所示的一个小部件树，我们可以使用Dart编程语言完成所有这些工作，让我们看看如何创建这样的小部件树。