Cross-Dissolve 过渡会立即改变 - Swift 3.0

Question

我正在尝试使用交叉溶解动画更改按钮背景的颜色，但是，每当我运行这样做时，它会立即更改颜色，而不是平滑过渡。

UIView.transition(with: self.SignIn,
                  duration:3,
                  options: UIViewAnimationOptions.transitionCrossDissolve,
                  animations: { self.SignIn.backgroundColor? = UIColor(hexaString: "#" + hex) },
                  completion: nil)

Answer 1

我没有在 animations 块中设置 backgroundColor，而是在视图 transition 之前设置它，然后启动视图 transition，它将完美地工作。

self.btnAnimate.backgroundColor = UIColor.red
UIView.transition(with: self.btnAnimate,
                  duration: 3,
                  options: .transitionCrossDissolve,
                  animations: nil,
                  completion: nil)

输出

注意：我已经将red颜色设置为backgroundColor你可以设置任何你想要的颜色。

Answer 2

发生这种情况是因为您的动画与默认按钮动画冲突。

要解决此问题，您可以创建 UIButton 的自定义子 class：

import UIKit

class CustomButton: UIButton {

    func animateButton(hex: String) {

        // This block disables the default animations
        UIButton.performWithoutAnimation {

            // This is where you define your custom animation
            UIView.transition(with: self, duration:3, options: UIViewAnimationOptions.transitionCrossDissolve, animations: {
                self.backgroundColor? = UIColor(hexaString: "#" + hex) }, completion: nil)

            // You must call layoutIfNeeded() at the end of the block to prevent layout problems
            self.layoutIfNeeded()
        }
    }

}

然后调用这个函数：

signInButton.animateButton("ffffff") // Pass in your hex string

当然，请务必将故事板上的 loginButton 的 class 从 UIButton 更改为 CustomButton。

这种方法的缺点是在动画过程中文本仍然变暗。可能有一种方法可以覆盖它（我无法快速确定如何），因此此解决方案的另一种方法是使用 UILabel 而不是 UIButton 并设置点击监听器。

或者您可能想要考虑的另一种方法是将 customLabel 放在 UIButton 后面，并在单击按钮时在标签上执行动画。虽然这种方法看起来有点 "hacky"，但优点是在标签动画时按钮不会被禁用，这意味着你可以注册快速连续的按钮按下（虽然看起来你的按钮的目的是记录用户在，在这种情况下，这对您来说可能不是必需的）。

Cross-Dissolve 过渡会立即改变 - Swift 3.0

Cross-Disolve transition just changes instantly - Swift 3.0

uiviewanimation

uiviewanimationtransition

swift

swift3