Autolayout实现UIScrollView内UILabel与动态高度UIButton自适应布局问题
基于Interface Builder Autolayout的实现方法
方案1:直接布局子视图
- 首先配置UIScrollView的contentView基础约束:contentView上下左右四边缘与scrollView的content layout guide完全对齐,同时添加
contentView宽度等于scrollView frame layout guide宽度的约束,关闭水平滚动。 - 配置UILabel约束:顶部与contentView顶部对齐,左右边距按需求设置(如左右各16px),label行数设为0支持自动折行。
- 配置4个动态高度按钮的约束:所有按钮左右边距与label对齐,相邻按钮垂直间距按需求固定,最后一个按钮底部与contentView底部对齐,按钮titleLabel行数设为0支持高度自适应。
- 配置可变间距约束:按住Control从label底部拖拽到第一个按钮顶部,选中该约束后在属性面板将Relation改为
Greater Than or Equal,常量设为70,优先级保持默认1000。 - 补充低优先级约束:再添加一条label底部到第一个按钮顶部的间距等于70的约束,将优先级设为250。该约束仅在总内容高度小于scrollView可见高度时生效,保证最小间距为70;当内容总高度超过可见区域时,高优先级的>=70约束生效,自动撑开间距并触发滚动。
方案2:使用UIStackView实现
- 外层使用垂直UIStackView,依次放入UILabel和存放4个按钮的内层垂直StackView,外层StackView上下左右四边缘与contentView对齐,宽度等于scrollView宽度。
- 外层StackView属性配置:Alignment设为Fill,Distribution设为Fill,内层按钮StackView的Spacing按需求设置相邻按钮间距。
- 配置可变间距:选中外层StackView,在Size Inspector面板的Custom Spacing区域,设置label之后的自定义间距为70,再添加一条
外层StackView高度 >= scrollView可见高度的约束,优先级设为250即可。
内容的提问来源于stack exchange,提问作者programmer
相关产品推荐
相关产品推荐

