行数可変のUILabelを表示／非表示（トルツメ）する方法

4133 ワード
AutoLayout UILabel NSLayoutConstraint AutoLayout テキストリンク

iOSアプリにて、あるUI要素を内容やボタン操作などにより、表示したり非表示（トルツメ）にしたい時があります。縦方向で言えば、高さ固定のUI要素については、高さのNSLayoutConstraintを設定し、それのconstantプロパティを本来の高さまたは0に切り替えることによって、表示／非表示を切り替えることができます。

しかし、UI要素が行数可変のUILabelの場合、中の文字列によって高さが可変のため、上記の方法が使えません。

そこで、高さ0のNSLayoutConstraintを設定し、priorityプロパティを250または750に切り替えることによって、表示／非表示を切り替えることができます。

高さ0のNSLayoutConstraintの設定
priorityプロパティはデフォルトで250に設定しておく

ShrinkCell.swift
class ShrinkCell: UITableViewCell {
    var originalLabelBottomConstraint = CGFloat(0)

    @IBOutlet weak var label: UILabel!
    @IBOutlet weak var labelHeight: NSLayoutConstraint!
    @IBOutlet weak var labelBottomConstraint: NSLayoutConstraint!

    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code

        originalLabelBottomConstraint = labelBottomConstraint.constant
    }

    func configure(hidden: Bool) {
        if hidden {
            // 非表示（トルツメ）
            labelHeight.priority = 750 // 高さ0が優先される
            labelBottomConstraint.constant = 0
        } else {
            // 表示
            labelHeight.priority = 250 // UILabelの高さが優先される
            labelBottomConstraint.constant = originalLabelBottomConstraint
        }
    }
}

表示している時

非表示（トルツメ）している時