使用动态约束对齐文本字段 [英] Align text fields using dynamic constraints
问题描述
我一直在学习如何制作iOS应用，但遇到了一些小麻烦.我找不到对齐文本输入的简单方法.
I've been learning how to make iOS apps, and have come across a minor annoyance. I can't find an easy way to align my text inputs.
查看下面的屏幕截图，您将看到我设法对齐了文本字段，这正是我想要的.
Looking at the below screenshot, you will see that I've managed to align my text fields, which is what I want.
但是，我通过更改每个标签和文本字段之间的前导空格来手动完成此操作.
However, I did this manually by changing the individual Leading Space between each Label and Text Field.
我的问题是，如何动态对齐文本字段?
My question is, how can I dynamically align my text fields?
推荐答案
Anand发布了一种不错的方法，但是在这种情况下，我个人使用相等的宽度和高度.因此，让我们简要介绍一下:
Anand has posted nice way, but I personally use equal widths and heights in this kind of situation. So let's make a brief of it:
1):首先，将约束置于 年龄标签 :
1) First, put constraints onto the age label:
- 左前角c.
- 领先c.
- 宽度c.
- 高度c.
2)将约束放在顶部的 右侧文本字段 :
2) Put constraints onto the top right textfield:
- 尾随c.
- 领先c.
- 高度c.
- 与标签和文本字段之间的间距有关的约束，因此CTRL从文本字段拖动以标记选择的
horizontal spacing c.
- right trailing c.
- top leading c.
- height c.
- the constraint, that will be related to spacing between label and textfield, so CTRL drag from textfield to label a select
horizontal spacing c.
3)然后，在您的第二行元素中-在情节提要中放置大约相同宽度和高度的第二个标签和第二个文本字段(使用IB，您以后可以使用魔术功能更新框架对其进行修复. ).
3) Then, make a second row of you elements - place second label and second textfield approximately of the same width and height in storyboard (with IB you can fix it later using magic function Update frames).
4)然后，将其设置为您的weight标签:
4) Then, set this for your weight label:
- 左前角c.
- 领先c.
- 然后选择两个标签并选中等宽复选框和等高复选框.
5)相同的重复宽度与您的第二个文本字段相同.您不必在第二步中限制间距.
5) The same repeat width your second textfield. You don't have to make spacing constraint in the second step.
完成现在，所有四个项目都已对齐.
FINISH Now all four items are aligned.
例如，如果要更改标签的高度，只需选择其高度限制，其他标签也将遵循此更改.
If you want to change height of labels for example, just select the height constraint of it and your other labels will follow this change as well.
因此，最终体验在此动画中:
So final experience is here in this animation:
这篇关于使用动态约束对齐文本字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
