如何使用自动布局将 UITextField 重新定位到特定位置

Question

我正在 swift 4.0 上为 IOS 创建一个视图。在我的示例中，我有 5 个 UITextField。我想更改 "tf5" 的位置并将其放在 "tf2" 和 "tf3" 之间，但我不能在自动布局上使用边距顶部。我试图像其他解决方案一样定义约束，但到目前为止无法解决这个问题。我怎样才能做到这一点？感谢您的帮助。

Answer 1

UIStackView 组件对您的情况很有用。您可以做的是将所有字段添加到 -vertical- 堆栈视图中：

Select 所有需要的文本 fields/text 视图并单击 "Embed in Stack" 按钮：

因此它应该在文档大纲区域中显示为：

很简单，此时您所要做的就是拖动任意文本字段并更改其位置：

因此，您应该为新创建的堆栈视图设置适当的约束。并且 - 显然 - 它的属性，例如字段之间的间距（您可以在 IB 中完成）。

Answer 2

由于您希望以编程方式使用它，因此这里有一个带有 UIStackView 的版本：

let tf1 = UITextField()
let tf2 = UITextField()
let tf3 = UITextField()
let tf4 = UITextField()
let tf5 = UITextField()

let stackView = UIStackView()
stackView.axis = .vertical
stackView.distribution = .fill
stackView.alignment = .fill
stackView.spacing = 8

// this arranges them from 1 to 5
stackView.addArrangedSubview(tf1)
stackView.addArrangedSubview(tf2)
stackView.addArrangedSubview(tf3)
stackView.addArrangedSubview(tf4)
stackView.addArrangedSubview(tf5)

// now you just need to use autolayout to position the stackview properly, and it will take
// care of textFields for you

// now if you want to place tf5 before tf3 later
let indexOfTF3 = stackView.arrangedSubviews.index(of: tf3)!
stackView.insertArrangedSubview(tf5, at: indexOfTF3)
// or you can use number 2 instead of indexOfTF3, since in this case we know that it is there

旁注：您可以使用相同的 stackView 来定位 tw1 UITextView，但如果我没记错的话，您必须添加一个约束来确定它的高度（因为它没有固有大小）以使 stackView 的 .fill 分布正常工作。

如何使用自动布局将 UITextField 重新定位到特定位置

How to reposition an UITextField to a specific position with Auto Layout

constraints

uitextfield

ios

autolayout

swift