Flutter에서 Row 위젯을 사용하면 가로로 여러 위젯을 배치할 수 있습니다. Row 위젯은 자식 위젯들을 가로로 나열하며, 자식 위젯들의 위치를 조절하는 방법을 알아보겠습니다.

MainAxisAlignment

Row 위젯의 mainAxisAlignment 속성을 사용하여 자식 위젯들의 가로 정렬 방식을 설정할 수 있습니다. 주요 속성 값은 다음과 같습니다.

• start: 자식 위젯들을 Row 위젯의 시작 부분에 정렬합니다.
• end: 자식 위젯들을 Row 위젯의 끝 부분에 정렬합니다.
• center: 자식 위젯들을 Row 위젯의 가운데에 정렬합니다.
• spaceBetween: 자식 위젯들 사이에 동일한 간격을 생성합니다.
• spaceAround: 자식 위젯들을 동일한 간격으로 나누되, 시작과 끝 부분은 절반 간격을 가집니다.
• spaceEvenly: 자식 위젯들을 동일한 간격으로 나눠 전체 공간을 균등하게 배분합니다.

아래의 예제는 MainAxisAlignment를 사용하여 Row 위젯의 자식 위젯들을 가운데 정렬하는 방법을 보여줍니다.

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    Text('첫 번째 위젯'),
    Text('두 번째 위젯'),
    Text('세 번째 위젯'),
  ],
)

CrossAxisAlignment

Row 위젯의 crossAxisAlignment 속성을 사용하여 자식 위젯들의 세로 정렬 방식(즉, 자식 위젯의 높이)을 설정할 수 있습니다. 주요 속성 값은 다음과 같습니다.

• start: 자식 위젯들을 Row 위젯의 시작 부분에 정렬합니다.
• end: 자식 위젯들을 Row 위젯의 끝 부분에 정렬합니다.
• center: 자식 위젯들을 Row 위젯의 가운데에 정렬합니다.
• baseline: 자식 위젯들의 텍스트 기준선을 맞춰 정렬합니다.
• stretch: 자식 위젯들의 세로 공간을 늘려 맞추어 정렬합니다.

아래의 예제는 CrossAxisAlignment를 사용하여 Row 위젯의 자식 위젯들을 세로 중앙에 맞추는 방법을 보여줍니다.

Row(
  crossAxisAlignment: CrossAxisAlignment.center,
  children: [
    Text('첫 번째 위젯'),
    Text('두 번째 위젯'),
    Text('세 번째 위젯'),
  ],
)

Row 위젯에서 자식 위젯의 위치를 설정하는 방법에 대해 알아보았습니다. 위의 속성들을 적절히 조합하여 원하는 배치를 구현할 수 있습니다. 추가적인 자세한 내용은 공식 Flutter 문서를 참고하시기 바랍니다.