如何将小部件列紧紧地包裹在Card中?
问题内容:
我有我的应用程序的页面,只包括一个Card
用于保存Column
在其末端是一个MaterialList
。即使我的列表中只有一个或两个项目,该卡也会将其垂直空间扩展到屏幕底部,而不是停在列表项的末尾。该列的文件表明,这是正常的行为列(“布局每个孩子一零或零弹性系数(例如,那些不展开)与无界垂直约束”)。我以为将列表换成a
Flexible
可能会达到我想要的效果,但是当我尝试时出现以下错误:
RenderFlex children have non-zero flex but incoming height constraints are unbounded.
I/flutter (11469): When a column is in a parent that does not provide a finite height constraint, for example if it is
I/flutter (11469): in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a
I/flutter (11469): flex on a child (e.g. using a Flexible) indicates that the child is to expand to fill the remaining
I/flutter (11469): space in the vertical direction.
I/flutter (11469): These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child
I/flutter (11469): cannot simultaneously expand to fit its parent.
我显然误解了这种布局应该如何工作。
这是Scaffold
此页面主体现在的示例代码:
new Container(
// Outer container so we can set margins and padding for the cards
// that will hold the rest of the view.
alignment: FractionalOffset.topCenter,
margin: new EdgeInsets.only(top: style.wideMargin),
padding: new EdgeInsets.symmetric(horizontal: style.defaultMargin),
child: new Card(
child: new Column(
children: [
new CustomHeader(), // <-- a Row with some buttons in it
new Divider(),
new MaterialList(
type: MaterialListType.twoLine,
children: listItems, // <-- a list of custom Rows
),
],
),
),
)
我如何拥有一张紧密包裹Column
小部件的卡片?
问题答案:
默认情况下,Column
展开以填充最大垂直空间。您可以通过将该mainAxisSize
属性设置为来更改此行为MainAxisSize.min
,这将导致Column
仅占用其适合其子级所需的最小垂直空间。