auto layout 뎁스를 많이 넣는 이유?
3
投稿した質問数 4
안녕하세요! 조금 예전 강의라 답이 달릴지는 모르겠지만 질문 남겨봅니다..
헤더 작업할 때 각 메뉴에 오토 레이아웃을 여러번 중첩하는 이유가 있을까요?
제가 이제껏 해오던 방식은 (실무 X)

이런식으로 text와 박스를 한번만 묶고 패딩을 줬을거같은데

이렇게까지 여러번 묶어서 뎁스가 들어가는 이유가 무엇인지 궁금합니다. 그리고 이런 경우에는 코딩할 때에도 div를 감싸 각 박스에서 여백을 잡아주기를 개발자에게 바란다고 보면 될까요?
그리고 피그마가 최근 많이 업데이트가 되었는데 혹시 강의도 추가 강의나 업데이트 예정이 있으신지..궁금합니다! (GSAP 다음 강의도 기다리고 있어요... 무료로 풀려서 다양하게 배워보고 싶습니다)
回答 1
0
안녕하세요, 인프런 AI 인턴입니다. migyeong kim님 질문과 관련해, 오토 레이아웃을 여러 단계로 중첩하는 이유와 실제 코드 구조에 대해 설명한 기존 답변을 추천드립니다.
핵심 내용
오토 레이아웃을 여러 번 중첩하는 것이 항상 필수인 것은 아닙니다. 다만 다음과 같은 이유로 추가적인 뎁스를 구성할 수 있습니다.
- 추후 아이콘, 뱃지, 토글, 팝업 등 다른 요소가 추가될 가능성에 대비
- 특정 요소끼리 간격과 정렬을 유지하기 위해 그룹화
- 컴포넌트의 확장성과 유지보수성 향상
- 피그마의 그룹 구조를 실제 HTML 구조와 대응시키기 위해
- 팀 내 디자이너와 개발자가 합의한 컴포넌트 구조를 표현하기 위해
따라서 중첩된 각 오토 레이아웃이 반드시 하나의 div로 변환되어야 한다는 의미는 아닙니다. 다만 개발자가 피그마의 계층 구조를 참고하여 실제 마크업에서 별도의 래퍼 요소가 필요한지 판단할 수 있습니다. 디자인 단계에서 무조건 뎁스를 많이 넣기보다는, 요소의 역할과 확장 가능성을 기준으로 팀의 컨벤션에 맞추는 것이 좋습니다.
관련된 기존 답변은 아래와 같습니다.
오토 레이아웃 한번 더 하는 이유
버튼 내부 요소를 한 번 더 감싸는 이유를 실제 HTML 구조와 함께 설명한 답변입니다. 오토 레이아웃을 추가하면 향후 아이콘이나 다른 콘텐츠가 들어올 때 간격과 구조를 유지하기 쉬워지는 사례를 확인할 수 있습니다.
참고 이미지:헤더 오토레이아웃 관련 질문드립니다.
헤더의 메뉴 텍스트를 단독으로 사용하거나 오토 레이아웃으로 한 번 더 감싸는 기준에 대한 답변입니다. 확장성과 유지보수를 고려하면 텍스트도 하나의 독립된 대상으로 사용하기보다 오토 레이아웃으로 묶어두는 방식이 효율적일 수 있지만, 확장 가능성이 없다면 단순한 구조도 사용할 수 있다고 설명합니다.
강의 업데이트 및 GSAP 관련 내용은 위 기존 답변에 포함되어 있지 않아 정확히 안내드리기 어렵습니다. 강의 공지사항이나 지식공유자님의 최신 답변을 함께 확인해 보시는 것을 권장드립니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
토큰 추출을 베리어블+AI 활용 vs 토큰 스튜디오 차이
0
35
2
borderTransparent를 라이트/다크모드에 이중등록
0
67
2
해결되었습니다.
0
68
1
안녕하세요! 강의잘 들었습니다.
0
140
2
타이포그래피 16 -> 14 변경 시 XXXL만 변경 안 됨
0
90
2
토큰스튜디오에서 폰트 스타일등록 문의
0
108
2
토큰에서 style로 export시 에러
0
109
2
컬러시스템 등록 관련
0
111
2
토큰 light/dark mode 오류
0
97
2
Pretendard 없으면 에러납니다
0
371
2
폰트 토큰 작업 할때
1
138
3
여기 수업에서 엘로우나 레드나 블루 이런 컬러들을 다양하게 만드는 이유가 뭔가요?
0
92
2
토큰을 깃허브에 올리는 방법이 없어진거 같은데요
1
120
2
토큰 export 할때 어떻게 해야 하나요? 버전이 바뀌어서 그런지 못찾겠어요
0
309
2
인프런 할때마다 짜증나는데 수업내용이 너무 오래된건 제발 삭제좀 하던지 다시 찍던지 해주세요
1
104
1
tailwind color generator 이게 작동이 잘 안되네요
0
120
2
figma tokens플러그인 안나오는데요??
0
173
2
혹시 토큰 가공할 수 있는 강의도 따로 있을까요??
1
89
2
피그마 배리어블에 export시 값 저장 안됨
0
265
3
Style - variable 문으ㅣ ㅜㅜ
0
98
2
borderTransparent 임포트가 안됩니다
1
96
2
화면이 보이지가 않아요?
0
94
1
컬러맵핑하고 라이트/다크 모드 설정시 색상 반전이 안돼요 ㅠㅠ
1
316
2
피그마 토큰 플러그인
1
329
2

