일모도원(日暮途遠) 개발자

[iOS UI] 라벨의 줄수가 많아지면 뷰도 길어지게 하기 본문

iOS개발/UI관련

[iOS UI] 라벨의 줄수가 많아지면 뷰도 길어지게 하기

달님개발자 2023. 3. 6. 10:08

UI화면을 동적으로 만드는건 여전히 어렵다.

 

OpenSubtitle에 로그인하는 뷰를 만들고 있는데, 계정이 없으면 계정을 만들라고 안내하는 라벨을 맨위에 두었다.

문제는 이 라벨이 영어, 한국어에 따라서 줄수가 바뀌는데, 로그인 뷰의 전체 크기는 고정되어 있어서 보기에 안좋다.

 

XIB에서의 화면이다. 영문 아래위로 공간이 좀 남는게 보인다.

 

기기에서 본 화면이다. 라벨의 아래위로 공백이 좀 보인다.


내가한 수정 방법은 아래와 같다.

라벨을 선택후 Add New Constraints를 선택후 높이(Height)를 선택한후 "Add 1 Constraint"를 누른다.

 

 

"Show the Size Inspector"로 가서 추가한 높이의 Edit를 누른다.

20보다 크거나 같다라고 Constraint를 줬다. 

이는 최소 높이가 20이고 라벨의 내용에 따라서 높이가 더 증가 할수 있다는 뜻이다.

저렇게 바꾸고 나면, 라벨의 높이가 ">="로 된것이 보인다.

뷰도 똑 같이 높이가 특정 값보다 같거나 크다. 라고 바꾸어주어야 한다. 그렇지 않으면 뷰의 크기는 여전히 고정적이다.

 

현재 뷰의 높이는 고정적이다. 

높이 제약을 선택후 제약을 보면 constant가 300으로 고정(equal)된것이 보인다.

그냥 Constaint만 200으로 바꾸면, 뷰의 높이는 1줄 라벨에 맞게 바뀌는데 제약들이 깨진것이 빨갛게 보인다.

Relation을 열고 Greater Than or Equal로 바꾸어 보자.

빨간 선들이 사라진것이 보인다.


디바이스에서 보면 이제 좀 보기가 좋다.

 

'iOS개발 > UI관련' 카테고리의 다른 글

[iOS UI] 글자에 그림자 주기  (0) 2022.11.27