不同iphone的按钮位置不同

Posted 2023-03-15

【中文标题】不同iphone的按钮位置不同

【英文标题】：Button position different for different iphone

【发布时间】：2016-04-19 03:38:31

【问题描述】：

我怎样才能让所有不同版本的 iphone 的按钮保持在同一位置？我有一个背景图像，最重要的是，我有一个按钮。

有没有我可以为按钮提供一个固定的位置？

根据故事板，以下是它的外观。

【问题讨论】：

当屏幕可以有不同的尺寸时，“相同的位置”是什么意思？

当你说相同的位置时，你想把你的按钮固定在底部吗？您可以使用自动布局来做到这一点

@matt：相同的位置含义，相对于电话窗口。底部上方几个像素

@Shripada: 是的，我勾选了自动布局。

"位置相同，相对于手机窗口" 但“手机窗口”大小不同。您必须确定“相同位置”的含义。

【参考方案1】：

所有具有 4 英寸、4.7 英寸和 5.5 英寸屏幕的 ios 设备（即从 iPhone 5 开始的所有 iPhone 和从第 5 代开始的所有 iPod）都具有相同的屏幕纵横比，即 16:9，所以如果这些是目标设备，这可以通过情节提要中的约束和无代码来实现。

您发布了 iPhone 6 大小的屏幕截图。 （专业提示：在模拟器中按 ⌘S 以将屏幕截图保存到桌面，这样您就不必尝试手动裁剪它。）在这张照片中，你已经把底部按钮边缘约 300 像素 = 屏幕底部边缘上方 150 点。 iPhone 6 的屏幕高度为 667 点。

所以第一步是在你的根视图中添加一个“间隔”视图。将其背景颜色设置为您可以看到的颜色，并将其隐藏。 （隐藏视图仍然参与布局。）将垫片固定在根视图的左边缘和下边缘。使其宽 20 点。宽度其实并不重要。在垫片和根视图之间创建等高约束。然后编辑等高约束。将乘数设置为150:667（使用该字符串，Xcode 将为您进行除法）。它应该是这样的：

现在将按钮的底部边缘限制为等于间隔的顶部边缘：

我们可以使用助手编辑器中的预览模式查看按钮是如何放置在不同屏幕尺寸上的：

根据要求，该按钮“始终位于模糊的黄线之上”。

如果您还想支持 3.5 英寸屏幕，并且将背景图像视图的模式设置为“Aspect Fit”（这将在图像的两侧留下空白）或“Scale To Fill”（这将挤压图像一点点），那么这个布局将按原样工作。

如果您还想支持 3.5 英寸屏幕并使用不同裁剪的背景图像（例如，您使用“纵横比填充”模式），则需要根据屏幕大小在代码中替换分隔符的高度约束设备。