2

I have a CAGradientLayer with many color stop points. Suppose I know the point on the layer that is selected. How do I get the pixel color at that position?

I'm trying to selecting a position on the gradient, but I'm not sure how to get the pixel color of the layer at a particular point of its bounds.

Stefan Kendall
  • 66,414
  • 68
  • 253
  • 406
  • Have you had a look at http://stackoverflow.com/a/8354632/2442804 ? – luk2302 Dec 12 '15 at 15:53
  • @luk2302 I get red: 1 green: 1, blue: 1, alpha: 1. I wonder if this has anything to do with it being a gradient layer. – Stefan Kendall Dec 12 '15 at 15:59
  • Hmm, dont know, I had hoped that would not matter since you tell it to render itself into the context... will check that for myself later today. – luk2302 Dec 12 '15 at 16:04

1 Answers1

0

Check out my example, it interpolates the colors based on my UISliders position values 0<=slider.value<=1.0f. If your CAGradientLayer's start and endpoint are different, you will have to change how the mapping works out. I think for the standard start and end point the gradient goes from top left to bottom right, in which case if you think about the layer as a rectangle which the color stripes are going diagonally, all you need to do is rotate the rectangle 45 degrees and then only use the x or y positions(depending on how you rotated) which should allow you to use this method.

-(UIColor *) getColor{

/*      //My pre declared code(just for clarity)
        @property (weak, nonatomic) IBOutlet UISlider *slider;
        CAGradientLayer*  gradientLayer;
        float colorCutoff;


        gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,(__bridge id)[UIColor orangeColor].CGColor,(__bridge id)[UIColor yellowColor].CGColor,(__bridge id)[UIColor  greenColor].CGColor,
        (__bridge id)[UIColor cyanColor].CGColor,(__bridge id)[UIColor blueColor].CGColor,(__bridge id)[UIColor purpleColor].CGColor];

        //This below allows for easy one direction interpolation
        gradientLayer.startPoint = CGPointMake(0.5,0.0);
        gradientLayer.endPoint = CGPointMake(0.5,1.0f);
        colorCutoff = 1/gradientLayer.colors.count;

 *
 *
 */
float interp  = _slider.value;
// 1.0f * colors.count == index out of bounds
if(interp >= 1.0f){
    interp = .99999f;
}

// think FLOOR(float * float)
int firstColor = (interp * (float)gradientLayer.colors.count);
int secondColor = firstColor +1;


// In case we are at the last color their is not one above it(index out of bounds)
if(secondColor >= gradientLayer.colors.count){
    firstColor--;
    secondColor--;
}

// In My case the closer you are to the colorCuttoff the more the second color should have a factor
// 0 is red .14 is orange .28 is yellow and soo on
float firstInterp = 1.0f - (fmodf(interp,colorCutoff) / colorCutoff);
float secondInterp = 1.0f - firstInterp;

// make use of the gradientLayer.colors array
const CGFloat *firstCGColor = CGColorGetComponents((__bridge CGColorRef)gradientLayer.colors[firstColor]);
const CGFloat *secondCGColor = CGColorGetComponents((__bridge CGColorRef)gradientLayer.colors[secondColor]);

float red = (firstCGColor[0] * firstInterp) + secondCGColor[0] * secondInterp;
float green = (firstCGColor[1] * firstInterp) + secondCGColor[1] * secondInterp;
float blue  = (firstCGColor[2] * firstInterp) + secondCGColor[2] * secondInterp;
return [UIColor colorWithRed:red green:green blue:blue alpha:1.0f]; 
}
DevSquad
  • 1