大型设备中的Autolayout问题

Question

我正在开发一个iPhone应用程序，其中，我使用autolayout

创建了此页面

但它在较大的iPhone中显示注册我（黄色按钮）上方不需要的空格

给出的限制是： 关于其所有控件的子视图的顶部，底部，前导和尾随。 （我在xcode中看到没有警告或错位的约束）

以下是iPhone 4s的屏幕截图

以下是iPhone 6+的屏幕截图

我希望尽量减少较大iPhone的空间距...... 我该如何解决这个问题？

请提前帮助并致谢

Answer 1

如果您打算以iOS 9用户为目标，则应使用UIStackView，这在对齐和分发方面提供了很大的灵活性。 如果没有，那么您或您的设计团队必须找到解决方案。

Answer 2

这是对你的建议。你有大约七个感兴趣的地区。第一个是标题'Register Kano ..'等等。然后有5个文本输入区域 - 名称，电子邮件，密码等。最后你有3个小行的信息文本 - 我会把它算作最后一个区域，所以7在所有。

我要做的是创建7个父UIViews来放入那些东西。我会给它们“相等的高度”约束，并让它们在上下相互间隔无间隙。然后当iphone屏幕改变高度时，这些区域在高度上伸展以填充该区域。这是一个粗略的模型：

选择所有这些UIView并选择“相等高度”约束：

然后除了底部视图之外的每个视图都需要这些约束（顶部，前导跟踪到superview 0px）

然后您的底部视图也需要加上“底部”：

所以剩下要做的就是将你的内容放在每个方框中，但是以相对于超级视图的垂直位置为中心。

Answer 3

您可以在大型设备上更新控件的保证金限制 这会在大屏幕上的每一行之间增加空间，看起来会更好。

类似的东西：

myControl.heightConstraint.constant += 20.0f

这就是我要做的，但您必须决定如何更新大型设备的布局

Answer 4

@Krunal你可以使用size类并相应地设置约束，这样就可以简单地了解如何适应每个设备的UI设计!!

Answer 5

您可以设置相对于基本视图高度的约束。这将使您的界面对象在布局上均匀分布。让我们假设你有8个地区。 registerLabel

registerLabel.leading = baseView.leading
registerLabel.trailing = baseView.trailing
registerLabel.top     = baseView.top
registerLabel.bottom  = baseView.bottom * (1/8)// it will be always proportional to height of view

然后是开头的图标firstIcon

firstIcon.leading = baseView.leading + 10
firstIcon.height  = firstIcon.width
firstIcon.height  = baseView.height*(1/9)// to give a gap between icons
firstIcon.bottom  = baseView.bottom * (2/8)

然后您可以根据firstIcon

设置文本字段的约束

对于其他图标，您可以使用3 / 8,4 / 8,5 / 8,6 / 8进行处理，并根据该图标设置相对文本字段约束。

，最后是registerMe按钮

registerButton.leading  = baseView.leading
registerButton.trailing = baseView.trailing
registerButton.bottom   = baseView.bottom
registerLabel.height    = baseView.height * (1/8)

使用这种方法，您的图标大小也会随着视图的高度而减小和增加，并且所有页面都将被填充。

baseView是控制器的视图。

Answer 6

这里发生了什么，你根据超级视图保持宽度，即手机宽度，但你的身高是固定的。

做一件事而不是给出高度约束，使用宽高比结合前导，尾随和顶部约束。当视图在宽度方向上拉伸时，组件的高度也会增加并填充iphone 6的额外空间。

这是保持相同布局和设计模式的最佳方法。

Answer 7

似乎你在视图中给出了一些固定的高度。

由于每个元素都依赖于它上面和下面的元素约束，这可能是空的空间。

因此，尝试划分View部分，然后约束的依赖性将减少。

如果您不想显示空白区域，请将中心水平使用到一个看起来不错的元素，这里可能是第三个字段。

然后开始向Register按钮提供相同的约束。当然它会帮助您解决这个问题。

Answer 8

嘿，它的最佳解决方案是stackView 在单个stackView中组合您的对象。 您可以垂直和水平组合对象。 它将减少您的空间，视图将以令人敬畏的方式安排。 您可以选择这样的对象。 点击这里使其堆叠。 现在你可以像这样减少你的空间。