使用Autolayout的IOS自适应布局

Question

我正在开发IOS应用程序，这是我在IOS上构建的第一个应用程序。我有开发Android应用程序的丰富经验。所以我收集了有关IOS开发的基本信息和知识。我正在研究自动布局。但我并没有让它完全发挥作用。我已经看到一些开发人员正在研究代码，但我只是想使用IB，因为我相信会有一些方法来处理这个问题。

所以寻求帮助，请不要投票我的这篇文章因为我在尝试几乎所有我上网后发布这个。

首先看一下我开发的内容及其内容：

在图片中有不同数量的模拟器，如 Ipad pro 12.9，Ipone 8 plus和I phone se

到目前为止我做了什么：

• 我拍摄了视图（中间的白框）。我把它垂直居中，水平居中。
• 我将视图高度设置为300磅，宽度设置为匹配具有一些边距的超视图
• 我已将文本字段用于从用户获取电话和PIN，然后按OK按钮，如图所示。

问题＆amp;我想要的是什么：   - 问题是视图是中心垂直和水平但不是它的中心    内容是。我希望这个视图能够在基础上管理它的高度    它的内容。这样可以看作是中心对齐的    垂直。现在它的中心不是垂直对齐的   - 其次问题是文本字段的宽度，就像在Ipad上看起来太糟糕了。所以我真的希望他们在所有设备上看起来都很好。

使用自适应/自动布局有没有解决方法？请帮帮我，我怎样才能使用IB。

Answer 1

@Android Teem， 为此，您需要使用SizeClasses和AutoLayout。

下面我试图给你解决方案。

使用项目结构如下所示。不要在主视图中使用另一个UIView。而是用户StackView。它会自动调整其中的内容。更多信息，请查看＆＃34; UIStackView＆＃34;在Apple Doc。

接下来，您需要将堆栈视图的约束添加为

• 领先10（对于x）
• 落后10（对于y）
• 指向中心（宽度）

高度堆栈视图将自动调整。

现在双击前导和尾随约束将打开尺寸属性。点击＆＃34; +＆＃34; Constant之前的图标。它会告诉你一个弹出窗口。为iPad添加Regular Width Regular Height并将值设置为200（我已经给出200，您可以根据您的计算和要求给出）。这将显示如下图像

现在从预览中运行或检查所有屏幕。你会得到理想的结果。我的更改显示结果如下

快乐编码

Answer 2

尝试以下解决方案： -

1. 修复文本字段的宽度。
2. 标签使用最小字体比例（在谷歌搜索）。
3. 对于宽度和高度，您必须使用自适应布局。

宽度 =超级视图的70％，这意味着您的视图的乘数将为0.7

高度 =超级视图的60％，这意味着您的视图的乘数将为0.6

参考图片： -

使用superview的宽度等于



将乘数设为0.7

Answer 3

这是你需要做的。转到故事板

  

  
1. 右键单击屏幕的白色区域，然后将光标拖动到绿色区域。      
     
   1. 将出现几个选项，选择Equal Heights
     
   2. 现在白色对话框与绿色屏幕的高度相同，但不要担心。选择该高度约束并设置   乘以让0.5代表50％的超视距高度。重复一遍   宽度相同
     
  

Answer 4

删除高度约束并将最底部的按钮挂钩到视图的底部