Question

我目前只有一个渐变颜色背景（见下文），但我想逐渐将颜色更改为我将在数组中预先定义的阴影并使其循环。我怎样才能做到这一点？

var colorTop =  UIColor(red: 255.0/255.0, green: 149.0/255.0, blue: 0.0/255.0, alpha: 1.0).cgColor
var colorBottom = UIColor(red: 255.0/255.0, green: 94.0/255.0, blue: 58.0/255.0, alpha: 1.0).cgColor

func configureGradientBackground(colors:CGColor...){
    let gradient: CAGradientLayer = CAGradientLayer()
    let maxWidth = max(self.view.bounds.size.height,self.view.bounds.size.width)
    gradient.startPoint = CGPoint(x: 0, y: 0)
    gradient.endPoint = CGPoint(x: 1, y: 1)

    let squareFrame = CGRect(origin: self.view.bounds.origin, size: CGSize(width: maxWidth, height: maxWidth * 0.935))
    gradient.frame = squareFrame

    gradient.colors = colors
    view.layer.insertSublayer(gradient, at: 0)
}

override func viewDidLoad() {
    super.viewDidLoad()
    configureGradientBackground(colors: colorTop, colorBottom)
}

Answer 1

非常简单;我无法想象你遇到了什么困难。 CAGradientLayer的colors属性本身是可动画的，因此您只需为colors的更改设置动画，并在动画结束时，继续执行colors更改的下一个动画。

在这个例子中，我只交换两组颜色，你的颜色和蓝绿色。所以我的state是一个简单的Bool。但显然这个例子可以扩展到任意数量的状态，即任意数量的颜色对。

let colorTop =  UIColor(red: 255.0/255.0, green: 149.0/255.0, blue: 0.0/255.0, alpha: 1.0).cgColor
let colorBottom = UIColor(red: 255.0/255.0, green: 94.0/255.0, blue: 58.0/255.0, alpha: 1.0).cgColor
var state = false
var grad : CAGradientLayer?
override func viewDidLoad() {
    // configure the gradient layer, start the animation        
}
func animate() {
    let arr = self.state ? [colorTop,colorBottom] : [UIColor.green.cgColor,UIColor.blue.cgColor]
    self.state = !self.state
    let anim = CABasicAnimation(keyPath: "colors")
    anim.duration = 10 // or whatever
    anim.fromValue = self.grad!.colors
    anim.toValue = arr
    anim.delegate = self
    self.grad?.add(anim, forKey: nil)
    DispatchQueue.main.async {
        CATransaction.setDisableActions(true)
        self.grad?.colors = arr
    }
}
func animationDidStop(_ anim: CAAnimation, finished flag: Bool) {
    DispatchQueue.main.async {
        self.animate()
    }
}

Answer 2

你的viewDidLoad中可能有一个变量，它是一个跟踪包含所有颜色的数组索引的int。例如，0是您的第一种颜色，1是您的第二种颜色，依此类推。然后在你的无限循环中（也在viewDidLoad中），你可以写：

if tracker == 0 {
   // apply first color
} else if tracker == 1{
   // apply second color
} ...

然后，您可以在最后将跟踪器增加1，然后检查您的跟踪器是否超过阵列的大小（例如，您只有11种颜色）。

tracker += 1
if tracker > 10 {
   tracker = 0
}

如何不断改变渐变色背景？

2 个答案: