Question

我使用 CAShaperLayer 和 UIBezierPath 制作了半圈？

如下所示

clockWiseLayer = [[CAShapeLayer alloc] init];

CGFloat startAngle = -M_PI_2;
CGFloat endAngle = M_PI + M_PI_2;

CGFloat width = CGRectGetWidth(imageView.frame)/2.0f;
CGFloat height = CGRectGetHeight(imageView.frame)/2.0f;
CGPoint centerPoint = CGPointMake(width, height);

float radius = CGRectGetWidth(imageView.frame)/2+7;

clockWiseLayer.path = [UIBezierPath bezierPathWithArcCenter:centerPoint
                                                    radius:radius
                                                startAngle:startAngle
                                                  endAngle:endAngle
                                                 clockwise:YES].CGPath;

clockWiseLayer.fillColor = [UIColor clearColor].CGColor;
clockWiseLayer.strokeColor = [UIColor blueColor].CGColor;
clockWiseLayer.borderColor = [UIColor greenColor].CGColor;
clockWiseLayer.backgroundColor = [UIColor grayColor].CGColor;

clockWiseLayer.strokeStart = 0.0f;
clockWiseLayer.strokeEnd = 0.5f;

clockWiseLayer.lineWidth = 2.0f;
clockWiseLayer.borderWidth = 5.0f;

clockWiseLayer.shouldRasterize = NO;
[imageView.layer addSublayer:clockWiseLayer];

在这里，笔触颜色显示 bluecolor ，如何从头到尾放置自定义颜色的阴影，或者像开始时一样，它必须更蓝，而不是随着它返回，它变得更少蓝色或发白。

在其他方法中，我可以使用 UIImage 代替它。如何在这个stokeColor上放置UIImage。

感谢。

Answer 1

这是一个有效的解决方案：

它一直围绕着圆圈，但是你得到了这个想法，它是一个渐变中风：

从宏开始：

#define   DEGREES_TO_RADIANS(degrees)  ((M_PI * degrees)/ 180)


UIImageView * shff = [UIImageView new];
    [shff setImage:[UIImage imageNamed:@"REPLACE_WITH_YOUR_IMAGE"]];
    [shff setBackgroundColor:[UIColor whiteColor]];
    [shff setClipsToBounds:true];
    [shff.layer setCornerRadius:SCREEN_HEIGHT/6];
    [shff setFrame:CGRectMake(SCREEN_HEIGHT/3/2, 100, SCREEN_HEIGHT/3, SCREEN_HEIGHT/3)];
    [self.view addSubview:shff];

    int radius = shff.frame.size.width/2+7;

    CAShapeLayer *arc = [CAShapeLayer layer];
    arc.path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(shff.center.x, shff.center.y) radius:radius startAngle:DEGREES_TO_RADIANS(-90) endAngle:DEGREES_TO_RADIANS(90) clockwise:YES].CGPath;


    arc.fillColor = [UIColor clearColor].CGColor;
    arc.strokeColor = [UIColor purpleColor].CGColor;
    arc.lineWidth = 15;
    CABasicAnimation *drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    drawAnimation.duration            = 45.0;
    drawAnimation.repeatCount         = 1.0;
    drawAnimation.removedOnCompletion = NO;
    drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
    drawAnimation.toValue   = [NSNumber numberWithFloat:1.0f];
    drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
    [arc addAnimation:drawAnimation forKey:@"drawCircleAnimation"];

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = self.view.frame;
    gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,(__bridge id)[UIColor blueColor].CGColor ];
    gradientLayer.startPoint = CGPointMake(0,0.5);
    gradientLayer.endPoint = CGPointMake(1,0.5);

    [self.view.layer addSublayer:gradientLayer];

    gradientLayer.mask = arc;

截图：

我刚刚更改了我的答案，所以现在它可以工作，只需使用度数弧度宏。此外，我刚刚为解决方案添加了一个圆形线帽，并更改了开始和结束动画％帧。现在这应该顺利进行。

我做了一个不同的解决方案，只是为了Sh％ts和咯咯笑。这是使用发射器层的新解决方案：

