텝바로 만들겠음단, 집 글자 제외! 각 아이콘을 컴포넌트로 변경 밑에 집 글자를 추가 후 오토레이아웃으로 만듬 (Shift + a)그 후에 컴포넌트 생성 글자랑 아이콘 각각 속성 추가함 확인 이제 인스턴스로 5개 깔아줌 이제 각각 아이콘이랑 레이블 변경해줌
🖌️ Design
스위치 두개를 컴포넌트로 설정해보겠습니다. 스위치 이름에 on, off를 붙이고 컴포넌트 세트로 변경 프로토타입에서 설정
Shift + A 오토 레이아웃 설정 단축키 허그는 글자 수에 따라 감싸는 오토 레이아웃의 크기가 결정된다. 예를 들면 버튼이 버튼내부 글자수만큼의 길이로 생성됨채우기는 부모의 가로 폭에 따라 크기가 결정된다. 예를 들면 버튼의 길이가 부모 가로만큼 꽉차게 생성됨만약 부모가 없을 경우엔 채우기 선택지가 안 보인다.
주로 사용하는 색상을 저장채우기 > 아이콘 클릭 > '+' 클릭 > 스타일 만들기 저장한 색상은 디자인에서 확인 가능 글 스타일, 레이아웃 그리드도 이와 같은 방식으로 저장한다.
아이콘을 만들기에 앞서 피그에서 다음과 같은 설정함픽셀 그리드, 픽셀 그리드에 맞추기 아이콘 프레임은 24x24레아이웃 그리드 행, 열 설정 돋보기 생성 > 압축Ctrl + E 픽셀 그리드 맞추기 설정을 풀어서 회전시켜줌 배경의 흰색을 빼고 내보내기 해줌아이콘은 SVG 형식으로 배포해야 함 왜냐하면 코드를 사용하기 때문에 색상이랑 사이즈 조절에 원활하다.
머튜리얼 가이드를 참고해서 생성https://m3.material.io/ Shift + G가이드 숨김 단축키 📱 모바일마진16, 간격12, 개수4유형을 늘리기로 설정할 경우 화면이 커지면 자동으로 커짐 💻 PC
