防止小部件填充在 Flutter 中扩展的祖先

Joe*_*app 7 flutter flutter-layout flutter-widget

如何防止 aRaisedButton扩展以填充Expanded包含它的 ?我想创建三列宽度与可用空间成正比的列,但我希望每列中的子项是其自然大小,而不消耗其父项的整个宽度Expanded

  Widget _controls(BuildContext cx) {
    return Row(
      children: [
        Expanded(
          flex: 1,
          child: player.isOnFirstItem
              ? Container()
              : IconButton(
                  icon: Icon(Icons.arrow_back),
                  onPressed: () => control.gotoPreviousItem(),
                ),
        ),
        Expanded(
          flex: 4,
          child: player.isComplete()
              ? Text(player.currentItem.status) // I'll be adding more here
              : RaisedButton(
                  child: Text(player.currentItem.actionText),
                  onPressed: () => player.currentItem.action(),
                ),
        ),
        Expanded(
          flex: 1,
          child: player.isOnLastItem
              ? Container()
              : IconButton(
                  icon: Icon(Icons.arrow_forward),
                  onPressed: () => player.gotoNextItem(),
                ),
        ),
      ],
    );
Run Code Online (Sandbox Code Playgroud)

RaisedButton还填充内的柔性空间时,我还窝它Container。我无法弄清楚哪些属性可能会阻止这种情况。

四处寻找答案,似乎每个人都在努力实现相反的目标。

Pab*_*era 8

看看文档是怎么Expanded说的:

扩展 Row、Column 或 Flex 的子级以便子级填充可用空间的小部件。

因此,RaisedButton将填充可用空间。

你试图用 包裹按钮Container,但看看文档 的内容Container,以防它有一个孩子:

(在这种情况下)小部件有一个子部件,但没有高度、宽度、约束和对齐,容器将约束从父级传递给子级,并调整自身的大小以匹配子级。

因此,RaisedButton将从 的父级获取约束Container,即填充可用空间。

您需要的是RaisedButton用一个小部件包装它,该小部件不会自行调整大小以匹配孩子的大小(因为它不会扩展)并且不会改变孩子的大小(因为孩子可以扩展)。

因此,一些包装RaisedButton满足这些条件的小部件可能是:

  • Row
  • Wrap
  • UnconstrainedBox
  • ColumnmainAxisSize: MainAxisSize.min
  • CenterheightFactor: 1.0.
  • AlignheightFactor: 1.0.

  • 就这样做到了!我刚刚添加了一个中心。我想我错过了小部件的这方面。非常感谢。 (2认同)