Question

我试图在每个切片的中心绘制一个带有分段数组和图像的饼图，我已经绘制了饼图，但无法将图像添加到cashapelayer.I参考以下帖子Swift: Add image to CAShapeLayer，但它没有解决我的问题。

这就是我的尝试。

override func draw(_ rect: CGRect) {
        //let context = UIGraphicsGetCurrentContext()
        let radius = min(frame.size.width,frame.size.height) * 0.5;
        let viewCenter = CGPoint(x: frame.size.width * 0.5, y: frame.size.height * 0.5)
        let valueCount = segments.reduce(0){ $0 + $1.value}
        var startAngle = -CGFloat(M_PI / 2)

        for segment in segments {
           let endAngle = startAngle + CGFloat(M_PI * 2) * (segment.value)/valueCount

            /*context?.move(to: CGPoint(x: viewCenter.x, y: viewCenter.y))
            context?.setFillColor(segment.color.cgColor)
            context?.setStrokeColor(UIColor.black.cgColor)
            context?.setLineWidth(3.0)
            context?.addArc(center: viewCenter, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: false)
            context?.fillPath()*/

            let pieSliceLayer = CAShapeLayer()
            let slicePath = UIBezierPath(arcCenter: viewCenter, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: false)
            pieSliceLayer.path = slicePath.cgPath
            pieSliceLayer.fillColor = segment.color.cgColor
            self.layer.addSublayer(pieSliceLayer)

            let halfAngle = startAngle + (endAngle - startAngle) * 0.5;
            let imagePositionValue = CGFloat(0.67)
            let segmentCenter = CGPoint(x:viewCenter.x+radius*imagePositionValue*cos(halfAngle),y:viewCenter.y+radius*imagePositionValue*sin(halfAngle))

            //If image is associated , add the image to the section
            let imageLayer = CAShapeLayer()
            let image = UIImage(named: segment.imageName)
            imageLayer.contents = image?.ciImage
            imageLayer.frame = CGRect(x: segmentCenter.x - 20, y: segmentCenter.y - 20, width: 20, height: 20)
            self.layer.addSublayer(imageLayer)
            startAngle = endAngle

        }
    }

我在Objective-C中尝试了类似的东西，它运行正常，

CALayer *imageLayer = (CALayer *)[[pieLayer sublayers] objectAtIndex:0];
    //Adding image
    CALayer *layer = [CALayer layer];
    layer.backgroundColor = [[UIColor clearColor] CGColor];
    layer.bounds = CGRectMake(imageLayer.bounds.origin.x +20 ,
                                  imageLayer.bounds.origin.y + 20, 15, 15);
    NSString *imageName = [NSString stringWithString:[[self.goalSettingsModel objectAtIndex:value] valueForKeyPath:@"imageName"]];
    layer.contents =  (id)[UIImage imageNamed:imageName].CGImage;
    [imageLayer addSublayer:layer];
    [imageLayer setNeedsDisplay];

我不确定，如果我错过了calayer的任何设置。

Answer 1

设置图层的位置属性后，图像被正确添加到形状图层

let imageLayer = CALayer()
        imageLayer.backgroundColor = UIColor.clear.cgColor
        imageLayer.bounds = CGRect(x: centerPoint.x, y: centerPoint.y , width: 15, height: 15)
        imageLayer.position = CGPoint(x:centerPoint.x ,y:centerPoint.y)
            imageLayer.contents = UIImage(named:segment.imageName)?.cgImage
        self.layer.addSublayer(pieSliceLayer)
        self.layer.addSublayer(imageLayer)

Answer 2

有几件事：

首先，您只需在图形更改（调用setNeedsDisplay）或更改布局（viewDidLayoutSubviews）时更新形状图层。除非您打算实际绘图，否则您不需要实现drawRect。分层系统知道如何渲染形状图层，并在必要时进行渲染。

其次，CAShapeLayer用于形状。实际上有很多CALayers，他们都画了不同的东西：https://www.raywenderlich.com/90919/great-calayer-tour-tech-talk-video。在普通旧图像的情况下，只需执行Objective C代码正在执行的操作，并使用单独的CALayer来保存图像而不是CAShapeLayer。将图像图层添加为图形形状图层顶部或后面的子图层，具体取决于您的z排序首选项。

将图像添加到CAShapeLayer Swift 3

2 个答案: