动画宽度约束时，UITextField文本跳转

我正在经历一个小故障，当我的UITextField的文本在动画文本字段的宽度约束时跳转到其最终位置（它没有动画）。 看看这个gif：

点击“增长”按钮时，文本字段的宽度会增加。 但是“你好世界”会立即跳到中心，而不是在那里滑行。 点击“收缩”按钮时，“hello world”会立即跳回到左侧。

我的动画function如下：

func animateGrowShrinkTextFields(grow: Bool) { if grow { UIView.animate(withDuration: 0.5, animations: { self.widthConstraint.constant = 330 self.view.layoutIfNeeded() }, completion: nil) } else { UIView.animate(withDuration: 0.5, animations: { self.widthConstraint.constant = 100 self.view.layoutIfNeeded() }, completion: nil) } } 

我尝试过以下列表建议; 他们都没有工作。

1. 我在动画块之前和之内调用了self.helloWorldTextField.layoutIfNeeded() self.view.layoutIfNeeded()和self.helloWorldTextField.layoutIfNeeded() ，如下所示： https ： self.helloWorldTextField.layoutIfNeeded()
2. 我尝试了self.helloWorldTextField.layoutSubview和self.helloWorldTextField.layoutSubview如下所示： https ： self.helloWorldTextField.layoutSubview
3. 还尝试了setNeedsLayout() UITextField文本跳转iOS 9
4. 我甚至尝试按照此处的建议更改字体： https ： //stackoverflow.com/a/35681037/2179970
5. 我尝试了resignFirstResponder （虽然我从未在我的测试中点击或编辑文本字段，所以它不应该涉及firstResponder），如下所示： https ：//stackoverflow.com/a/33334567/2179970
6. 我尝试了子类化UITextField，如下所示： https ： //stackoverflow.com/a/40279630/2179970
7. 我也试过使用UILabel并得到了同样的跳跃结果。

以下问题也与我的非常相似，但还没有答案： 宽度约束动画时UITextfield文本位置没有动画

这是我在Github上的项目： https ： //github.com/starkindustries/ConstraintAnimationTest

Answer 1

解决方案演示

我找到了一个有效的解决方案。 它感觉有点hackish，但它的工作原理。 这是最终结果的GIF。 请注意， helloWorldTextField具有蓝色边框，以在其后面的第二个文本字段中显示其位置。

说明

制作两个文本字段： helloWorldTextField （问题中的原始文件）和borderTextField （新文本字段）。 删除helloWorldTextFields的边框和背景颜色。 保持borderTextField的边框和背景颜色。 在borderTextField居中helloWorldTextField 。 然后设置borderTextField的宽度动画。

Github链接和代码

这是Github上的项目： https ： //github.com/starkindustries/ConstraintAnimationTest

这是MyViewController类中的代码。 其他所有内容都在故事板中设置，可以在Github上面的链接上查看。

 class MyViewController: UIViewController { // Hello World TextField Border var @IBOutlet weak var borderTextFieldWidth: NSLayoutConstraint! // Button Vars @IBOutlet weak var myButton: UIButton! var grow: Bool = false func animateGrowShrinkTextFields(grow: Bool, duration: TimeInterval) { if grow { UIView.animate(withDuration: duration, animations: { self.borderTextFieldWidth.constant = 330 self.view.layoutIfNeeded() }, completion: { (finished: Bool) in print("Grow animation complete!") }) } else { UIView.animate(withDuration: duration, animations: { self.borderTextFieldWidth.constant = 115 self.view.layoutIfNeeded() }, completion: { (finished: Bool) in print("Shrink animation complete!") }) } } @IBAction func toggle(){ let duration: TimeInterval = 1.0 grow = !grow let title = grow ? "Shrink" : "Grow" myButton.setTitle(title, for: UIControlState.normal) animateGrowShrinkTextFields(grow: grow, duration: duration) } } 

注释和参考

让我得到这个解决方案的是@JimmyJames的评论：“你只是在动画UITextField宽度，但内部的内容不是动画。”

我研究了如何设置字体更改动画并遇到了这个问题： 有没有办法动画更改UILabel的textAlignment？

在那个问题中@CSmith提到“你可以动画FRAME，而不是textAlignment” https://stackoverflow.com/a/19251634/2179970

该问题中接受的答案建议在另一帧内使用UILabel。 https://stackoverflow.com/a/19251735/2179970

希望这可以帮助遇到此问题的其他人。 如果有人有其他办法解决这个问题，请发表评论或其他答案。 谢谢！