(iOS) UILabel 코드로 생성 및 기본 설정

 

1. UILabel 코드로 생성하기.

let label = UILabel(frame: CGRect(x: 0, y: 0, width: 80, height: 40)) self.view.addSubview(label)

2. UILabel 정렬하기.

label.textAlignment = .left // 좌측 정렬.
label.textAlignment = .center // 중앙 정렬. 
label.textAlignment = .right // 우측 정렬. 
label.textAlignment = .justified // 행맞추기 (Justification) 
label.textAlignment = .natural // 지역화 기준으로 정렬. (Alignment associated with the current localization)

• .justified 는 언뜻보기로 .left 와 차이가 없게 느껴지나, linebreak 설정에 의해 행이 바뀔 때 들쭉날쭉해지는 문단의 마지막 부분을 뷰 넓이에 맞춰서 글자간격을 조정하는 것을 확인할 수 있습니다. (Justified = 〔인쇄〕 〈활자의 행의〉 길이를 맞추다.) 
• .natural 도 .left 와 비슷하게 느껴지나, 지역화가 아랍어인 경우 자동으로 .right 정렬 되도록 합니다. (iOS 6.0+) 

BaseLine

20pt 폰트, 10pt 폰트 서로 다른 폰트 크기의 UILabel 들을 정렬할 때, 기준이 모호해집니다. 
그렇다고 뷰 기준으로 중앙정렬을 할 경우 폰트의 크기에 의해 뷰의 높이가 서로 다르므로 큰 글자는 행을 가득 채우고 작은 글자는 중앙에 작게 위치하게 됩니다. 
결국 UILabel 들은 세로 가운데 정렬은 되었지만 출력되는 글자들은 위/아래로 들쭉날쭉하게 보이게 됩니다. 
이때 사용되는 기준입니다. (BaseLine 정렬의 경우 AutoLayout 포스팅을 할 때 더 자세히 다루도록 하겠습니다.)

label.baselineAdjustment = .alignCenters // 글자가 View Bound 세로 기준으로 중앙 정렬됨. 
label.baselineAdjustment = .alignBaselines. // 글자의 아래부분(Baseline)이 정해진 위치 기준으로 정렬됨. (Autolayout 포스팅할 때 더 설명하도록 하겠습니다.) 
label.baselineAdjustment = .none // 글자가 View Bound 세로 기준으로 좌상단 정렬됨. (기본값)

• Baseline 의 경우 Dynamic Type 이나 Localization 을 지원하지 않는 경우 그 필요성을 느끼지 못할 수도 있습니다.
• 앱이 고도화되어 다양한 폰트와 언어를 지원할 때는 상당히 중요해지는 부분이라고 생각됩니다.
• 이 속성은 numberOfLines 값이 1인 경우에만 유효합니다.

3. 기타 옵션들

numberOfLines

Label 에서 출력가능한 line 수를 정합니다. 0 은 제한이 없음을 표시합니다. AttributedString 의 경우도 마찬가지로 적용이됩니다. 

adjustsFontSizeToFitWidth

YES 로 설정한 경우, Label 의 bound 영역이 줄어들면 텍스트도 minimumScaleFactor 에 맞춰서 줄어듭니다. 

allowsDefaultTighteningForTruncation

YES 로 설정한 경우, truncation 텍스트 자르기 가 발생하기 전에 최대한 글자 간격을 좁힙니다. font, 라인의 넓이, line break mode 등 정보에 기인하여 적정한 간격이 선정됩니다. 

shadowColor, ShadowOffset

그림자 속성을 넣습니다. 

isHighlighted, highlightedTextColor

하이라이트 된 경우와 그렇지 않은 경우에 대한 컬러 속성을 정할 수 있습니다.

출처: https://goodyoda.tistory.com/392 [GoodYoda's Story]

출처: https://goodyoda.tistory.com/392 [GoodYoda's Story]

출처: https://goodyoda.tistory.com/392 [GoodYoda's Story]