Flutter 카드 안에 위젯 열을 꽉 둘러싸려면 어떻게 해야 하나요?, How can I tightly wrap a Column of widgets inside a Card?

질문

내 앱의 페이지 중 하나는 Card만 포함하고 있으며, 이 카드는 끝에 Column을 가지고 있으며, 그 끝에는 MaterialList가 있습니다. 리스트에 항목이 하나 또는 두 개만 있는 경우에도, 카드는 리스트 항목의 끝이 아닌 화면 하단까지 수직 공간을 확장합니다. Column 문서에 따르면 이는 일반적인 Column 동작("각 자식은 수직 제약이 없는 상태에서 유연성이 없거나 0인 가중치 요소(예: Expanded가 아닌 자식)를 배치합니다")이라고 합니다. 원하는 효과를 얻기 위해 리스트를 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(
// 카드의 여백과 패딩을 설정할 수 있도록 외부 컨테이너
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(), // <-- 일부 버튼이 있는 행
      new Divider(),
      new MaterialList(
        type: MaterialListType.twoLine,
        children: listItems, // <-- 사용자 정의 행의 리스트
      ),
    ],
  ),
),

)

Column 위젯의 내용을 담고 있는 카드를 어떻게 단단하게 감쌀 수 있을까요?

답변

기본적으로 Column은 최대 수직 공간을 채우도록 확장됩니다. mainAxisSize 속성을 MainAxisSize.min으로 설정하여 이 동작을 변경할 수 있습니다. 이렇게 하면 Column은 자식 요소를 맞추기 위해 필요한 최소한의 수직 공간만 차지합니다.