18- 정렬

위젯을 정확한 위치에 배치하기 위한 align 속성의 역할은?

위젯을 원하는 위치로 정렬하기 위해 align 속성을 사용해요.

이 속성은 부모 컨테이너 안에 있는 위젯을 원하는 위치로 이동시키는 역할을 합니다.

CSS의 absolute positioning과 비슷한 역할을 한다고 할 수 있어요.

부모 컨테이너는 전체 너비와 높이를 차지하고, 그 안에는 100 x 100 크기의 컨테이너가 있으며, 정렬 속성은 upper left로 설정되어 있어요.

이렇게 설정된 속성을 조정하면 위젯을 그리드 안에서 원하는 위치로 이동시킬 수 있고, 조정된 값들은 실시간으로 변합니다.

또한, 이 값들을 수동으로 편집하여 더 정밀한 제어가 가능해요.

2D 그리드를 사용하여 레이아웃 위치 지정, align 속성이란?

2D 그리드를 사용하여 레이아웃의 위치를 지정하며, 중앙은 0, 오른쪽은 1, 위쪽은 -1, 아래쪽은 1을 기준으로 해요.

align은 부모 요소를 기준으로 자식 요소의 위치를 조정하는 데 주로 사용되며, 선택된 아이콘의 위치를 지정하는 예제가 있어요.

프라이머리 레이아웃에는 컬럼이나 로우 같은 메인 레이아웃 위젯이 주로 사용되며, align은 보조적인 레이아웃 속성에 적합합니다.

Align 위젯은 주로 어떤 상황에서 사용되나요?

Column을 주로 사용하고, Align 위젯을 사용하여 정렬을 조절해요.

Widget 자체에 align을 사용하는 것이 좋고, 부모에게 align을 주는 것은 피하는 것이 좋아요.

Align 위젯은 주로 Stack 위젯이나 Container와 함께 사용돼요.

여러 위젯을 중첩하는 경우 Stack 위젯을 사용하고, 일반적으로 위젯 위쪽에 요소를 배치하게 돼요.