ios - CAGradientLayer 在 4 个不同的角上有 4 种颜色

Question

是否可以在 iOS 中创建一个具有 4 种不同颜色的渐变(我使用的是 Swift，但 Objective-C 中的示例也可能有帮助)，但每种颜色都从不同的角发出？

我创建了一个渐变，根据我可以放置颜色的位置，它可以是左上角->右下角或左下角->右上角，但这仅适用于 2 种颜色。这是我为此尝试的代码:

let gradientColors: Array <AnyObject> = [bottomColor1.CGColor, topColor2.CGColor]
let gradientLayer: CAGradientLayer = CAGradientLayer()
gradientLayer.colors = gradientColors
gradientLayer.locations = gradientLocations
gradientLayer.startPoint = CGPointMake(0.0, 1.0);
gradientLayer.endPoint = CGPointMake(1.0, 0.0);

这成功地创建了一个从一个角到另一个角的 2 色渐变，其中 bottomColor1 和 topColor2 是 UIColor。但是，我如何在另外两个角创建一个带有 2 种额外颜色的类似渐变？

Answer 1

感谢@Martin R 的建议，这里有一些代码可以创建看起来效果很好的混合。由于有太多颜色，中间变得很暗，但最终得到了预期的效果:

let gradientColors: Array <AnyObject> = [topColor1.CGColor, UIColor.clearColor().CGColor]
let gradientLocations: Array <AnyObject> = [0.0, 1.0]
let gradientLayer: CAGradientLayer = CAGradientLayer()
gradientLayer.colors = gradientColors
gradientLayer.locations = gradientLocations
gradientLayer.startPoint = CGPointMake(0.0, 0.0);
gradientLayer.endPoint = CGPointMake(1.0, 1.0);

let gradientColors2: Array <AnyObject> = [bottomColor1.CGColor, UIColor.clearColor().CGColor]
let gradientLayer2: CAGradientLayer = CAGradientLayer()
gradientLayer2.colors = gradientColors2
gradientLayer2.locations = gradientLocations
gradientLayer2.startPoint = CGPointMake(0.0, 1.0);
gradientLayer2.endPoint = CGPointMake(1.0, 0.0);


let gradientColors3: Array <AnyObject> = [UIColor.clearColor().CGColor, topColor2.CGColor]
let gradientLayer3: CAGradientLayer = CAGradientLayer()
gradientLayer3.colors = gradientColors3
gradientLayer3.locations = gradientLocations
gradientLayer3.startPoint = CGPointMake(0.0, 0.0);
gradientLayer3.endPoint = CGPointMake(1.0, 1.0);

let gradientColors4: Array <AnyObject> = [UIColor.clearColor().CGColor, bottomColor2.CGColor]
let gradientLayer4: CAGradientLayer = CAGradientLayer()
gradientLayer4.colors = gradientColors4
gradientLayer4.locations = gradientLocations
gradientLayer4.startPoint = CGPointMake(0.0, 1.0);
gradientLayer4.endPoint = CGPointMake(1.0, 0.0);

根据 Martin 的建议，我创建了 4 个渐变，每个渐变从所需角的颜色到 UIColor.clearColor()，然后我设置了 startPoint/ endPoint 相应地从左下角到右上角或从左上角到右下角。

在这段代码之后，我简单地将所有这些渐变层添加到我的 blendView 中，所有这些都具有相同的框架:

let background1 : CAGradientLayer = gradientLayer;
background1.frame = blendViewFrame;
let background2 : CAGradientLayer = gradientLayer2;
background2.frame = blendViewFrame;
let background3 : CAGradientLayer = gradientLayer3;
background3.frame = blendViewFrame;
let background4 : CAGradientLayer = gradientLayer4;
background4.frame = blendViewFrame;
blendView.layer.insertSublayer(background1, atIndex: 0)
blendView.layer.insertSublayer(background2, atIndex: 1)
blendView.layer.insertSublayer(background3, atIndex: 2)
blendView.layer.insertSublayer(background4, atIndex: 3)

所以最后，可以用 4 种不同的颜色绘制一个 4 角渐变...中间变得很暗，但上面是如何做的。