iOS - UILabel 크기를 텍스트에 맞추기

Posted on | In

iOS의 UILabel의 크기를 text에 알맞게 조정하는 방법에 대해 공유합니다.

문제점

1
2
3
4
5
6
7
8
9
10
import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var testLabel: UILabel!
    
    override func viewDidLoad() {
        testLabel.text = "테스트트트트"
    }
}

pic1.png

위 경우, UILabel의 width가 텍스트의 길이보다 짧아 텍스트가 잘리는 현상이 발생하였습니다.

UILabel의 크기를 텍스트의 크기에 맞춰 변경하는 방법을 알아봅니다.

1. sizeToFit() 함수 사용

1
2
3
4
5
6
7
8
9
10
11
import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var testLabel: UILabel!
    
    override func viewDidLoad() {
        testLabel.text = "테스트트트트"
        testLabel.sizeToFit()
    }
}

pic2.png

  • sizeToFit 함수는, Subview를 감쌀 수 있도록 해당 뷰의 크기를 재조정 하고, 위치를 재조정 해 줍니다. sizeToFit() Docs
  • 해당 메소드를 활용하여, UILabel의 크기를 위와 같이 텍스트 크기에 맞출 수 있습니다.

2. sizeThatFits() 함수 사용

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
import UIKit

class CalculatorViewController: UIViewController {
    
    @IBOutlet weak var testLabel: UILabel!
    
    override func viewDidLoad() {
        testLabel.text = "테스트트트트"
        let newSize = testLabel.sizeThatFits( CGSize(width: testLabel.frame.width, height: CGFloat.greatestFiniteMagnitude))
        print(testLabel.frame.size.width)
        print(testLabel.frame.size.height)
        print(newSize.width)
        print(newSize.height)
        testLabel.frame.size.width = newSize.width
        testLabel.frame.size.height = newSize.height
    }
}

pic3.png

  • sizeThatFits함수는, 해당 뷰를 그릴 때 가장 알맞은 크기를 계산하여 리턴 해 줍니다. sizeThatFits() Docs
  • 해당 메소드를 활용하여, 본 포스트의 경우 Text를 모두 표기해 주는 UILabel의 크기를 알아내고, 알아낸 크기에 UILabel의 크기를 맞춤으로써 화면의 모든 텍스트를 표기 할 수 있습니다.

3. intrinsicContentSize 값 사용

1
2
3
4
5
6
7
8
9
10
11
import UIKit

class CalculatorViewController: UIViewController {
    
    @IBOutlet weak var testLabel: UILabel!
    
    override func viewDidLoad() {
        testLabel.text = "테스트트트트"
        testLabel.frame.size = testLabel.intrinsicContentSize
    }
}

pic4.png

  • intrinsicContentSize 프로퍼티는, 뷰 안의 컨텐츠( 본 포스트의 UILabel에선 text에 해당 ) 의 실질적인 크기를 리턴 해 줍니다. intrinsicContentSize Docs
  • 해당 프로퍼티를 활용하여, UILabel의 크기를 뷰 안의 컨텐츠의 크기를 알아내고, 해당 컨텐츠의 크기에 UILabel의 크기를 맞춤으로써 화면의 모든 텍스트를 표기 할 수 있습니다.

번외, adjustFontSizeToFitWidth 사용

import UIKit

class MainViewController: UIViewController {

    @IBOutlet weak var testLabel: UILabel!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        testLabel.text = "테스트트트"
        testLabel.adjustsFontSizeToFitWidth = true
    }
}

pic5.png

  • adjustsFontSizeToFitWidth 프로퍼티를 활용하여, 뷰 안의 텍스트의 폰트 사이즈를, label의 크기에 맞도록 알맞게 수정 해줄 수 있습니다. adjustsFontSizeToFitWidth Docs
  • 해당 프로퍼티를 활용하여, UILabel의 크기에 맞도록 텍스트의 폰트를 작게 줄여 화면의 모든 텍스트를 표기 할 수 있습니다.

"IOS" 카테고리의 최근 포스팅

카테고리 모든 글 보기
iOS - image set에서 1x, 2x, 3x 이미지를 사용하는 이유 2021. 01. 21
iOS - UILabel 크기를 텍스트에 맞추기 2021. 01. 20
하드웨어 iOS 기기에 앱 무선으로 빌드하기 2020. 10. 07
하드웨어 iOS 기기에 앱 빌드하기 2020. 10. 06