CAShapeLayer shadow | 易学教程

问题

Given the following CAShapeLayer is it possible to add a drop shadow like the following image at the tip?

I'm using a UIBezierPath to draw the bars.

- (CAShapeLayer *)gaugeCircleLayer {

    if (_gaugeCircleLayer == nil) {

        _gaugeCircleLayer = [CAShapeLayer layer];
        _gaugeCircleLayer.lineWidth = self.gaugeWidth;
        _gaugeCircleLayer.fillColor = [UIColor clearColor].CGColor;
        _gaugeCircleLayer.strokeColor = self.gaugeTintColor.CGColor;
        _gaugeCircleLayer.strokeStart = 0.0f;
        _gaugeCircleLayer.strokeEnd = self.value;
        _gaugeCircleLayer.lineCap = kCALineCapRound;
        _gaugeCircleLayer.masksToBounds = NO;
        _gaugeCircleLayer.cornerRadius = 8.0;
        _gaugeCircleLayer.shadowRadius = 8.0;
        _gaugeCircleLayer.shadowColor = [UIColor blackColor].CGColor;
        _gaugeCircleLayer.shadowOpacity = 0.5;
        _gaugeCircleLayer.shadowOffset = CGSizeMake(0.0, 0.0);
        _gaugeCircleLayer.path = [self circlPathForCurrentGaugeStyle].CGPath;
    }

    return _gaugeCircleLayer;
}

It will need to be applied to this UIBezierPath:

- (UIBezierPath *)insideCirclePath {

    CGPoint arcCenter = CGPointMake(CGRectGetMidX(self.bounds), CGRectGetMidY(self.bounds));
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:arcCenter
                                                        radius:CGRectGetWidth(self.bounds) / 2.0f
                                                    startAngle:(3.0f * M_PI_2)
                                                      endAngle:(3.0f * M_PI_2) + (2.0f * M_PI)
                                                     clockwise:YES];


    _titleTextLabel.textColor = self.gaugeTintColor;

    return path;
}

回答1:

Very roughly:

    let arc1 = CAShapeLayer()
    arc1.lineWidth = 20.0
    arc1.path = UIBezierPath(ovalInRect: CGRectMake(10, 10, 80, 80)).CGPath
    arc1.strokeStart = 0
    arc1.strokeEnd = 0.5
    arc1.strokeColor = UIColor.grayColor().CGColor
    arc1.fillColor = UIColor.clearColor().CGColor
    layer.addSublayer(arc1)

    let cap = CAShapeLayer()
    cap.shadowColor = UIColor.blackColor().CGColor
    cap.shadowRadius = 8.0
    cap.shadowOpacity = 0.9
    cap.shadowOffset = CGSize(width: 0, height: 0)
    cap.path = UIBezierPath(ovalInRect: CGRectMake(0, 40, 20, 20)).CGPath
    cap.fillColor = UIColor.grayColor().CGColor
    layer.addSublayer(cap)

    let arc2 = CAShapeLayer()
    arc2.lineWidth = 20.0
    arc2.path = UIBezierPath(ovalInRect: CGRectMake(10, 10, 80, 80)).CGPath
    arc2.strokeStart = 0.5
    arc2.strokeEnd = 1.0
    arc2.strokeColor = UIColor.grayColor().CGColor
    arc2.fillColor = UIColor.clearColor().CGColor
    layer.addSublayer(arc2)

I think you need two arcs, and one circle for cap with shadow.

来源：https://stackoverflow.com/questions/28497384/cashapelayer-shadow

标签

ios

iphone

cashapelayer