ios - 如何在编辑时为 UITableViewCell 设置动画？

Question

当用户点击表格 View 的编辑按钮时，您如何为表格 View 单元格中的颜色变化设置动画？

点击编辑按钮时，Apple 的动画会将所有单元格的内容向右移动，以在每个单元格中显示删除或插入按钮。我想添加我自己的动画，这些动画与 Apple 的动画同时出现。我已经设法为单元格布局设置了动画，但没有更改颜色。

这就是我正在做的:

override func willTransition(to state: UITableViewCellStateMask) {
    super.willTransition(to: state)

    let willEdit = state.contains(.showingEditControlMask)

    toDateDaysLayoutConstraint.constant = willEdit ? 5.0 : 25.0
    daysNightsLayoutConstraint.constant = willEdit ? 5.0 : 10.0

    toDateTextView.textColor = willEdit ? UIColor.red : UIColor.darkText
    daysLabel.backgroundColor = willEdit ? UIColor.cyan : UIColor.clear        
}

需要明确的是，上面的 layoutConstraint 会正确地改变动画，但是颜色会在没有动画的情况下瞬间改变。

我还尝试使用 UIView block 动画为颜色设置动画，如下所示:

    UIView.animate(withDuration: 5.0) { 
        self.toDateTextView.textColor = willEdit ? UIColor.red : UIColor.darkText
        self.daysLabel.backgroundColor = willEdit ? UIColor.cyan : UIColor.clear
    }

但是，我永远无法获得动画的颜色。我试过将上面的代码放在willTransition(to state:)、setEditing(_ editing: animated:)，甚至是layoutSubviews() .我也在表 Controller 方法中尝试过。但是，没有任何效果。

---

更新

到现在为止，我还尝试过将所有内容都包装在 CATransaction.begin() 和 CATransaction.commit() 之间，也只使用图层动画，甚至将在调用 super 之后，在 didTransition 中 commit。什么都不管用。

我想知道，是否可以与 Apple 的动画同时制作任何不是布局动画的动画？

Answer 1

据我了解，您只能为 UIView 的“可动画化”属性设置动画(参见 this list )。 textColor 不在其中。我已经在适当的位置使用了 UIView.transition(with:duration:options:animations) 并且文本颜色正确地“动画化”了:

override func willTransition(to state: UITableViewCellStateMask) {

    super.willTransition(to: state)

    UIView.transition(with: textLabel!, duration: 5.0, options: .transitionCrossDissolve, animations: {
        self.textLabel?.textColor = state.rawValue == 1 ? UIColor.red : UIColor.black
    })
}

---

编辑 1

根据您的评论，我已成功重现该问题。我通过覆盖 didTransition(to:) 而不是 willTransition(to:) 为 UILabel 修复了它。所以我们首先等待 View 调整大小(因为出现删除按钮)然后我们制作动画。但是，这对于 UITextView 效果不是很好，除非您确保它具有固定大小。

class TableViewCell: UITableViewCell {

    @IBOutlet weak var textView: UITextView!
    @IBOutlet weak var label: UILabel!

    override func didTransition(to state: UITableViewCellStateMask) {

        super.didTransition(to: state)

        UIView.transition(with: textView, duration: 3, options: .transitionCrossDissolve, animations: {
            self.textView.textColor = state.rawValue == 1 ? UIColor.red : UIColor.black
        })

        UIView.transition(with: label, duration: 3, options: .transitionCrossDissolve, animations: {
            self.label.backgroundColor = state.rawValue == 1 ? UIColor.red : UIColor.white
        })
    }
}

---

编辑 2

如果您需要调整 TextView 的大小，则异步执行动画:

DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
    UIView.transition(with: self.textView, duration: 3, options: .transitionCrossDissolve, animations: {
        self.textView.textColor = state.rawValue == 1 ? UIColor.red : UIColor.black
    })
}

顺便说一下，我也尝试过子类化 UITextView 并覆盖 layoutSubviews 但它没有工作...