flutter - Flutter.. 如何实现自定义 App Bar - Usage and Re-Usage

Question

我为我的 Flutter 移动应用创建了一个自定义应用栏 (CAB)，它应该出现在每个页面的顶部。现在整个代码被复制/粘贴在每一页上。但是有没有一种方法可以创建一次 CAB 组件并将其作为独立组件放置在每个页面上，这样如果我想对 CAB 进行更改，我就不必一遍又一遍地执行相同的编辑CAB 出现的页面？只是想稍微整理一下。谢谢！

Answer 1

要制作自定义 Appbar，您需要实现 PreferredSizeWidget，因为 AppBar 本身实现了它。

class MyAppBar extends StatelessWidget implements PreferredSizeWidget {
final String screenTitle;

MyAppBar({@required this.screenTitle});

@override
Widget build(BuildContext context) {
  return AppBar(
    title: Text(screenTitle),
    actions: // Whatever you need
  );
}

@override
Size get preferredSize => Size.fromHeight(kToolbarHeight);
}

您还需要覆盖 get preferredSize 并指定一个高度。在这个例子中，我使用了 Flutter 已经指定的常量 56.0 作为 AppBar 的工具栏组件。