如何修复 Appbar 左侧的项目，同时在 Flutter 中将标题保持在 Appbar 的中心？

Question

我想把“Logo2”小部件放在左边，而“Title logo”放在中间。我尝试在行内使用扩展，并使用堆栈，但我无法当场得到它。我还需要它在不同的屏幕尺寸上工作。

当前代码：

appBar: AppBar(
  leading: Icon(Icons.menu),
  centerTitle: true,
  title: Container(child: Row(
    children: <Widget>[
      Expanded(flex:2, child: Text("Logo 2")),
      Expanded(flex:4, child: Text("Title logo")),
    ],
  )),
  actions: <Widget>[
    IconButton(
      icon: Icon(Icons.person_pin),
      onPressed: (){},
    )
  ],
),

Answer 1

您可以直接传递Row小部件并将Logo 2的flex属性设置为1而不是2。AppBar小部件还包含一个名为@987654329的属性，而不是用Container包装Row @ 如果设置为 0，则有助于保持标题 centered。工作代码如下：

appBar: AppBar(
          titleSpacing: 0,
          leading: Icon(Icons.menu),
          centerTitle: true,
          title: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Expanded(
                flex: 1,
                child: Text('Logo 2'),
              ),
              Expanded(
                flex: 2,
                child: Text('Title Logo')
              )
            ],
          ),
          actions: <Widget>[
            IconButton(
              icon: Icon(Icons.person_pin),
              onPressed: (){},
            )
          ],
        ),

希望这能回答你的问题。