Figma에서 Autolayout으로 버튼 만들기

Figma 목록

 

사각형과 Text를 이용해서 위와같은 버튼을 만듭니다.

 

 

 

 

 

사각형과 Text를 선택하고 Add auto layout 합니다.

 

 

 

 

 

Frame1이 #모양에서 위와같은 아이콘으로 변경됩니다.

 

 

 

 

적당히 이름을 변경해 줍니다.

 

 

 

 

Text를 수정하면 자동으로 사각형 사이즈가 변경됩니다.

 

 

 

 

Auto layout 패널에

좌측부터 세로 정렬

가로정렬

텍스트앞에 아이콘이 있다면 간격 조정

마지막에는 padding값을 직접 수정할 수 있습니다.

 

 

Mixed에 값을 입력하면 같은 값으로 padding이 변경됩니다.

 

 

Figma 목록