如何使用自动布局使其超级视图调整方形视图的大小

Question

在我的特定情况下,我在视图控制器中查看了我添加了以下约束:

• 将前导,尾随,顶部和底部边缘设置为0
• 将乘数设置为下边缘为2:1

现在视图位于视图控制器的上半部分.

在这里我添加了一个方形图像视图,为此我添加了以下约束:

• Ctrl从图像视图拖动到superview并添加相等的高度和宽度.
• 更改宽度和高度的乘数,直到我有一个完美的正方形.
• 添加约束为垂直和水平居中

我的约束看起来很完美,但是当在模拟器中运行时,我没有得到完美的方块.除此之外,在不同的模拟器屏幕上运行时,图像视图不会调整大小.

这是我的设置:

• 启用自动布局和大小类
• 我为故事板使用推断大小
• 对于宽度和高度,自适应布局设置为"任意"
• 我试图为4s,5,6和6+模拟器运行它.

我查看了其他stackoverflow帖子,但似乎没有任何工作.

有一些基本步骤可以做到这一点吗？

编辑:

设置> = 10约束后:

编辑3:我添加了顶部,底部,前导,尾随约束2次,1次低于或等于(优先级1000),另一次大于或等于(优先级800),常数值为90.我不知道为什么底部它试图从主视图拉伸到90磅,而不是容器视图(绿色).

Answer 1

您有一个视图需要扩展以填充其容器,同时保持其纵横比.这是自动布局的常见模式.

诀窍是对前导/尾随/顶部/底部使用两个约束:

• =10 低优先级

• >=10 按要求优先.

把它们放在一起,你有:

• 宽高比1:1

• Superview中心X/Y.

• 领先/尾随/上/下至Superview = 10(优先级为750)

• 前导/尾随/上/下至超级视图> = 10(优先级为1000)

UIImageView还需要考虑以下几点:

• UIImageView将根据其显示的图像具有内在内容大小,因此您需要确保其内容拥抱优先级低于您用于=10约束的750优先级.

• UIImageView.contentMode确定底层图像相对于UIImageView的大小的大小.默认情况下,它设置为UIViewContentModeScaleToFill.