Flutter에서 Row 위젯은 가로 방향으로 여러 위젯을 배치할 수 있는 강력한 도구입니다. 하지만 때로는 Row 위젯 내의 텍스트를 정렬하는 방법에 대한 의문이 생길 수 있습니다. 이 글에서는 Row 위젯에서 텍스트를 정렬하는 몇 가지 방법에 대해 알아보겠습니다.

mainAxisAlignment 속성 사용하기

Row 위젯의 mainAxisAlignment 속성을 사용하면 가로 방향으로 위젯을 정렬할 수 있습니다. 이 속성은 MainAxisAlignment 열거형 값을 사용하며, 다음과 같은 옵션을 제공합니다.

• MainAxisAlignment.start: 위젯을 시작 부분에 배치합니다.
• MainAxisAlignment.end: 위젯을 끝 부분에 배치합니다.
• MainAxisAlignment.center: 위젯을 가운데에 배치합니다.
• MainAxisAlignment.spaceBetween: 첫 번째와 마지막 위젯은 시작과 끝 부분에 배치하고 나머지 위젯은 균등하게 배치합니다.
• MainAxisAlignment.spaceEvenly: 모든 위젯을 균등하게 배치합니다.
• MainAxisAlignment.spaceAround: 위젯을 시작과 끝 부분을 포함한 여백을 고려하여 균등하게 배치합니다.

Row(
  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
  children: [
    Text('첫 번째 텍스트'),
    Text('두 번째 텍스트'),
    Text('세 번째 텍스트'),
  ],
)

위의 예제에서는 Row 위젯 내의 세 개의 텍스트를 균등하게 공간을 배치하여 정렬합니다.

crossAxisAlignment 속성 사용하기

Row 위젯의 crossAxisAlignment 속성을 사용하면 세로 방향으로 텍스트를 정렬할 수 있습니다. 이 속성은 CrossAxisAlignment 열거형 값을 사용하며, 다음과 같은 옵션을 제공합니다.

• CrossAxisAlignment.start: 텍스트를 시작 부분에 배치합니다.
• CrossAxisAlignment.end: 텍스트를 끝 부분에 배치합니다.
• CrossAxisAlignment.center: 텍스트를 가운데에 배치합니다.
• CrossAxisAlignment.stretch: 텍스트를 전체 너비에 맞게 늘립니다.

Row(
  crossAxisAlignment: CrossAxisAlignment.center,
  children: [
    Text('첫 번째 텍스트'),
    Text('두 번째 텍스트'),
    Text('세 번째 텍스트'),
  ],
)

위의 예제에서는 Row 위젯 내의 세 개의 텍스트를 가운데 정렬합니다.

mainAxisSize 속성 사용하기

Row 위젯의 mainAxisSize 속성은 위젯이 차지하는 공간의 크기를 설정할 수 있습니다. 이 속성은 MainAxisSize 열거형 값을 사용하며, 다음과 같은 옵션을 제공합니다.

• MainAxisSize.min: Row의 크기를 최소화합니다.
• MainAxisSize.max: Row의 크기를 최대화합니다.

Row(
  mainAxisSize: MainAxisSize.min,
  children: [
    Text('첫 번째 텍스트'),
    Text('두 번째 텍스트'),
    Text('세 번째 텍스트'),
  ],
)

위의 예제에서는 Row 위젯의 크기를 최소화하여 텍스트를 가장 작은 크기로 배치합니다.

정리

Flutter의 Row 위젯에서 텍스트의 정렬을 설정하기 위해서는 mainAxisAlignment, crossAxisAlignment, mainAxisSize 속성을 사용할 수 있습니다. 원하는 방향으로 위젯을 배치하고 정렬하는 속성을 조절하여 UI를 원하는 대로 설정할 수 있습니다.

더 자세한 내용은 공식 문서를 참고하시기 바랍니다.