✅ Stack 위젯
Stack 위젯은 자식 위젯들을 서로 겹쳐서 배치할 때 사용됩니다. 예를 들어, 이미지 위에 텍스트를 올리거나, 여러 위젯을 겹쳐 표현해야 할 때 활용됩니다.
📌 주요 속성
🔹alignment : 자식 위젯들의 기본 정렬 위치를 결정합니다. (기본값: AlignmentDirectional.topStart)
🔹clipBehavior : Stack 영역을 벗어난 위젯을 자를지 설정합니다.
🔹fit : Stack의 크기를 어떻게 맞출지 결정 (StackFit.loose, StackFit.expand, StackFit.passthrough)
🔹textDirection : AlignmentDirectional과 함께 사용할 텍스트 방향 (ltr, rtl)
✅ Positioned 위젯
Stack 내부의 자식 요소 위치를 지정하려면 Positioned 위젯을 사용합니다.
🔹left, right, top, bottom 속성을 활용하여 위치 지정 가능
🔹width, height 속성을 지정하여 크기 설정 가능
🎭 Stack vs (Column / Row) 비교
| 비교 항목 | Stack | Column / Row |
|---|---|---|
| 레이아웃 방식 | 위젯들을 겹쳐 배치 | 위젯들을 나란히 배치 |
| 위치 지정 | Positioned 사용 | MainAxisAlignment, CrossAxisAlignment 사용 |
| 주요 용도 | 겹치는 UI, 배경 이미지 위에 요소 추가 | 리스트형 레이아웃, 기본적인 정렬 |
🎯 N줄 요약
🔹Stack은 여러 위젯을 겹쳐서 배치할 때 사용
🔹기본 정렬은 alignment 속성을 활용
🔹개별 위치 지정은 Positioned 위젯을 활용
🔹배경 위에 텍스트/버튼을 올리는 등 다양한 UI에 활용 가능
