[이론] Row and Column (2) MainAxisAlignment

들어가기 앞서...

저번 게시글에는 SafeArea 를 사용했고 이번에는 Ios 시뮬레이터를 통해 MainAxisAlignment 를 사용해보겠다

우리가 저번에는 center 만 사용해봤는데, 전부 다 사용해볼것이다.

---

본문으로...

왼) start, 오) end

왼) center, 오) spaceBetween

 

왼) spaceEvenly, 오) spaceAround

MainAxixAlignment 주축 정렬이다.

MainAxixAlignment.start -> 기본 default 이다. 처음부터 시작한다. 

MainAxixAlignment.end -> 끝에서 시작한다.

MainAxixAlignment.center -> 가운데부터 시작한다.

MainAxixAlignment.spaceBetween -> 위젯과 위젯의 사이가 동일하게 배치된다.

MainAxixAlignment.spaceEvenly -> 위젯을 같은 간격으로 배치하지만 끝과 끝에도 위젯이 아닌 빈 간격으로 시작한다.

MainAxixAlignment.spaceAround ->  spaceEvenly + 끝과 끝의 간격은 1/2.

---

Row 위젯을 사용해보자!

Column 위젯을 Row 위젯으로 바꿔적용해보겠다.

---

기존 코드 Column 에서 Row 위젯으로 변경해준다.

Row() 로 변경한 코드

왼) start, 오) end

왼) center, 오) spaceBetween

왼) spaceEvenly, 오) spaceAround 

---

끝으로...

MainAxisAlignment 의 내장되어있는 메소드들을 전부 다 사용해 보았고 그 차이점을 알수 있었다.

Column 과 Row 둘다 사용해보았다.