ios - 使用自动布局管理 UITextField 的动态位置 - 知识问答 - OGeek|极客世界-中国程序员成长平台

菜鸟教程小白 发表于 2022-12-12 16:15:33

ios - 使用自动布局管理 UITextField 的动态位置

我的客户要求如下:

我将创建包含大约 15 个文本字段的注册表单(在服务器上预定义)。注册字段中的字段信息来自服务器。在某些情况下，某些字段可能不需要。因此，我将获得该特定案例所需的字段。

例如假设服务器上的预定义字段数为 15。即名字、姓氏、电话号码、出生日期、图片、电子邮件、地址、邮政编码等。

但在某些情况下，电子邮件 ID 字段可能不是必需的。所以我不会从服务器获取该字段。因此，应用程序端我必须从预定义的字段列表中隐藏电子邮件文本字段。

也有可能不需要多个(任何字段)字段。所以我也必须隐藏它们。我试图通过图像表示来解释情况如下。

案例 1:

 <a href="/image/luOUs.png" rel="noreferrer noopener nofollow"><img src="/image/luOUs.png" alt="enter image description here"/></a> 

案例 2:

 <a href="/image/CpGK3.png" rel="noreferrer noopener nofollow"><img src="/image/CpGK3.png" alt="enter image description here"/></a> 

在这种情况下，我正在做的是(应用程序端)我为所有预定义字段创建文本字段。然后我隐藏了根据服务器响应不需要的文本字段。即电子邮件文本字段或任何其他文本字段。

现在我的问题是，如果不需要任何字段，那么应该重新定位文本字段，并且我在我的应用程序中使用自动布局。我正在隐藏电子邮件文本字段然后如何设置下一个文本字段的位置，例如联系号码、出生日期等？
 <hr><h1>Best Answer-推荐答案</h1> 
 是的，这完全可以通过自动布局实现。 

<h3>这里最重要的是:</h3>

您不需要手动重新定位，这项工作将由自动布局完成。

你必须做以下事情:

<ol>
<li>使用 <code>UIScrollView</code> 并在其中添加所有 <code>UITextField</code>。以便轻松管理内容大小和更改位置。这里 scrollView 的内容大小也是由 Auto layout 管理的，所以不要手动操作。</li>
<li>不要为 <code>UITextField</code> 手动分配框架。例如在创建 textField 时使用 <code>CGRect</code>。</li>
<li>使用 VFL(视觉格式化语言)。这是一种功能强大的自动布局语言，可让您使用代码在运行时进行动态更改。</li>
<li>为所有 <code>UITextFields</code> 添加约束，并将 <code>hidden</code> 属性初始设置为 <code>No/False</code>。通过简单地调用以下方法，从您的服务器响应和查询中使它们可见并更新自动布局约束。

<pre><code>// Change hidden property based on your response
// ........
// ........
// Below methods will update auto layout

;
;
</code></pre>

您可以将这些方法放在动画 block 中以获得丰富的 UI 体验。</li>
</ol>

注意:请记住，VFL 不是一个简单的部分，您在使用它时必须小心。 

<hr/>

添加可以帮助您的示例代码(但它是在 Swift 中将其转换为 Objective C)，此外，VFL 的参数和值可能会有所不同，因为此代码符合我的要求。看看并根据您的需要进行更改。

使用 VFL 创建 <code>UIScrollView</code>:

<pre><code>// Create scrollview to display content
self.scrollView = UIScrollView()
self.scrollView.delegate = self
self.scrollView.setTranslatesAutoresizingMaskIntoConstraints(false)
self.view.addSubview(self.scrollView)

// Visual formatting constraints of scrollview horizontal-vertical alignment with respect to view
self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:||", options: NSLayoutFormatOptions(0), metrics: nil, views: ["scrollView" : scrollView]))

self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:||", options: NSLayoutFormatOptions(0), metrics: nil, views: ["scrollView" : scrollView]))
</code></pre>

在<code>UIScrollView</code>中添加<code>UITextField</code>:

<pre><code>func createRegistrationControls() {
var previousTextField : UITextField! = nil

// Remove all pervious views.
for view in self.scrollView.subviews {
 view.removeFromSuperview()
}

for <YOUR NO OF TEXTFIELDS CONDITION> {
 let textField : UITextField! = UITextField()
 textField.borderStyle = UITextBorderStyle.RoundedRect
 textField.font = UIFont.systemFontOfSize(14)
 textField.clearButtonMode = UITextFieldViewMode.WhileEditing
 textField.setTranslatesAutoresizingMaskIntoConstraints(false)
 textField.delegate = self
 self.scrollView.addSubview(textField)

 // Left constraint
 self.scrollView.addConstraint(NSLayoutConstraint(item: textField, attribute: NSLayoutAttribute.Left, relatedBy: NSLayoutRelation.Equal, toItem: self.scrollView, attribute: NSLayoutAttribute.Left, multiplier: 1.0, constant: 10))

 // Right constraint
 self.scrollView..addConstraint(NSLayoutConstraint(item: textField, attribute: NSLayoutAttribute.Right, relatedBy: NSLayoutRelation.Equal, toItem: self.scrollView, attribute: NSLayoutAttribute.Right, multiplier: 1.0, constant: -10))

 // TOP Horizontal constraint
 let metrices = ["width" : self.view.bounds.width]
 self.scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|", options: NSLayoutFormatOptions(0), metrics: metrices, views: ["textField" : textField]))

 if previousTextField == nil {
 // Top vertical constraint
 self.scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|", options: NSLayoutFormatOptions(0), metrics: nil, views: ["textField" : textField]))
 } else {
 // Top constraint to previous view
 self.scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:-(10)-", options: NSLayoutFormatOptions(0), metrics: nil, views: ["textField" : textField, "previousTextField" : previousTextField]))
 }
 previousTextField = textField
}

if previousTextField != nil {
 // This below constraints will increase UIScrollView content size
 let constraint1 = NSLayoutConstraint.constraintsWithVisualFormat("H:|", options: NSLayoutFormatOptions(0), metrics: nil, views: ["previousTextField" : previousTextField])
 self.scrollView.addConstraints(constraint1)

 let constraint2 = NSLayoutConstraint.constraintsWithVisualFormat("V:|", options: NSLayoutFormatOptions(0), metrics: nil, views: ["previousTextField" : previousTextField])
 self.scrollView.addConstraints(constraint2)
}

}
</code></pre>

关于ios - 使用自动布局管理 UITextField 的动态位置，我们在Stack Overflow上找到一个类似的问题：
<a href="https://stackoverflow.com/questions/32517069/" rel="noreferrer noopener nofollow" style="color: red;">
https://stackoverflow.com/questions/32517069/
</a>

页: [1]

OGeek|极客世界-中国程序员成长平台's Archiver

ios - 使用自动布局管理 UITextField 的动态位置