blabus blabus - 9 months ago 63
iOS Question

Calculate the color at a given point on a gradient between two colors?

So this is essentially the method I would like to write (in Objective-C/Cocoa, using

, but I'm really just interested in the underlying math):

+ (UIColor *)colorBetweenColor:(UIColor *)startColor andColor:(UIColor *)endColor atLocation:(CGFloat)location;

So as an example, say I have two colors, pure red and pure blue. Given a linear gradient between the two, I want to calculate the color that's at, say, the 33% mark on that gradient:

So if I were to call my method like so:

UIColor *resultingColor = [UIColor colorBetweenColor:[UIColor redColor] andColor:[UIColor blueColor] atLocation:0.33f];

I would get the resulting color at 'B', and similarly, passing
as the location would return color 'A', and
would return color 'C'.

So basically my question is, how would I go about mixing the RGB values of two colors and determining the color at a certain 'location' between them?

Answer Source

You simply linearly interpolate the red, the green, and the blue channels like this:

double resultRed = + percent * ( -;
double resultGreen = + percent * ( -;
double resultBlue = + percent * ( -;

where percent is a value between 0 and 1 (location in your first method prototype).