[flutter] Row 위젯의 기본 동작 및 특징

Flutter는 Google에서 개발한 모바일 애플리케이션 개발 프레임워크입니다. Flutter는 UI를 구성하기 위한 다양한 위젯을 제공합니다. 이 중 Row 위젯은 가로로 정렬된 자식 위젯들을 포함하는 컨테이너입니다.

Row 위젯의 기본 동작

Row 위젯은 가로로 정렬된 자식 위젯들을 가로로 배치합니다. Row 위젯은 자식 위젯들을 왼쪽에서 오른쪽으로 배치하며, 자식 위젯의 순서는 코드에서 지정한 순서대로 정렬됩니다. 만약 화면에 수평으로 많은 위젯을 배치하고 싶다면, Row 위젯을 사용하여 간편하게 구현할 수 있습니다.

아래 예시 코드를 살펴보겠습니다.

Row(
  children: [
    Text('Hello'),
    Text('World'),
  ],
)

위 코드는 ‘Hello’와 ‘World’ 두 개의 Text 위젯을 가로로 배치한 Row 위젯을 생성합니다.

Row 위젯의 특징

Row 위젯은 자체적으로 크기를 가지지 않습니다. 자식 위젯들의 크기에 따라 Row 위젯의 크기가 결정됩니다. 따라서, 자식 위젯들이 방향을 나타내는 경우 높이를 지정해주어야 합니다.

Row 위젯은 자식 위젯들을 가로로 정렬하지만, 정렬 방식을 변경할 수 있습니다. MainAxisAlignment와 CrossAxisAlignment 속성을 사용하여 가로 정렬과 세로 정렬을 조정할 수 있습니다.

아래 예시 코드는 자식 위젯을 가운데로 정렬하는 Row 위젯을 생성하는 예시입니다.

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    Text('Hello'),
    Text('World'),
  ],
)

결론

Flutter의 Row 위젯은 가로로 정렬된 자식 위젯들을 포함하는 컨테이너입니다. Row 위젯을 사용하여 단순하게 UI를 구성할 수 있으며, 정렬 방식을 쉽게 조정할 수 있습니다. 자식 위젯의 크기에 따라 동적으로 크기가 조절되므로 유연하게 화면을 구성할 수 있습니다.

더 많은 정보를 원하시면 여기를 참조해주세요.