[UIKit] UITextView 동적 높이 조절

UITextView를 사용하다 보면 입력하는 텍스트에 맞춰 동적으로 높이가 조절되도록 하고 싶어진다.
이 글에서는 계속 높이가 늘어나는 것이 아닌 특정 높이까지만 늘어나고 이후부터는 스크롤이 되는 UITextView를 구현해보겠다.
이럴 때 쉽게 사용할 수 있는 UITextView를 Custom한 AutoResizableTextView이다.

AutoResizableTextView

import UIKit

class AutoResizableTextView: UITextView {
    
    var maxHeight: CGFloat? // 텍스트뷰의 최대 높이
    
    override var contentSize: CGSize {
        didSet { // 사이즈가 변경될 때마다 반영
            self.invalidateIntrinsicContentSize()
        }
    }
    
    override var intrinsicContentSize: CGSize {
        let size = CGSize(width: self.contentSize.width, height: .greatestFiniteMagnitude)
        let newSize = self.sizeThatFits(size) // 적절한 사이즈로 조절
        var height = newSize.height
        if let maxHeight = maxHeight {
            height = min(height, maxHeight) // 원하는 높이까지만 증가하도록
            isScrollEnabled = newSize.height > maxHeight // 최대 높이를 넘어서면 스크롤이 가능하도록
        }
        return CGSize(width: newSize.width, height: height)
    }
    
    convenience init(maxHeight: CGFloat?) {
        self.init(frame: .zero, textContainer: nil)
        self.maxHeight = maxHeight
    }
}

 

 

이를 ViewController에서 적용하게 되면

import UIKit
import SnapKit

class ViewController: UIViewController {
    
    let autoResizableTextView: AutoResizableTextView = {
        let textView = AutoResizableTextView(maxHeight: 150) // 원하는 최대 높이 설정
        textView.layer.borderWidth = 1
        textView.layer.borderColor = UIColor.black.cgColor
        return textView
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        configureHierarchy()
        configureConstraints()
    }
    
    func configureHierarchy() {
        view.addSubview(autoResizableTextView)
    }
    
    func configureConstraints() {
        autoResizableTextView.snp.makeConstraints { make in
            make.centerY.equalTo(view.safeAreaLayoutGuide)
            make.horizontalEdges.equalTo(view.safeAreaLayoutGuide).inset(20)
            //make.height.equalTo(30)
            //따로 높이를 지정해줄 필요 없음
        }
    }
}

 

이렇게 하면 따로 텍스트뷰의 높이를 설정하지 않아도 입력한 텍스트에 맞춰 자동으로 높이가 조절되게 할 수 있다.

---

실행 결과

텍스트에 따라 동적으로 높이가 조절되는 텍스트뷰