iOS, CGGradientCreateWithColorComponets set RGBA color

Question

-(void)drawInContext:(CGContextRef)ctx{
    size_t gradLocationsNum = 2;

    CGFloat gradLocations[2] = {0.0f, 1.0f};

    CGFloat gradColors[8] = {255f,255f,255f,1f,255f,255f,255f,1f};
    //                       {R,   G,   B,  A,  R,   G,   B,  A}


    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, gradColors, gradLocations, gradLocationsNum);
    CGColorSpaceRelease(colorSpace);

    CGPoint gradCenter= CGPointMake(self.bounds.size.width/2, self.bounds.size.height/2);
    float gradRadius = MIN(self.bounds.size.width , self.bounds.size.height) ;

    CGContextDrawRadialGradient (ctx, gradient, gradCenter, 0, gradCenter, gradRadius, kCGGradientDrawsAfterEndLocation);


    CGGradientRelease(gradient);
}

I wish to have a radical gradient of two colors, any two, i don't mind. I've overridden CALayer and am returning this as a CAGradientLayer into a SubLayer of a view controller.

From the documentation, apple state:

if the color space is an RGBA color space and you want to use two colors in the gradient (one for a starting location and another for an ending location), then you need to provide 8 values in components—red, green, blue, and alpha values for the first color, followed by red, green, blue, and alpha values for the second color.

When i provide {165.0f, 42.0f, 42.0f, 1.0f, 0.0f, 100.0f, 255.0f, 1.0f} , brownish meets blueish, all i see is the outer color of blue, with white center.

Ive managed to play about and get some different colors, but they never fully correctly match up to the RGBA codes provided. How do achieve radical gradient of 2 colors specifically?

Rob Rob · Accepted Answer · 2015-04-15T10:42:59

The problem is that you are using values between 0 and 255. But when dealing with floating point colors, it's expecting values between 0.0 and 1.0 (much as you've done with alpha).

You should see the gradient you expected if you divide the values by 255:

CGFloat gradColors[8] = {165.0f / 255.0f, 42.0f / 255.0f, 42.0f / 255.0f, 1.0f, 0.0f, 100.0f / 255.0f, 255.0f / 255.0f, 1.0f} ;

iOS, CGGradientCreateWithColorComponets set RGBA color

1 Answers