如何使用 Autolayout 缩放 Xcode 6 上的按钮以适应不同的屏幕尺寸?

Posted

技术标签:

【中文标题】如何使用 Autolayout 缩放 Xcode 6 上的按钮以适应不同的屏幕尺寸?【英文标题】:How do you scale a button on Xcode 6 to fit different screen sizes using Autolayout? 【发布时间】:2015-08-12 09:55:33 【问题描述】:

我是 Xcode 的新手,正在学习 Autolayout。经历了一段非常艰难的时期,我想我终于碰壁了,真的需要一些关于以下方面的指导。

因此,我创建了一个带有 .png 背景图像的图像视图,该图像显示按钮占位符,以帮助我确定要放置按钮对象的确切位置。因此,我将所有四个边的图像视图都固定为 0,并将其完美地调整为不同的屏幕尺寸。现在问题出现在按钮上。我将按钮对象拖出对象库并将其放在图像视图的正上方,按钮占位符图像所在的位置。对于按钮,我对其宽度和高度进行了限制,固定了底部和右侧,以及纵横比以帮助根据不同的屏幕尺寸调整大小。

第一个问题是,尽管按钮正好放置在图像视图显示的位置,但按钮位于其他位置,即使图像视图能够完美地调整到不同的屏幕尺寸。第二个问题是,尽管按钮在所有屏幕上都很好,但即使屏幕变大或变小,固定长度也保持不变并且不会改变。最后一个问题是按钮本身的大小即使在不同的屏幕尺寸上也保持不变。

为什么按钮不能相对于不同的屏幕尺寸调整大小(使用纵横比但不起作用)和重新定位?对此的指导将不胜感激!一整天都在想办法解决这个问题。

新的更新去掉了宽度和高度限制,不考虑纵横比:

【问题讨论】:

你不能同时有一个固定的宽度、高度约束和一个比例约束。做固定或比率约束。 @Desdenova 因此,如果我要卸载高度和宽度,仅使用纵横比,按钮是否能够根据不同的屏幕尺寸调整自身大小?以及相对于不同的屏幕尺寸,我将如何确定 Superview 和按钮缩放之间的距离? @Desdenova 在原帖中更新了一张新照片 @Desdenova 你能帮忙吗? @ddevaz 请帮忙! 【参考方案1】:

您应该删除宽度限制,让按钮调整大小,仅前导和尾随空格可以增加不同屏幕尺寸的宽度

【讨论】:

高度限制怎么样?那么它的高度在不同的屏幕尺寸上不会保持不变吗?以及相对于不同的屏幕尺寸,我将如何确定 Superview 和按钮缩放之间的距离? 如果你想让按钮根据屏幕调整大小,为什么不添加前导、尾随顶部和底部约束?如果你想要它相对于图像添加垂直距离或水平距离。 只添加前导和尾随顶部和底部约束?抱歉,您能否澄清一下添加垂直或水平距离是什么意思?谢谢 是的,前导、尾随底部和顶部约束是从您的视图到其父视图的前导尾随顶部和底部距离之间的距离,因此每当您的父视图的框架发生变化时,例如它变大时,您的视图会扩大,如果它缩小它会相应更新,垂直和水平间距是两个视图之间的垂直或水平距离

以上是关于如何使用 Autolayout 缩放 Xcode 6 上的按钮以适应不同的屏幕尺寸?的主要内容,如果未能解决你的问题,请参考以下文章

如何在 Xcode 6.3 中使用 AutoLayout 创建 ScrollView

如何在 Xcode 中成功使用 AutoLayout 和 Constraints?

如何使用 Xcode AutoLayout 调整图像大小?

如何在相同大小的类中给出不同的约束(xcode 8 AutoLayout)

如何使元素适合 Xcode IB 中的 AutoLayout?

使用 AutoLayout 缩放 UIImageView 以适应宽度