본문 바로가기

Flutter53

Stack 위젯 Stack 위젯은 Flutter에서 여러 자식 위젯을 겹치게 배치할 수 있게 해주는 컨테이너 위젯입니다 Stack 내의 모든 자식은 오버레이 구조로 배열되어, 리스트의 앞쪽에 있는 위젯이 아래쪽에 위치하게 됩니다. Stack 위젯은 주로 위젯들 간의 위치를 상대적으로 정의할 때 사용됩니다. 주요 개념 확인 Overlay Structure Stack은 오버레이 구조를 갖습니다. 이는 Stack 내의 첫 번째 자식이 맨 아래에 배치되고, 두 번째 자식이 첫 번째 위에, 세 번째 자식이 두 번째 위에 배치된다는 것을 의미합니다. Alignment Stack은 자식 위젯들을 정렬하기 위해 alignment 속성을 사용합니다. 이 속성은 Stack의 모든 자식들이 배치될 위치를 결정합니다. 예를 들어, Align.. 2023. 9. 25.
Constraint(제약 조건) https://docs.flutter.dev/ui/layout/constraints Understanding constraints Flutter's model for widget constraints, sizing, positioning, and how they interact. docs.flutter.dev 제약조건은 아래로 향하고, 크기는 위로 올라갑니다. 부모는 위치를 지정합니다. 위젯은 부모로 부터 자신의 제약 조건을 받습니다. 제약 조건에 구성은 최소 너비, 최대 너비, 최소 높이, 최대높이 4개의 더블 타입 값으로 구성이 됩니다. 그 다음으로는 위젯은 자신의 자식 목록을 순회합니다.위젯은 자식들에게 각각의 제약 조건을 알려주고, 각 자식에게 얼마에 크기가 되고 싶은지 물어봅니다. 그 후 위젯은.. 2023. 9. 25.
책 예제 StatelessWidget 사용(정적) 체크박스를 클릭해도 아무 변화가 없다 StatefulWidget(동적) StatelessWidget 부분을 StatefulWidget로 바꿔주니 단축키 : StatelessWidge 클릭 후 alt + enter 뜨는거 클릭 클릭시 이런 화면이 출력되었다 2023. 9. 22.
Expanded 위젯 (비율로 배치) Expanded 위젯은 Flexible 위젯의 특별한 형태로, 주 축(main axis)의 사용 가능한 남은 공간을 모두 차지합니다. 즉, Expanded 위젯은 주 축 방향으로 가능한 한 많은 공간을 차지하려고 합니다. Expanded 위젯은 flex 속성이 1인 Flexible 위젯과 같습니다. Expanded 위젯은 주로 Row, Column, 또는 Flex와 함께 사용되며, 여러 개의 Expanded 위젯이 동일한 Row나 Column에 있을 경우 사용 가능한 공간을 동등하게 나눠 가집니다. ※ Flexible 위젯 공간에서 작아질 수 있지만 Expanded 확장만 가능하다. 도전 과제 성공한 화면 2023. 9. 22.

티스토리툴바