Flutter中如何减少AppBar的标题空间

esu*_*esu 2 flutter flutter-layout

titleSpacing在 AppBar 的构造函数中覆盖了。但标题空间没有区别。

new AppBar(

backgroundColor: Colors.amber,
title: new Text("Flying Dutchman",
  style: new TextStyle(
    color: const Color(0xFF444444),
    fontSize: 30.0,
    fontWeight: FontWeight.w900,
  ),
),
titleSpacing: 0.00,
centerTitle: true,
elevation: 0.0,
)
Run Code Online (Sandbox Code Playgroud)

在此处输入图片说明

我希望减少应用栏标题的顶部空间。

Rém*_*let 12

titleSpacing与实际的应用栏高度和顶部填充无关。它是水平轴上的间距。

AppBar是遵循材质规则的预样式化组件。

如果您不喜欢这些规则,请不要使用AppBar。然后去创建你自己的组件!:)

这是一个实现示例:

class MyAppbar extends StatelessWidget implements PreferredSizeWidget {
  final String title;

  const MyAppbar({this.title});

  @override
  Widget build(BuildContext context) {
    return new Container(
        color: Colors.amber,
        height: preferredSize.height,
        child: new Center(
          child: new Text(title),
        ),
      );
  }

  @override
  Size get preferredSize => const Size.fromHeight(40.0);
}
Run Code Online (Sandbox Code Playgroud)

  • `TabBar` 只是一个小部件,就像其他任何小部件一样。它不需要与`Appbar` 一起使用。您可以在我的示例中添加一个“TabBar”。 (2认同)