iPhone - Help with CGGradientCreateWithColorComponents and creating gradient as per screenshot

I am trying to apply the same gradie开发者_开发知识库nt as per the screen shot below using CGGradientCreateWithColorComponents.

This is what I'm using at the moment, however it's not quite right and I'm after a better way of trying to guess these values. I'd also like to know how to actually determine what these values are as this code was grabbed from a tutorial, which didn't explain much at all in terms of what the components are.

CGColorSpaceRef myColorspace = CGColorSpaceCreateDeviceRGB();
CGFloat components[8] = { 1, 1, 1, 1, 0.866, 0.866, 0.866, 1 };
CGFloat locations[2] = { 0.0, 1.0 };

CGGradientRef myGradient = CGGradientCreateWithColorComponents(myColorspace, components, locations, 2);

I've played around with it and got this picture:

with colors:

static const CGFloat colors [] = { 
0.894, 0.894, 0.894, 1.0, 
0.694, 0.694, 0.694, 1.0
};

using this piece of code:

- (void) drawRect:(CGRect)rect {
   CGColorSpaceRef baseSpace = CGColorSpaceCreateDeviceRGB();
   CGGradientRef gradient = CGGradientCreateWithColorComponents(baseSpace, colors, NULL, 2);
   CGColorSpaceRelease(baseSpace), baseSpace = NULL;

   CGContextRef context = UIGraphicsGetCurrentContext();
   CGContextClearRect(context, rect);
   CGContextSaveGState(context);

   CGPoint startPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMinY(rect));
   CGPoint endPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMaxY(rect));

   CGContextClip(context);
   CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);

   CGGradientRelease(gradient), gradient = NULL;

   CGContextRestoreGState(context);
   [super drawRect:rect];
 }

I dont know if it's close enough.

0.866 is an RGB as percentage divided by 100. There's a very good standard program on every mac computer located in Applications/Utilities called DigitalColor Meter. Choose RGB as Percentage in the pull down menu. Place you mouse on the color and it shows you the percentage value of red, green and blue. If it gives you R% 76.5 you use 0.765.

For further reference on CGGradient, check the developer reference

But for a quick overview the components object you have has the RGB + Alpha values for the two colors in the Gradient

Color 1= 1,1,1,1

Color 2= 0.866,0.866,0.866,1

The locations object is basically the default, so nothing special going on there

More info on the constructor you are using that should help you get a handle on the rest of it...Good Luck!

Gradient for Badges

-(void) drawRoundedRectWithContext:(CGContextRef)context withRect:(CGRect)rect{
CGFloat radius = CGRectGetMaxY(rect)*self.badgeCornerRoundness;
CGFloat puffer = CGRectGetMaxY(rect)*0.10;

CGFloat maxX = CGRectGetMaxX(rect) - puffer;
CGFloat maxY = CGRectGetMaxY(rect) - puffer;
CGFloat minX = CGRectGetMinX(rect) + puffer;
CGFloat minY = CGRectGetMinY(rect) + puffer;

CGColorSpaceRef rgb = CGColorSpaceCreateDeviceRGB();

 CGFloat locations[3] = { 0.0, 0.5, 1.0 };
 CGFloat colors[] =
 {
 255.0 / 255.0, 200.0 / 255.0, 200.0 / 255.0, 1.00,
 230 / 255.0,  0.0 / 255.0, 0.0 / 255.0, 1.00,
 190 / 255.0,  0.0 / 255.0, 0.0 / 255.0, 1.00,
 };
CGGradientRef gradient = CGGradientCreateWithColorComponents(rgb, colors, locations, 3);
CGColorSpaceRelease(rgb);

CGContextBeginPath(context);
CGContextAddArc(context, maxX-radius, minY+radius, radius, M_PI+(M_PI/2), 0, 0);
CGContextAddArc(context, maxX-radius, maxY-radius, radius, 0, M_PI/2, 0);
CGContextAddArc(context, minX+radius, maxY-radius, radius, M_PI/2, M_PI, 0);
CGContextAddArc(context, minX+radius, minY+radius, radius, M_PI, M_PI+M_PI/2, 0);
// Close the path
CGContextClosePath(context);              

CGContextSaveGState(context);
CGContextClip(context);
CGContextDrawLinearGradient(context, gradient, CGPointMake(minX,minY), CGPointMake(minX,maxY), kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation);
CGContextRestoreGState(context);

}