为包含 CAGradientLayer 的 UIView 设置动画

Question

我想修改具有 gradientLayer 的视图的宽度，但是当我添加渐变层时，这会阻止动画。

我给你看我的代码：

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    animateProgressBar(leftPourcentage : 64)
    addGradientBarColor()
}

func addGradientBarColor(leftPourcentage : CGFloat){
    let leftColor = UIColor(rgb: 0x00ABBD)
    let rightColor = UIColor(rgb : 0x00DAFF)
    let gradientLayer = CAGradientLayer()
    gradientLayer.colors = [leftColor.cgColor,
                            rightColor.cgColor]

    gradientLayer.startPoint = CGPoint(x: 0, y: 0.5)
    gradientLayer.endPoint = CGPoint(x: 1, y: 0.5)
    gradientLayer.frame = CGRect.init(
        x: userBarLeft.bounds.origin.x,
        y: userBarLeft.bounds.origin.y,
        width: userBarLeft.frame.width,
        height: userBarLeft.frame.height)
    gradientLayer.masksToBounds = false
    gradientLayer.cornerRadius = 2
    userBarLeft.layer.insertSublayer(gradientLayer, at: 0)
}

func animateProgressBar(leftPourcentage : CGFloat){
    let widthOfTotalBarLeft = totalBarLeft.bounds.size.width

    leftBarWidthConstr.constant = widthOfTotalBarLeft * (leftPourcentage / 100)
    UIView.animate(withDuration: 2) {
        self.view.layoutIfNeeded()
    } 
}

这个给我看：

没有动画作品。

当我删除 addGradientBarColor 函数时，这告诉我：

我想要动画但带有渐变。我怎样才能做到这一点？

Answer 1

这是因为您将渐变宽度设置为

width: userBarLeft.frame.width,

就这样吧

width:0,

并为其宽度设置动画