您有一个良好的开端 - 以 1:1 的比例对齐中心 X 和 Y。您只需添加 两组 组具有不同优先级的顶部/底部和前导/尾随约束。这是一个示例,它结合了您拥有的三个约束,将使视图在所有方向上居中,沿较窄的轴有 10 点边框:
优先级 == 750
- 最高 == 10 分
- 底部 == 10 分
- 领先 == 10 分
- 尾随 == 10 分
优先级 == 1000
- 顶部 >= 10 分
- 底部 >= 10 分
- 领先 >= 10 分
- 落后 >= 10 分
您在执行此操作时可能会看到错误/警告,因为 IB 不知道如何呈现它,但是一旦您完成了此操作,您将拥有所需的内容。
编辑:
根据记忆,有点和像素。在可能的时间和地点,试着从观点的角度来思考。您可能希望在像素方面考虑的唯一时间是图像。 (可能还有其他的图形测量方法,但同样,我是凭记忆写的。)
点在不同设备尺寸上应该是一致的 - 因此,如果您在 4 英寸 iPhone 屏幕上有一个 100x100 的正方形,那么它在 12.9 英寸 iPad Pro 上的尺寸将是相同的。
更重要的是,margins 可以使用自动布局设置相同。这两个屏幕上的 25 点边距相同。所以在我上面的例子中,你会得到几乎所有设备上最大的矩形,因为你设置的是边距,而不是视图大小。
我去年深入了解了屏幕尺寸,这些是当前的屏幕尺寸:
//iPad Pro 1366x1024
//iPad 1024x768
//iPad Mini 1024x468
//iPhone 6 Plus 736x414
//iPhone 6 677x375
//iPhone 5 568x320
//iPhone 4 480x320
因此,基于此,上述约束将在 iPhone 4(iPhone SE 也是)上产生 300x300 的正方形,因为最窄的轴将是 320 减去两个 10 点的边距。在 12.9 英寸的 iPad Pro 上,它将是 1004x1004 的正方形。
当您在代码中创建约束时,您还可以使用以下代码创建 layoutMarginGuide:
let margins = view.layoutMarginsGuide
这应该与在 IB 中选中“包含边距”复选框相同。本质上,这是每个设备的推荐边距大小。 (我相信这还应该包括状态栏、选项卡和导航栏,甚至是 iPhone 的“电话顶部横幅(原文如此)”。但我对此有一些问题,所以 YMMV。)
编辑 2:
将所有这些放在一起,您通过“自动布局”定义的内容是一种非常流畅的方式,可以最大化正方形的大小(或者在您的情况下,将正方形变成圆形)。通过设置两组边距,一组等于但具有高优先级,你让自动布局知道它可能会超出所需的约束。 大于或等于值的第二组是必需的。
因此,在 480x320 设备中,无法满足(“等于”)的顶部/底部边距限制可以被打破,而在横向中,无法满足的前导/尾随限制将被打破。请记住,您已经设置了中心 X/Y,因此视图将居中,并且您设置了 1:1 的比例,因此它将是方形的。 (只要您没有触及优先级 - 需要默认值。