728x90 반응형 > figma/메모4 [피그마] Auto Layout 기본 개념 총정리! 오토레이아웃 예시 네이밍 지정 하나의 부모 세개의 자식 부모를 선택하고 오토레이아웃 실행. 부모의 크기와 자식들의 정렬을 자동으로 세팅해준다. 그리고 레이아웃에 대한 디테일한 설정을 할 수 있는 것 = 우측 오토레이아웃 인터페이스 창. 그래프 더블클릭 했을 경우 - 자식으로 있는 모든 요소들이 일정한 간격으로 정해진 컨테이너 영역을 꽉 채워주는 모드 2024. 2. 10. 반응형 디자인을 Figma로 구현할 때 가장 기초되는 개념인 Constraints을 알아보자! 컨스트레인츠 엘리먼트를 점선을 통해서 벽에 결속시키는 것. 핀이 꽂혀있다고 상상. 중앙쪽 과녁 꽂기 세로는 Top 에 고정 가로 부분은 화면의 센터를 유지. 센터 - 센터 지정 스크린 움직여보면 이런식으로 스크린이 항상 화면 중앙에 오는거 확인 가능. 이렇게 설정했을경우 사각형이 컨스트레인을 유지하기 위해 자신의 형태를 변형 다 고정을 했을 경우 부모와 자식관계로 설정이 돼있어야 컨스트레인으로 설정할 수 있음. 자식이 되는 엘리먼트를 선택해야 우측에 컨스트레인 이라는 인터페이스가 뜸 오토레이아웃을 하는 순간 뒤바뀌게 됨. 프레임을 선택한 다음 오토레이아웃을 추가하게 돼주면 오토레이아웃이 진행됨. 자식인 사각형을 선택해보면 컨스트레인 옵션창이 사라져있음 . 사실상 이 부분이 컨스트레인 역할을 해 준다고 보.. 2024. 2. 10. 오토 레이아웃! 가장 쉽게 개념부터 완전 정복 Part.1 피그마 초보자가 가장 햇갈리는 기능. 오토 레이아웃! 가장 쉽게 개념부터 완전 정복 Part.1 #Fixed #Hug #Fill #autolayout #Figma (youtube.com) 피그마 초보자가 가장 햇갈리는 기능. 오토 레이아웃! 가장 쉽게 개념부터 완전 정복 Part.1 부모 자식 관계 이런 식의 종속 관계 그 관계를 구체적으로 설정해 줌 보라색 부분 의미 알아보기 안쪽에 배치돼있는 엘리먼트 - Content 자식을 감싸는 부모와 같은 존재 - Container 동사는 파란색 목적어는 보라색 이런식의 구조 Hug 목적어 자리에 있는 컨텐츠를 감싸는 것 주어자리에 들어가야하는 것 의미 해석 2중 프레임 이름 설정 * 주의점 : 콘텐츠라는 자식은 콘테이너 안에 종속돼있어야 함 부모가 될 파란 엘.. 2024. 2. 10. 피그마 누끼 따는 방법 보호되어 있는 글 입니다. 2024. 2. 8. 이전 1 다음 728x90 반응형
