iOS StackView使用:左侧动态尺寸Label搭配右侧View时Label被截断如何解决
iOS两列动态布局解决方案
你遇到的左侧Label被截断的核心原因是Auto Layout下,左侧Label和右侧View的内容优先级默认相同,系统判定压缩优先级时会优先压缩Label。按照以下步骤调整即可实现需求:
1. 基础约束搭建
首先给每行的两个元素添加基础布局约束:
- 左侧Label:leading对齐父视图leading,上下边缘和右侧View对齐,trailing和右侧View的leading保持你需要的固定间距
- 右侧View:trailing对齐父视图trailing,上下边缘和左侧Label对齐,可按需添加最小宽度约束,无需设置固定宽度
如果用水平UIStackView作为每行的容器操作更简单:将StackView的axis设为horizontal,alignment设为fill/center,spacing设为你需要的间距,把Label和View放进StackView即可,无需单独加上述约束。
2. 调整内容优先级(核心)
给左侧Label修改两个水平方向的布局优先级,保证Label不会被压缩、且优先贴合自身内容宽度:
- 水平内容抗压缩优先级(Content Compression Resistance Priority)调至
751(默认UILabel该值为750,高于普通UIView即可) - 水平内容拥抱优先级(Content Hugging Priority)调至
251(默认UILabel该值为250,高于普通UIView即可)
代码示例
Swift:
yourLabel.setContentHuggingPriority(.init(251), for: .horizontal) yourLabel.setContentCompressionResistancePriority(.init(751), for: .horizontal)
Objective-C:
[yourLabel setContentHuggingPriority:251 forAxis:UILayoutConstraintAxisHorizontal]; [yourLabel setContentCompressionResistancePriority:751 forAxis:UILayoutConstraintAxisHorizontal];
如果用Storyboard/XIB开发,选中Label后在「尺寸检查器(Size Inspector)」中找到对应选项直接修改数值即可。
3. 多行文本适配(可选)
如果左侧Label可能展示多行文本,将Label的numberOfLines属性设为0,不要给Label添加固定高度约束,即可实现高度自适应。
注意:不要给左侧Label添加固定宽度、最大宽度的硬约束,否则优先级调整也无法生效。
内容的提问来源于stack exchange,提问作者gevemik616
相关产品推荐
相关产品推荐