-(void)doGradientoutline {
    UIImageView * imageView = [UIImageView new];
    [imageView setImage:[UIImage imageNamed:@"df"]];
    [imageView setFrame:CGRectMake(SCREEN_WIDTH/2-imageView.image.size.width*3/2, SCREEN_HEIGHT/4, imageView.image.size.height*3, imageView.image.size.height*3)];
    [imageView setClipsToBounds:true];
    [imageView.layer setCornerRadius:imageView.frame.size.width/2];
    [self.view addSubview:imageView];

    int radius = imageView.frame.size.width/2+7;

    CAShapeLayer *arc = [CAShapeLayer layer];
    arc.path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(imageView.center.x, imageView.center.y) radius:radius startAngle:DEGREES_TO_RADIANS(0) endAngle:DEGREES_TO_RADIANS(360) clockwise:YES].CGPath;

    arc.fillColor = [UIColor clearColor].CGColor;
    arc.strokeColor = [UIColor purpleColor].CGColor;
    arc.lineWidth = 15;
    [arc setLineCap:@"round"];

    CAEmitterLayer * _myEmitter = [CAEmitterLayer layer];

    _myEmitter.emitterPosition = CGPointMake(self.view.frame.size.width/2, self.view.frame.size.height/2);
    _myEmitter.emitterSize = CGSizeMake(1.0,1);
    _myEmitter.emitterMode = kCAEmitterLayerPoints;
    _myEmitter.emitterShape = kCAEmitterLayerSphere;
    _myEmitter.renderMode = kCAEmitterLayerOldestFirst;
    _myEmitter.shadowOpacity = 0.0;
    _myEmitter.shadowRadius = 0.0;
    _myEmitter.shadowOffset = CGSizeMake(-10.0,-10);
    _myEmitter.shadowColor = [[UIColor colorWithRed:1.00 green:1.00 blue:0.99 alpha:1.0] CGColor];

    CAEmitterCell * _myCell = [CAEmitterCell emitterCell];
    _myCell = [CAEmitterCell emitterCell];
    _myCell.name = @"_myCell";
    _myCell.beginTime = CACurrentMediaTime();
    _myCell.birthRate = 80;
    _myCell.lifetime = 8.0;
    _myCell.color = [[UIColor colorWithRed:0.1000 green:0.00 blue:0.5000 alpha:1.00] CGColor];
    _myCell.redSpeed = 1.10;
    _myCell.blueSpeed = 1.10;
    _myCell.alphaSpeed = 0;
    _myCell.redRange = 0.0;
    _myCell.blueRange = 0.0;
    _myCell.alphaRange = 0.0;
    _myCell.contents = (id)[[UIImage imageNamed:@"ffd.png"] CGImage];
    _myCell.emissionRange = 0.00;
    _myCell.emissionLatitude = 0.00;
    _myCell.emissionLongitude = 0.00;
    _myCell.velocity = 0.00;
    _myCell.velocityRange = 0.00;
    _myCell.spin = 2*M_PI;
    _myCell.spinRange = 2*M_PI;
    _myCell.scale = 1.5/ [[UIScreen mainScreen] scale];
    _myCell.scaleSpeed = 0.00;
    _myCell.scaleRange = 0.0;
    _myEmitter.emitterCells = [NSArray arrayWithObject:_myCell];

    CAKeyframeAnimation *particleAnimation = [CAKeyframeAnimation animationWithKeyPath:@"emitterPosition"];
    [particleAnimation setPath:arc.path];
    [particleAnimation setDuration:8.0];
    [particleAnimation setRepeatCount:HUGE_VAL];
    [particleAnimation setCalculationMode:kCAAnimationPaced];
    [_myEmitter addAnimation:particleAnimation forKey:@"yourAnimation"];

    CABasicAnimation *drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    drawAnimation.duration            = 1.50;
    drawAnimation.repeatCount         = 1.0;
    drawAnimation.removedOnCompletion = NO;
    drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
    drawAnimation.toValue   = [NSNumber numberWithFloat:1.f];
    drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

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

您必须下载此图片并将其存储在捆绑包中以使其正常工作，这不是标准图片，它使用Adobe Illustrator使用几层余光，这是部分原因之一发射器发光并改变颜色，只需单击下面的紫色模糊图像，您就可以右键单击并保存然后导入到项目中。在viewDidAppear中调用上面的方法，无法查看它是如何工作的，祝你好运：

新结果：

如何使用UIBezierPath的自定义映像

1 个答案: