自定义UITextField占位符左约束动画卡顿问题求助

嘿，我看了你这段自定义UITextField的代码，发现几个关键问题导致占位符右移时动画卡顿，咱们一步步来修复：

问题诊断 #

1. 初始Bounds取值不准确：在init(coder:)和addConstraints()阶段，你的UITextField还没有完成布局，self.bounds.width拿到的可能是xib/storyboard里的初始占位尺寸，不是最终显示在屏幕上的实际宽度。这会导致你计算的目标偏移量self.bounds.width - self.bounds.width/3和实际需要的数值不符，动画时Auto Layout会做额外的调整，造成卡顿。

2. 约束冲突风险：你同时给placeholderLabel设置了left和right约束，当你把left的constant改成接近right的位置时，两个约束会产生冲突（比如left偏移后，label的左边缘加上自身宽度会超过textField的右边缘）。Auto Layout会自动调整约束优先级，这个过程会让动画变得不流畅。

3. 视图层级操作错误：self.bringSubview(toFront: self)这行代码完全没有意义——你不能把视图本身提到自己的子视图前面，反而可能干扰系统的渲染逻辑，影响动画流畅度。

修复后的代码 #

1. 调整约束设置（改用Anchor语法更清晰） #

首先修改addConstraints()方法，移除冲突的right约束，改用宽度约束来控制placeholderLabel的尺寸：

lazy var leftConstraint: NSLayoutConstraint! = placeholderLabel.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 0)

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    self.delegate = self
    self.addSubview(placeholderLabel)
    // 删掉没用的 self.bringSubview(toFront: self)
    addConstraints()
}

func addConstraints() {
    placeholderLabel.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        placeholderLabel.heightAnchor.constraint(equalTo: self.heightAnchor),
        placeholderLabel.widthAnchor.constraint(equalTo: self.widthAnchor), // 用宽度约束替代right约束
        leftConstraint
    ])
}

2. 确保获取正确的Bounds尺寸 #

重写layoutSubviews()方法，保证在控件布局完成后，我们拿到的是实际显示尺寸：

override func layoutSubviews() {
    super.layoutSubviews()
    // 这里可以做一些需要实时尺寸的调整，比如如果placeholderLabel的高度需要动态更新
    placeholderLabel.heightAnchor.constraint(equalTo: self.heightAnchor).isActive = true
}

3. 修正动画和代理方法 #

在编辑开始时，实时获取当前的bounds宽度来计算目标偏移量，同时修正视图层级操作：

func textFieldDidBeginEditing(_ textField: UITextField) {
    // 用当前实际的bounds宽度计算目标偏移
    let targetConstant = self.bounds.width - self.bounds.width/3
    animate(constant: targetConstant)
    self.bringSubview(toFront: placeholderLabel)
}

func textFieldDidEndEditing(_ textField: UITextField) {
    guard textField.text?.isEmpty == true else { return }
    animate(constant: 0)
    // 结束编辑后把占位符放到后面，让输入内容显示在前面
    self.sendSubviewToBack(placeholderLabel)
}

func animate(constant: CGFloat) {
    self.leftConstraint.constant = constant
    UIView.animate(withDuration: 0.15) {
        self.layoutIfNeeded()
    }
}

额外建议 #

• 尽量使用Auto Layout的Anchor语法，比旧的NSLayoutConstraint(item:...)API更易读，也更少出错。
• 动画时不要在闭包里做除了layoutIfNeeded()之外的操作，避免额外的计算影响流畅度。
• 如果需要更平滑的动画，可以适当增加动画时长（比如0.25秒），或者加入UIView.AnimationOptions.curveEaseInOut选项。

内容的提问来源于stack exchange，提问作者Sergio Trejo