[Flutter / 플러터] 레이아웃 정렬하기 (CrossAxisAlignment)

1. Aligning Widget

  - 플러터 레이아웃을 짜는데 가장 흔하게 사용되는 Api 중 하나이다.

  - 오늘은 그중 CrossAxisAlignment 를 먼저 알아보도록 하겠다.

  - CrossAxisAlignment 의 Enum(종류)

Enum(상수값)	Row(행)	Column(열)
center	가로축 기준 중앙정렬	세로축 기준 중앙정렬
end	가로축 기준 하단정렬	세로축 기준 우측정렬
start	가로축 기준 상단정렬	세로축 기준 좌측정렬
stretch	child widget의 height을 꽉채운다	child widget의 width를 꽉채운다

Row(행) 사용시, 주 축(mainAxis)는 수평이며, 횡 축(crossAxis)는 세로이다.

2. Row 세로 정렬 방법

  - CrossAxisAlignment.start

가로축 기준 상단 정렬

  - CrossAxisAlignment.center

가로축 기준 중앙 정렬

  - CrossAxisAlignment.end

가로축 기준 하단 정렬

  - CrossAxisAlignment.strech

child widget의 height을 꽉채운다

3. Column 가로 정렬 방법

  - CrossAxisAlignment.start

세로축 기준 좌측 정렬

  - CrossAxisAlignment.center

세로축 기준 중앙 정렬

  - CrossAxisAlignment.end

세로축 기준 우측 정렬

  - CrossAxisAlignment.strech

child widget의 width를 꽉채운다