如何将应用栏中的列居中

Question

我如何在

Center

中

column

Appbar

？我在网上搜索过，即使添加了带有

mainAxisAlignment

和

mainAxisSize

的行后，列仍然不居中。适用于所有输入的 TIA。此外，该页面是第二页，因此有一个前导图标。

return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Container(
          color: Colors.deepPurple,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            mainAxisSize: MainAxisSize.min,
            children: [
              Column(
                children: [
                  Padding(
                    padding: const EdgeInsets.only(top: 8.0),
                    child: Text(widget.id),
                  ),
                  Padding(
                    padding: const EdgeInsets.symmetric(vertical: 8.0),
                    child: Text(
                      _caption,
                      style: const TextStyle(fontSize: 14),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );

Answer 1

您的代码按预期工作：

查看您的小部件的显示方式：它正确地将列置于

AppBar

内的中心。

这是一个将应用栏中的列居中的小示例，全部都是关于设置

centerTitle: true

，

appBar: AppBar(
  backgroundColor: Colors.blue,
  centerTitle: true,
  title: Column(
    children: [
      Text('First Text'),
      Text('Second Text'),
      
    ],
  ),

外观如何：

如果您期望不同的输出，请告诉我。

希望对您有帮助。