Is there any chance for adding middle color for gradient?

[bhumesh]

Thank for the library. As per my requirement I need to give 3 colors, Start Color, Middle Color and End color for gradient layer. Is there any possibility to add multiple layer gradient?

[KatekovAnton]

Hi. Yes thats possible. Just add one more interpolation interval In SFCircleGradientLayer.m in method
- (void)drawWithSegmentNumber:(int)segmentCount context:(CGContextRef)ctx

[bhumesh]

Thanks for replying. I have tried by adding another property middleColor and increase segmentCount to 24, but I didn't succeed to apply middleColor in below method:

 UIColor *toColor = [UIColor colorWithRed:f * c2[0] + (1 - f) * c1[0]
                                          green:f * c2[1] + (1 - f) * c1[1]
                                           blue:f * c2[2] + (1 - f) * c1[2]
                                          alpha:f * c2[3] + (1 - f) * c1[3]];

[KatekovAnton]

It should looks like this:

for(int i = 0; i < segmentCount/2; ++i)
    {
       // interpolate from 1st to 2nd color
    }

for(int i = segmentCount/2; i < segmentCount; ++i)
    {
       // interpolate from 2nd to 3rd color
    }

Or kind of

[bhumesh]

I have tried as per your suggestion and modified method as below:
`- (void)drawWithSegmentNumber:(int)segmentCount context:(CGContextRef)ctx
{
CGRect bounds = self.bounds;
CGPoint centerPoint = CGPointMake(CGRectGetMidX(bounds), CGRectGetMidY(bounds));

CGFloat c1[4];
[_startColor getRed:&c1[0] green:&c1[1] blue:&c1[2] alpha:&c1[3]];
CGFloat c12[4];
[_middleColor getRed:&c12[0] green:&c12[1] blue:&c12[2] alpha:&c12[3]];
CGFloat c2[4];
[_endColor getRed:&c2[0] green:&c2[1] blue:&c2[2] alpha:&c2[3]];

UIColor *fromColor = self.startColor;
float endAngle = self.startAngle + (self.endAngle - self.startAngle) * self.progress;
for(int i = 0; i < segmentCount/2; ++i)
{
    float f_cur = (float)(i) / segmentCount;
    float f = (float)(i + 1) / segmentCount;
    
    UIColor *toColor = [UIColor colorWithRed:f * c12[0] + (1 - f) * c1[0]
                                       green:f * c12[1] + (1 - f) * c1[1]
                                        blue:f * c12[2] + (1 - f) * c1[2]
                                       alpha:f * c12[3] + (1 - f) * c1[3]];
    
    float fromAngleCur = self.startAngle + f_cur * (endAngle - self.startAngle);
    float toAngleCur = self.startAngle + f * (endAngle - self.startAngle);
    [self drawSegmentAtCenter:centerPoint from:fromAngleCur to:toAngleCur radius:_circleRadius width:_circleWidth
                   startColor:fromColor endColor:toColor context:ctx];
    
    fromColor = toColor;
}

for (int i = segmentCount/2; i< segmentCount; ++i) {
    float f_cur = (float)(i) / segmentCount;
    float f = (float)(i + 1) / segmentCount;
    
    UIColor *toColor = [UIColor colorWithRed:f * c2[0] + (1 - f) * c12[0]
                                       green:f * c2[1] + (1 - f) * c12[1]
                                        blue:f * c2[2] + (1 - f) * c12[2]
                                       alpha:f * c2[3] + (1 - f) * c12[3]];
    
    float fromAngleCur = self.startAngle + f_cur * (endAngle - self.startAngle);
    float toAngleCur = self.startAngle + f * (endAngle - self.startAngle);
    [self drawSegmentAtCenter:centerPoint from:fromAngleCur to:toAngleCur radius:_circleRadius width:_circleWidth
                   startColor:fromColor endColor:toColor context:ctx];
    
    fromColor = toColor;
}

}`

ending result is like:

You can see there is not much middle color presence. Is something I am missing which need be added?

[KatekovAnton]

Oh.. check your interpolation code:

float f_cur = (float)(i) / segmentCount;
    float f = (float)(i + 1) / segmentCount;

at least you should divide to segmentCount/2, overall value of f and f_cur should go from 0 to 1... please debug

[bhumesh]

I gave couple of try but nothing working for me.