05. SnapKit 布局

目标：约束清晰、结构稳定、易维护。

一、安装（SPM）

https://github.com/SnapKit/SnapKit

二、基础布局模板

import UIKit
import SnapKit

final class ProfileHeaderView: UIView {
    private let avatar = UIImageView()
    private let nameLabel = UILabel()
    private let descLabel = UILabel()

    override init(frame: CGRect) {
        super.init(frame: frame)
        backgroundColor = .white

        avatar.contentMode = .scaleAspectFill
        avatar.clipsToBounds = true
        avatar.layer.cornerRadius = 24

        nameLabel.font = .systemFont(ofSize: 18, weight: .bold)
        descLabel.font = .systemFont(ofSize: 13)
        descLabel.textColor = .darkGray
        descLabel.numberOfLines = 2

        addSubview(avatar)
        addSubview(nameLabel)
        addSubview(descLabel)

        avatar.snp.makeConstraints { make in
            make.leading.equalToSuperview().offset(16)
            make.top.equalToSuperview().offset(16)
            make.width.height.equalTo(48)
        }

        nameLabel.snp.makeConstraints { make in
            make.leading.equalTo(avatar.snp.trailing).offset(12)
            make.trailing.equalToSuperview().inset(16)
            make.top.equalTo(avatar.snp.top)
        }

        descLabel.snp.makeConstraints { make in
            make.leading.equalTo(nameLabel)
            make.trailing.equalTo(nameLabel)
            make.top.equalTo(nameLabel.snp.bottom).offset(6)
            make.bottom.lessThanOrEqualToSuperview().inset(16)
        }
    }

    required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") }
}

三、更新与重建

button.snp.updateConstraints { make in
    make.height.equalTo(44)
}

container.snp.remakeConstraints { make in
    make.edges.equalToSuperview().inset(12)
}

四、优先级

label.snp.makeConstraints { make in
    make.trailing.equalToSuperview().inset(16).priority(.high)
}

五、常见坑

• 子视图之间约束冲突
• 只设顶部没设底部导致高度不确定
• remake 误用导致约束丢失

SnapKit 是语法糖，核心仍是 Auto Layout 的约束逻辑。