如何实现UIImageView高度与UILabel字体高度一致并在UIStackView内居中

你可以按以下步骤配置约束和UIStackView属性即可达成预期效果：

第一步：配置UIStackView基础属性 #

• 将UIStackView的axis设为水平方向
• alignment设为center，distribution设为fill，设置合适的spacing作为文本和图片的间距

第二步：设置UIImageView的约束 #

给UIImageView添加两个核心约束：

• 高度约束和UILabel的font.capHeight相等，不要直接使用UILabel的整体高度，capHeight是字体本身的大写字母高度，和文本视觉高度完全匹配，不会出现当前图片比文字高很多的问题
• 宽高比约束设置为1:1，保证图片是正方形不会拉伸变形

第三步：可选精准对齐优化 #

如果需要图片和文本的基线对齐更精准，可以将UIStackView的alignment改为firstBaseline，同时给UIImageView添加底部约束等于UILabel的基线偏移，偏移量设置为-(label.font.capHeight - label.font.ascender)，可以完美对齐文本的大写字母上下边缘。

代码示例（Swift） #

// 1. 初始化控件
let label = UILabel()
label.text = "示例文本"
label.font = UIFont.systemFont(ofSize: 16)

let imageView = UIImageView(image: UIImage(systemName: "checkmark"))
imageView.contentMode = .scaleAspectFit

let stackView = UIStackView(arrangedSubviews: [label, imageView])
stackView.axis = .horizontal
stackView.alignment = .center
stackView.spacing = 4
stackView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(stackView)

// 2. 约束设置
NSLayoutConstraint.activate([
    // stackView本身的布局约束，可根据业务需求调整
    stackView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    stackView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
    // 图片高度与字体capHeight相等
    imageView.heightAnchor.constraint(equalToConstant: label.font.capHeight),
    // 图片宽高比1:1
    imageView.widthAnchor.constraint(equalTo: imageView.heightAnchor)
])

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