2015-12-23 3 views
0

Ссылаясь на принятый ответ нашло here Я пытаюсь осуществить это и работаю в проблему с путем CAShapeLayer кода у меня выглядит следующим образом:Реализовать рисование градиента дуги с CAShapeLayer

-(void)drawGradientArc{ 
    UIBezierPath *bezierPath = [UIBezierPath bezierPath]; 

    CAShapeLayer *circleLayer = [CAShapeLayer new]; 
    circleLayer.lineWidth = 25; 
    circleLayer.fillColor = [UIColor clearColor].CGColor; 
    circleLayer.strokeColor = [UIColor redColor].CGColor; 

    CGFloat radius = 150; 


    [bezierPath addArcWithCenter:self.view.center radius:radius startAngle:0 endAngle:M_PI clockwise:YES]; 


    CAGradientLayer *gradientLayer = [CAGradientLayer layer]; 
    gradientLayer.startPoint = CGPointMake(0,0); 
    gradientLayer.endPoint = CGPointMake(1,0); 


    NSMutableArray *colors = [NSMutableArray array]; 
    for (int i = 0; i < 10; i++) { 
     [colors addObject:(id)[[UIColor colorWithHue:(0.1 * i) saturation:1 brightness:.8 alpha:1] CGColor]]; 
    } 

    gradientLayer.colors = colors; 
    [gradientLayer setMask:circleLayer]; 

    circleLayer.path = bezierPath.CGPath; 

    [self.view.layer addSublayer:circleLayer]; 
} 

Этих будет правильно рисовать половину дуги, но путь для градиентов не задан правильно, и я не смог собраться вместе, как именно настроить код, чтобы заставить его работать с использованием градиента. Существует CGPathCreateCopyByStrokingPath, что, я думаю, мне также может потребоваться позвонить, чтобы правильно установить путь для градиента, но не был уверен, как это сделать. Любая помощь в том, как структурировать код для получения этой работы, будет оценена по достоинству. Я также включил изображение градиента, который я пытаюсь воспроизвести. a CAShapeLayer и CAGradientLayer подход был бы идеальным.

enter image description here

ответ

3

Задача 1: Ваши слои не имеют кадров. Добавьте это:

gradientLayer.frame = self.view.layer.bounds; 
circleLayer.frame = gradientLayer.bounds; 

Задача 2: Вы добавляете неправильный слой на слой вашего вида. Где у вас есть:

[self.view.layer addSublayer:circleLayer]; 

сказать вместо этого:

[self.view.layer addSublayer:gradientLayer]; 

Результат:

enter image description here

+0

Это не решит все ваши проблемы, но, по крайней мере, вы будете видеть _something_ значимый на экране, и исправление кода после этого будет довольно тривиально. – matt

+0

Используя это при настройке фреймов для gradientLayer и shapeLayer, работала точно по мере необходимости. Благодаря! – zic10

+0

Ну, это вверх тормашками от вашего рисунка. Но это должно быть легко исправить! – matt

Смежные вопросы