在 Scaffold 里的 appBar 参数里用的这个 AppBar 小部件可以单独放在一个小部件里面，先剪切一下这里用的这个 AppBar 小部件。

然后在项目里新建一个文件，放在 lib/app/components 里面，名字是 app_page_header.dart，在这个文件里定义一个 StatelessWidget，名字是 AppPageHeader。

在 build 方法里 return 的东西就是刚才剪切的 AppBar 小部件。

回到 app.dart，在这里用一下刚才定义的 AppPageHeader 小部件，编辑器会自动帮我们导入这个小部件。这里提示了一个错误，说 AppPageHeader 不能作为 PreferredSizeWidget 类型的参数值。也就是 Scaffold 里的这个 appBar 参数，要求它的值是一个 PreferredSizeWidget。也就是带建议尺寸的小部件。

打开 app_page_header，这里我们可以让它实施一个抽象类，就是 Abstract class，名字是 PreferredSizeWidget。

实施了这个类以后，需要在类里面添加一个属性，用 @override 标注一下，这个属性值的类型是 Size，名字叫 preferredSize ，可以给它设置一个值，Size.fromHeight，高度是 100。

再回到 App 小部件观察一下，这回这里就不会提示错误了。

现在应用的界面上仍然会显示一个 AppBar 小部件，现在这个小部件来自 AppPageHeader 这个小部件。