본문 바로가기

웹언어/Adobe XD

[Adobe XD] 15강 그룹에 고정된 패딩설정

728x90
반응형

 

 

 

 

 

 

 

 

 

 

 

 

 

 

1. 그룹에 텍스트 고정패딩설정

- [홈]화면에서 사용자 정의 크기로 300x300짜리 아트보드 생성 

 

 

 

 

 

 

 

- [사각형툴]로 사각형을 드래그

- 크기를 w: 150, h: 60으로 설정

- 모서리를 10으로 둥글게 처리

 

 

 

 

 

- 테두리 : 체크해제

- 채우기색을 변경

 

 

 

 

 

- 텍스트툴로 텍스트를 작성

- 글자 크기를 30으로 변경

- 글자색도 흰색으로 변경

 

 

 

 

 

 

- 사각형과 글자를 모두 선택하여 그룹으로 설정([ctrl]+[g]

- 그러고 나면 옵션패널에 패딩이 설정이 생성된다.

- 패딩의 옵션을 on처리

 

 

 

 

 

 

 

- 패딩설정이 완료

 

 

 : 패딩을 균등하게 설정

 : 패딩의 4방면을 각각 설정

 

 

 

 

 

- [Alt]+ 드래그를 눌러 텍스트상자를 한개 더 복제

 

 

 

 

 

 

- 아래 텍스트상자를 더블클릭 눌러 글자를 변경하면 그게 맞게 상자크기가 변경

 

 

 

 

 

 

- 크기가 자동으로 변경되는 것이 확인

 

 

 

 

 

 

 

 

 

 

2. 그룹에 이미지 고정패딩설정 

- [홈]화면에서 사용자 정의 크기로 300x300짜리 아트보드 생성 

 

​- 사각형 도형을 그린다.

- w: 200, h: 200, 아트보드 가운데 정렬

- 모서리둥글기 : 20

- 테두리 크기 : 2

 

 

 

 

 

 

 

​- 사각형도형을 복제([ctrl]+[d])

- w: 150, h: 150, 아트보드 가운데 정렬

- 테두리: 체크해제, 채우기: 임의의 색으로 변경

 

 

 

 

 

 

 

 

​사진을 도형으로 드래그하여 마스크 처리

​- 두개의 오브젝트를 모두 선택 후 그룹 설정([ctrl]+[d])

 

 

 

 

 

 

 

​- 옵션패널에서 [패딩]을 활성화

- 4방면 모두 25로 자동으로 처리

 

​- 이미지를 마스크시킨 사각형만 줄이면 그룹으로 묶인 사각형이 자동으로 크기 조절

- 패딩을 무조건 25로 처리되게 한다.

 

 

 

 

 

728x90
반응형