오토 레이아웃

오토 레이아웃 '하나씩 구조화' 의미

피그마 오픈카톡방2026. 3. 7.

질문사항

오토 레이아웃에서 '하나씩 구조화'한다는 것은 어떤 의미인가요? 페이지의 모든 요소를 한 번에 오토 레이아웃으로 묶는 것이 아니라, 각 요소를 개별적으로 묶어야 한다는 뜻인가요?

네, 맞습니다. '하나씩 구조화'한다는 것은 전체 페이지의 모든 요소를 한 번에 오토 레이아웃으로 묶는 것이 아니라, 가장 작은 단위의 관련 요소들부터 점진적으로 묶어 나가는 것을 의미합니다.

오토 레이아웃은 '레고 조립'처럼 가장 작은 단위부터 묶어 나가는 것이 핵심입니다.

예시 (헤더 구조화):

`[메뉴1] [메뉴2] [메뉴3] [메뉴4]`와 같이 관련 있는 메뉴들을 먼저 선택하여 가로 방향 오토 레이아웃으로 묶습니다. (예: `Menu Group` 프레임)

`[로고]`와 위에서 만든 `[Menu Group]` 프레임을 다시 선택하여 가로 방향 오토 레이아웃으로 묶습니다. (예: `Left Section` 프레임)

마지막으로 `[Left Section]` 프레임과 `[버튼]`을 선택하여 가로 방향 오토 레이아웃으로 묶어 최종 `Header` 프레임을 완성합니다.

이러한 방식으로 계층적으로 오토 레이아웃을 적용하면, 각 요소의 위치와 간격이 예상치 않게 변경되는 것을 방지하고, 유연하고 관리하기 쉬운 디자인을 만들 수 있습니다.