1

我正在开发 IOS 应用程序,它是我在 IOS 上构建的第一个应用程序。我在开发 Android 应用程序方面有很好的经验。所以我收集了关于IOS开发的基本信息和知识。我正在研究自动布局。但我没有让它完全工作。我见过一些开发人员正在编写代码,但我只想使用 IB,因为我相信会有一些方法来处理这个问题。

所以寻求帮助,请不要对我的这篇文章投反对票,因为我在尝试了我在互联网上得到的几乎所有东西后发布了这篇文章。

首先看看我开发了什么以及它是什么: 在此处输入图像描述

图中有不同数量的模拟器,如Ipad pro 12.9、Ipone 8 plus 和 Iphone se

到目前为止我做了什么:

  • 我已经采取了视图(中间的白框)。我让它垂直居中,水平居中。
  • 我已将视图高度设置为 300 点,并将宽度设置为具有一些边距的超级视图
  • 如图所示,我已经放置了用于从用户和确定按钮获取电话和 PIN 的文本字段。

问题和我想要 的: - 问题是视图是垂直和水平中心,但不是它的
内容。我希望这个视图根据
里面的内容来管理它的高度。这样它就可以被视为
垂直对齐的中心。现在它不是垂直居中对齐 - 其次问题是文本字段的宽度,因为在 Ipad 上它们看起来太糟糕了。所以我真的希望它们在所有设备上都好看。

有没有使用自适应/自动布局的解决方案?请帮助我如何使用 IB 获得这个。

4

4 回答 4

3

尝试以下解决方案: -

  1. 修复文本字段的宽度。
  2. 对于标签,使用最小字体比例(在 google 上搜索)。
  3. 对于宽度和高度,您必须使用自适应布局。

宽度= superview 的 70%,这意味着您的视图的乘数将为 0.7

高度= 超级视图的 60%,这意味着您的视图乘数为 0.6

参考图片:-

与superview等宽

与superview等宽

将乘数设置为 0.7

将乘数设置为 0.7

于 2018-04-10T11:44:25.987 回答
3

@Android Teem, For this you need to use SizeClasses along with the AutoLayout.

Below I am trying to give you solution.

use items structure as like below. Don't use another UIView inside main view. Instead user StackView. It automatically adjust contents inside it. For more just look for "UIStackView" on Apple Doc.

enter image description here

Next you need to add constraints to stack view as

  • Leading 10 (for x)
  • Trailing 10 (for y)
  • Allign to center (for width)

height stack view will automatically adjust.

Now double click on leading and trailing constraint will open size attributes. Click on "+" icon just before Constant. It will show you a pop up. add Regular Width Regular Height for iPad and set values as 200 (I have give 200, you can give based on your calculation and requirement). this will show like below image

enter image description here

Now Either run or check from preview for all screens. you will get desired results. my changes show result as below

enter image description here

Happy Coding

于 2018-04-10T12:51:26.033 回答
2

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

  1. 右键单击屏幕的白色区域并将光标拖动到绿色区域。
    1. 会出现几个选项,选择 Equal Heights
    2. 现在白色对话框将变得与绿色屏幕等高,但不要担心。选择该高度约束并将乘数设置为假设 0.5 表示超级视图的 50% 高度。对宽度重复相同的操作
于 2018-04-10T11:51:37.570 回答
1

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

于 2018-04-10T11:33:43.283 回答