Flutter - 将 AppBar 标题对齐到顶部

Question

我只想将我的 AppBar 的标题对齐到顶部而不是中间。

AppBar(
      title : Text('TITLE'),
      toolbarHeight : 100
)

我很惊讶以前从未有人问过这个简单的问题，而且几乎找不到解决方案。如果这个问题不应该出现在这里，请原谅我。如果是我会立即删除它。

Answer 1

您可以使用 kToolbarHeight 获取默认高度，然后您可以创建一个相同高度的大小框并对齐该大小框内的文本

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
          appBar: AppBar(
              title: Container(
                  height: kToolbarHeight,
                  color: Colors.red,
                  child: Text(
                    "Some title",
                    style: TextStyle(
                      color: Colors.black,
                    ),
                    textAlign: TextAlign.center,
                  )))),
    );
  }
}

我添加红色只是为了表明容器填充了 AppBar。

编辑

如果你想给外观一个特定的高度，也给 SizedBox 添加相同的高度..

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
          appBar: AppBar(
            toolbarHeight: 100,
              title: Container(
                  height: 100,
                  color: Colors.red,
                  child: Text(
                    "Some title",
                    style: TextStyle(
                      color: Colors.black,
                    ),
                    textAlign: TextAlign.center,
                  )))),
    );
  }
}