Container, SizedBox, Stack, Column, Row의 특징

 

Container

크기 지정이 없을 경우 차지할 수 있는 최대의 범위를 가져간다. 

 

 

---

SizedBox

크기르 지정하지 않을 경우 Child를 나타낼 수 있는 최소한의 layout을 가져간다. 

 

 

 

---

Stack

자식들중 가장큰 크기에 맞춘다. 

여러 자식들의 Alignment를 다 다르게 주고 싶어서 Align으로 감싼뒤 alignment property에 원하는  Alignment(x, y)를 넣어 보았는데 x축으로는 적용이 되는데 y축으로는 alignment가 적용이 되지 않는다. 

Stack에 api doc를 보았더니 아래와 같은 내용이 있다.

 

https://api.flutter.dev/flutter/widgets/Stack-class.html

Stack class - widgets library - Dart API

그럼 Stack안에서 LayoutBuilder를 이용해서 contraint로 size를 받아서 그 값을 기반으로 relative positiond을 계산한뒤 children을 배치하는 class를 만들어야 하거나, 위의 api doc에서 말한거처럼 CumstomMultiChildLayout을 사용해야 할 것같다. 

 

구글링으로 찾아보니 나와 같은 문제를 발견한 사람이 있지만 유익한 답변은 아직없다. 

https://stackoverflow.com/questions/61984635/alignment-on-y-axis-doesnt-respond-flutter

Alignment on y-axis doesn't respond flutter

 

그러다 찾은게 align_positioned 라는 위젯 패키지인데, 만드사람 말로는 stack에서도 다 된다고 한다. 

https://pub.dev/packages/align_positioned

align_positioned | Flutter Package

적용해봐야겠다. 

 

---

Column

 

 

 

---

Row

 

 

 

 

 

 

---