ZhouJiatao's Blog

Storyboard 如何让控件在容器内平均分布

情景

我们希望蓝、绿两个色块在不同的屏幕尺寸下,都能平均的水平分布

context

显然,直接设置它们的左右间隔是不行的。

解决方法

添加其它控件占位

这里使用3个label。 为了方便观察,label添加了背景色。 (关键操作)按下command键,选中3个label,为它们leading、training和width设置约束

labelContraints

为蓝、绿色块的宽、高和纵坐标设置约束

colorBlockContraints

update frames

updateFrames

补充

最后发现,忘记给label设置y坐标了。 可以让它们垂直居中绿色方块,再update frames

labelContraints2

将label隐藏后,效果如下:

result

结尾

占位label的Content Hugguing priorityContent Compression Resistance Priority数值必须比目标控件。否则你的目标控件会变形。