求助：多行UILabel场景下UIStackView的分布与对齐问题

嘿，我来帮你搞定这个UIStackView的布局难题！你现在的结构是UICollectionViewCell的contentView里放了个水平的containerStackView，里面塞了一个带三个标签的垂直stackView和一个UIImageView对吧？这种组合布局最容易在distribution和alignment上踩坑，我结合几种常见的需求场景给你具体的设置方案：

1. 最常用的列表项布局：左标签组+右图标，整体垂直居中 #

这是类似通讯录、消息列表的经典布局，标签左对齐，图标靠右且和文字垂直居中。对应的设置如下：

func createSubViews() {
    // 初始化水平容器StackView
    let containerStackView = UIStackView()
    containerStackView.axis = .horizontal
    containerStackView.alignment = .center // 让内部的标签组和图标垂直居中对齐
    containerStackView.distribution = .fill // 让子视图按自身尺寸填充，配合优先级控制宽度
    containerStackView.spacing = 16 // 标签组和图标之间的间距，按需调整
    containerStackView.translatesAutoresizingMaskIntoConstraints = false
    contentView.addSubview(containerStackView)
    
    // 初始化垂直标签StackView
    let labelStackView = UIStackView()
    labelStackView.axis = .vertical
    labelStackView.alignment = .leading // 三个标签左对齐
    labelStackView.distribution = .fill // 标签高度自适应内容，也可以用.equalSpacing让标签间距均匀
    labelStackView.spacing = 4 // 标签之间的垂直间距
    
    // 添加三个示例标签
    let titleLabel = UILabel()
    titleLabel.text = "主标题"
    titleLabel.font = .systemFont(ofSize: 16, weight: .semibold)
    
    let subTitleLabel = UILabel()
    subTitleLabel.text = "副标题"
    subTitleLabel.font = .systemFont(ofSize: 14)
    subTitleLabel.textColor = .gray
    
    let helperLabel = UILabel()
    helperLabel.text = "辅助说明文本"
    helperLabel.font = .systemFont(ofSize: 12)
    helperLabel.textColor = .lightGray
    
    [titleLabel, subTitleLabel, helperLabel].forEach(labelStackView.addArrangedSubview)
    
    // 初始化右侧图标
    let iconImageView = UIImageView(image: UIImage(systemName: "chevron.right"))
    iconImageView.contentMode = .scaleAspectFit
    // 固定图标尺寸，避免被拉伸或压缩
    iconImageView.widthAnchor.constraint(equalToConstant: 24).isActive = true
    iconImageView.heightAnchor.constraint(equalToConstant: 24).isActive = true
    
    // 将标签组和图标加入容器StackView
    [labelStackView, iconImageView].forEach(containerStackView.addArrangedSubview)
    
    // 关键优先级设置：让标签组优先占据可用宽度，图标保持最小尺寸
    labelStackView.setContentHuggingPriority(.defaultLow, for: .horizontal)
    iconImageView.setContentHuggingPriority(.defaultHigh, for: .horizontal)
    
    // 给容器StackView添加约束，贴紧contentView的边距
    NSLayoutConstraint.activate([
        containerStackView.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 12),
        containerStackView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16),
        containerStackView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16),
        containerStackView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -12)
    ])
}

2. 左右平分空间：标签组和图标各占一半宽度 #

如果需要标签组和图标分别占据水平方向的一半空间，且各自内部居中，调整这两个关键属性：

// 容器StackView设置
containerStackView.distribution = .fillEqually
containerStackView.alignment = .center

// 标签组内部改为居中对齐
labelStackView.alignment = .center

3. 标签组垂直填充整个Cell高度，图标垂直居中 #

如果希望标签组在垂直方向填满Cell，图标保持自身高度居中显示，可以这么设置：

// 容器StackView设置
containerStackView.alignment = .fill // 让标签组拉伸至容器高度
containerStackView.distribution = .fill

// 标签组设置为均匀分布在垂直空间
labelStackView.distribution = .equalSpacing

// 让图标保持自身高度，不被垂直拉伸
iconImageView.setContentHuggingPriority(.defaultHigh, for: .vertical)

几个避坑小贴士 #

• 一定要给StackView设置translatesAutoresizingMaskIntoConstraints = false，否则自动生成的约束会和你手动加的约束冲突
• spacing属性可以灵活调整，控制子视图之间的间距，不用额外加约束
• contentHuggingPriority和contentCompressionResistancePriority是控制StackView布局的核心，谁的优先级高，谁就优先保持自身尺寸

内容的提问来源于stack exchange，提问作者wj313