행이 열 내부에 수평으로 중앙에 있지 않은 이유

Question

기본적으로 아시다시피 열 은 전체 너비가있는 경우 자식을 가로로 가운데에 배치합니다.하지만 두 개의 카드와 한 행을 열 안에 배치하면 두 개의 카드가 가로 중앙에 플러터로 배치되지만 행은 시작 위치에 그대로 유지 됩니까? 왜? 내 경우에는 행이 Column의 자식이기 때문에 가로 중앙에 있어야
한다고 생각 하지만 그렇지 않습니다.

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter App'),
      ),
      body: Container(
        color: Colors.purple,
        height: double.infinity,
        child: Column(
          //  mainAxisAlignment: MainAxisAlignment.center,
          //  crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Card(
              child: Text(
                'Chart',
                style: TextStyle(fontSize: 20.0),
              ),
              elevation: 5,
              color: Colors.blue,
            ),
            Card(
              child: Text(
                'list of tx',
                style: TextStyle(
                  fontSize: 20.0,
                ),
              ),
              color: Colors.purple,
            ),
            Row(
              children: [
                Text('this is row'),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

이 코드의 출력

Answer 1

이것은 기본적으로 Row가 전체 수평 공간을 차지하기 때문에 발생합니다. 가능한 한 적은 공간을 차지하도록 지시하여 수정할 수 있습니다.

Row(
    mainAxisSize: MainAxisSize.min,
    ...
)

mainAxisAlignmentof Row를로 설정하는 것은 Row MainAxisAlignment.center안에 위젯이 하나있는 경우에만 작동합니다. 그것은 단지 아이들에게 센터에 가라고 말할뿐입니다.

Answer 2

기본으로 mainAxisSize속성입니다 MainAxisSize.max에 행이 방금로 변경됩니다해야 할 무엇, 위젯 MainAxisSize.min, 부모 위젯에 의해 영향을,이 예에서는 누가이다 칼럼

Row(
    mainAxisSize: MainAxisSize.min,
    ...
)

Answer 3

mainAxisAlignmentRow에 인수 를 전달 하십시오. 예를 들면

Row(
    mainAxisAlignment: MainAxisAlignment.center,
    ...
)

이렇게하면 행의 자식이 중앙에 배치됩니다.