Figma manual

피그마 - 테이블 - 오토레이아웃으로 만들기

lshjju 2026. 7. 5. 11:43

피그마 테이블 만들기


오토레이아웃으로  테이블을 만들어 보겠습니다.


완성



 

 

https://www.figma.com/design/ThY5keItPj1OSATETXixuh/%ED%85%8C%EC%9D%B4%EB%B8%94-%EB%A7%8C%EB%93%A4%EA%B8%B0-%EC%8B%A4%EC%8A%B5---%EC%98%A4%ED%86%A0%EB%A0%88%EC%9D%B4%EC%95%84%EC%9B%83%EC%9C%BC%EB%A1%9C-%EB%A7%8C%EB%93%A4%EA%B8%B0?t=elbzI4QJ7JGs9E7T-1

 




 

대충 프레임 하나 그립니다.


 

대충 데이터 2개 만듭니다.


 

데이터를 오토레이아웃으로 만듭니다.

 

데이터 오토레잉아웃 만들기 방법 1

프레임 만듭니다.

프레임 안에 데이터 두개 넣습니다.

프레임을 오토레이아웃로 변경 합니다.

 

데이터 오토레잉아웃 만들기 방법 2

데이터 셀렉 합니다.

shift + A


 

 

심심하니까 데이터 하나 더 추가 합니다.

심심하니까 백그랑운드도 세팅 합니다.

위와 같은 옵션 세팅 합니다.

오토레이아웃 

리사이징 - 허그

패딩 - 세로 10


 

텍스트 데이터 셀렉 합니다.

옵션 세팅 합니다.

layout 

resizing

width - fill container


 

프레임 카피하고 페이스트 합니다.


 

 

stroke 하단 우측 옵션에서 custom을 셀렉하고 아래에만 스트로크를 적용 합니다.

페이스트한 프레임에 위 옵션 세팅 합니다.


 

아마 이렇게 될겁니다.


 

페이스트해서 데이터를 아래 방향으로 추가 합니다.


 

데이터를 변경 합니다.



완성