如何在 iOS 上绘制嵌套的径向渐变？答案

【问题标题】：How can I draw nested radial gradients on iOS?如何在 iOS 上绘制嵌套的径向渐变？
【发布时间】：2013-04-17 16:30:39
【问题描述】：

我正在使用最新的 SDK 开发 iOS 5.0+ 应用程序。

我想做类似的事情

我想知道如何嵌套径向渐变。

这是我现在的代码：

- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)context
{
    _innerColor = [UIColor yellowColor];
    _outerColor = [UIColor redColor];

    CGContextSetAllowsAntialiasing(context, true);
    CGContextSetShouldAntialias(context, true);
    
    CGFloat graWidth = layer.frame.size.width / 2;
    CGFloat graHeight = layer.frame.size.height / 2;

    CGFloat firstGlossLocation = 0.0f;
    CGFloat outterPercent = 0.0f;
    
    if (_isUnSelected)
    {
        firstGlossLocation = 0.7f;
        outterPercent = graWidth * 0.0f;
    }
    else
    {
        firstGlossLocation = 0.0f;
        outterPercent = graWidth * 0.25f;
    }
    
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    
    CGFloat iRed = 0.0, iGreen = 0.0, iBlue = 0.0, iAlpha =0.0;
    [_innerColor getRed:&iRed green:&iGreen blue:&iBlue alpha:&iAlpha];
    
    CGFloat oRed = 0.0, oGreen = 0.0, oBlue = 0.0, oAlpha =0.0;
    [_outerColor getRed:&oRed green:&oGreen blue:&oBlue alpha:&oAlpha];
    
    CGFloat gradientColors[] = {
        oRed, oGreen, oBlue, oAlpha,
        iRed, iGreen, iBlue, iAlpha
    };
    
    // We have to change first value when user taps over the Guage.
    // The second one must one to fill the entire Gauge.
    CGFloat glossLocations[] = {firstGlossLocation, 1};
    CGGradientRef ballGradient = CGGradientCreateWithColorComponents(colorSpace, gradientColors, glossLocations, 2);
    
    CGContextAddEllipseInRect(context, CGRectMake(0, 0, graWidth*2, graHeight*2));
    CGContextClip(context);
    
    CGPoint startPoint = CGPointMake(graWidth, graHeight);
    CGPoint endPoint = CGPointMake(graWidth, graHeight);
    CGContextDrawRadialGradient(context, ballGradient, startPoint, 0, endPoint, graWidth - outterPercent, kCGGradientDrawsAfterEndLocation);
    CGContextDrawPath(context, kCGPathStroke);
}

当_isUnSelected 为NO 时，我想绘制第二个渐变。

你知道如何绘制第二个嵌套渐变吗？

【问题讨论】：

感谢您投反对票并告诉您为什么这样做。
多么奇怪的反对票。有人会认为这个问题有什么问题吗？
+1 回答一个有趣的问题

标签： ios objective-c core-graphics quartz-2d

【解决方案1】：

您不需要“第二个嵌套渐变”来绘制插图中显示的渐变。那是 one 渐变。渐变可以在多个位置具有多种颜色，这就是我们在该插图中看到的。它似乎有四种颜色/点。

因此，当绘图需要更改时，只需将第一个渐变（简单的两点渐变）替换为第二个渐变（具有四种颜色/点），反之亦然。

【讨论】：

感谢您的回答。你有什么我可以效仿的例子吗？
你自己的代码很棒；您已经编写了自己的示例。唯一的区别是你有一个 2 元素 glossLocations 数组（以及一个 8 元素 gradientColor 数组）。只需将其更改为 4 元素 glossLocations 数组（和 16 元素 gradientColor 数组）即可。呸呸呸呸呸。