如何为 iPad 在一行中设置两个文本框?

How can I set two textboxes in one line for iPad?

我用的是xCode8.1。 我在 iPhone 的一列中有两个文本框(在纵向模式下):

如何使用自适应设计在 iPad 和 iPhone 的横向模式下在一行中显示这些文本框?

按照纵向显示的方式放置文本框

假设你想让Name留在同一个地方,你只需要改变对Surname

的约束

您应该依次为 Surname - select 每个约束定义一个 TopSpace 和一个 Leading Space,然后单击 + Installed 旁边的按钮 - 这使您可以选择引入变化,因此单击 Add Variation 然后 de-select 初始默认值。

这意味着这两个约束仅适用于纵向模式下的 iPhones(Compact/Regular

切换到横向模式,并将Surname位置放在您需要的位置。应用约束 - 垂直居中 Name 和前导间距。 Select 这两个约束,并重复创建变体的过程,但现在将仅为 iPhone 横向创建它们 (Compact/Compact)。

现在切换到 iPad,并重复您对横向执行的过程,这将创建 iPad 约束 (Regular/Regular)

这应该是您需要的一切。如果它不起作用,或者您在情节提要中看到红线,则很可能意味着您已经为 所有 方向保留了 Surname 约束之一 - 同时时间因为对细节有冲突的约束 - 如果你找不到哪一个,删除约束并重新开始:-)

这是显示您添加变体的位置的屏幕截图

这是添加 portrait-specific 约束后的样子

在 Xcode 8 中执行此操作的关键是编辑器右下角的 Vary For Traits 按钮。

  • Select View as 列表中的 iPad,并像 iPad 一样设置约束].

  • 然后 select 和 iPhone,然后单击 Vary For Traits,然后 select 宽度.

  • 现在,select iPhone 上未使用的任何约束,然后点击删除。这不会完全删除它们,它只是卸载它们 那个大小 class

  • 然后为iPhone添加你需要的约束。这只会增加紧凑宽度大小的约束 class

  • 完成后,单击完成变化

  • 瞧瞧……

[[

另一种方法是使用具有不同特征的堆栈视图。 Select Interface builder 中的两个字段和右下角的 Stack 按钮。

然后 select 堆栈视图并打开属性检查器选项卡。

添加基于宽度的变体,并将此变体(常规宽度)设置为水平轴。

完成。

注意:如果您的部署目标低于 iOS9.

,请不要使用堆栈视图