objective-c - さまざまな色で UIBezierPath にグラデーションを適用する

Question

UIBezierPath を使用して円形の進行状況バーを開発しており、特定の値に従って塗りつぶしの色を変更したいと考えています。

塗りつぶしの色は、次のように赤から始まり、紫の色合いまで続くグラデーションです。

円弧を作成し、次のように塗りつぶしました。

// Draw the arc with bezier path
    int radius = 100;

    arc = [CAShapeLayer layer];
    arc.path = [UIBezierPath bezierPathWithArcCenter:__optimizePoint(100, 110) radius:radius startAngle:M_PI endAngle:M_PI/150 clockwise:YES].CGPath;
    if (__isScreenR4) {
        arc.position = __optimizePoint(60, 182);
    } else{
        arc.position = __optimizePoint(60, 205);
    }
    arc.fillColor = [UIColor clearColor].CGColor;
    arc.strokeColor = __colorApp.CGColor;
    arc.lineCap = kCALineCapRound;
    arc.lineWidth = 6;

    [self.view.layer addSublayer:arc];

    // Animation of the progress bar
    drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    drawAnimation.duration            = 5.0; // "animate over 10 seconds or so.."
    drawAnimation.repeatCount         = 1.0;  // Animate only once..
    drawAnimation.removedOnCompletion = YES;   // Remain stroked after the animation..
    drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
    drawAnimation.toValue   = [NSNumber numberWithFloat:1.0f];
    drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
    [arc addAnimation:drawAnimation forKey:@"drawCircleAnimation"];

グラデーションを表示するためにCAGradientLayer、次の実装で使用しました。

// Gradient of progress bar
    gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = self.view.frame;
    gradientLayer.colors = @[(__bridge id)[UIColor colorWithRed:193.0/255.0 green:13.0/255.0 blue:13.0/255.0 alpha:1.0].CGColor,(__bridge id)[UIColor colorWithRed:247.0/255.0 green:166.0/255.0 blue:0.0/255.0 alpha:1.0].CGColor,(__bridge id)[UIColor colorWithRed:255.0/255.0 green:204.0/255.0 blue:0.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:194.0/255.0 green:157.0/255.0 blue:206.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:188.0/255.0 green:154.0/255.0 blue:199.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:167.0/255.0 green:129.0/255.0 blue:185.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:158.0/255.0 green:107.0/255.0 blue:171.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:149.0/255.0 green:86.0/255.0 blue:174.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:139.0/255.0 green:74.0/255.0 blue:151.0/255.0 alpha:1.0].CGColor, (__bridge id)[UIColor colorWithRed:129.0/255.0 green:38.0/255.0 blue:140.0/255.0 alpha:1.0].CGColor ];
    gradientLayer.startPoint = CGPointMake(0,0.1);
    gradientLayer.endPoint = CGPointMake(0.5,0.2);
    [self.view.layer addSublayer:gradientLayer];
    gradientLayer.mask = arc;

ただし、コードを実行した後、左から 4 番目の紫色から始まる陰影で満たされた弧しか得られません。赤でグラデーションを開始し、最後のタイプの紫で終了する方法はありますか?

どんな助けでも大歓迎です！

どうもありがとうございました。

花崗岩