Flutter AppBar标题与占满剩余空间RaisedButton布局报错求助

我来帮你搞定这个布局问题～你之前遇到的断言错误，是因为AppBar内部的_ToolbarLayout布局委托对title区域的子组件结构有要求，嵌套多余的Row会导致它没法正确处理所有子组件的布局。

正确的实现代码 #

直接把Expanded作为title的Row的直接子组件即可，不需要额外嵌套Row：

AppBar(
  title: Row(
    crossAxisAlignment: CrossAxisAlignment.center, // 让文字和按钮垂直居中对齐
    children: [
      const Text("Select view"),
      const SizedBox(width: 12.0), // 替代Padding，更简洁的间距控制
      Expanded(
        child: RaisedButton(
          child: const Text("view 1"),
          onPressed: () {
            // 这里编写你的点击逻辑
          },
        ),
      ),
    ],
  ),
)

为什么原来的代码会报错？ #

你之前在Padding里嵌套了额外的Row，而Expanded必须是Row/Column/Flex的直接子组件才能生效，多层嵌套会打乱AppBar内部的布局逻辑，导致_ToolbarLayout无法正确遍历并布局所有子组件，从而抛出那个“忘记布局子组件”的断言错误。

小提示 #

如果你的Flutter版本是2.0以上，RaisedButton已经被标记为弃用，推荐使用ElevatedButton替代，用法完全一致：

Expanded(
  child: ElevatedButton(
    child: const Text("view 1"),
    onPressed: () {
      // 你的点击逻辑
    },
  ),
)

内容的提问来源于stack exchange，提问作者TimSim