[피그마] 피그마에서 선택 반응형하려면

Frame(프레임)안 텍스트 반응형!

반응형할 부분을 선택

[부모,자식요소] 각각 오토레이아웃 (shift+A)을 해서 글자와 배경을 합쳐준다.

 

1. 오토레이아웃 그룹속 메뉴 각각(자식) 을 선택한다.

 

 

W사이즈 옆에 ▽ 아래 화실표를 클릭

 

Fill container 을 클릭해서 반응형 될때마다 자연스럽게 늘어났다 줄었다 되게 만든다.

참고> Fill container  이 안보일때

1. 부모 프레임 선택
2. Shift + A → Auto Layout 적용
3. 다시 자식 레이어 선택

그러면 메뉴에
👉 Fill container 가 나타납니다.

 

2. 전체 그룹(부모)도 fill container

 

3. 글로벌 메뉴도 각각(자식)  Fil Container

4. 글로벌 메뉴 전체(부모) 도 Fil Container

결과 : 이렇게 줄어들게 된다.

---

---

이미지속 텍스트 반응형 (이미지 따라다니기)

 

오토레이아웃(shift+A) 걸어둔, 텍스트 사용!

1. 텍스트 선택후 속성창 Constraints 설정해주면 된다.

좌측(left)고정, Bottom(아래) 따라 내려옴.

결과 : 이미지 크기가 변해도 텍스트가 따라다님.

 

---

---

이미지속 텍스트 반응형 ( 텍스트도 같이 줄었다 늘었다. ) 

1. 오토레이아웃된 텍스트선택

 

2. Constraints 속성창 Left+Right 선택

 

3. 텍스트선택창 늘려주기

 

4. 완성

---

---

결론 : 반응형으로 만들려면

오토레이아웃 후,

with 가로값 혹은 세로값 화살표를 클릭해  Fill container 로 만들어 늘어났다 줄어들었다 하거나,

constraints 위치를 정하여 따라오게 하면된다.