CashApelayer图像未出现

Question

我有一个image.cgimage，我将其设置为contents cashapelayer（），但没有出现。我强迫拆开图像，所以我知道它肯定存在。出现圆形，但其中的图像却没有。

let shapeLayer = CAShapeLayer()
var didSubviewsLayout = false

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    if !didSubviewsLayout {
        didSubviewsLayout = true

        setupShapeLayer()
    }
}

func setupShapeLayer() {
    
    shapeLayer.path = UIBezierPath(roundedRect: CGRect(x: 200, y: 200, width: 50, height: 50), cornerRadius: 25).cgPath
    
    shapeLayer.strokeColor = nil
    
    shapeLayer.fillColor = UIColor.orange.cgColor
    
    shapeLayer.contents = UIImage(named: "myIcon")!.cgImage // this doesn't crash so the image definitely exists
    
    view.layer.addSublayer(shapeLayer)
}

Answer 1

问题是您的形状层没有大小。您没有给它一个框架，因此它只是右上角的一个看不见的点。不幸的是，您仍然可以看到形状，因此您不知道自己做错了这一切。但是内容没有绘制，因为该层只是一个点，因此它揭示了您的代码的粘土脚。

因此，在这种情况下，偶然地更改

shapeLayer.path = UIBezierPath(roundedRect: CGRect(x: 200, y: 200, width: 50, height: 50), cornerRadius: 25).cgPath

为

shapeLayer.frame = CGRect(x: 200, y: 200, width: 50, height: 50)
shapeLayer.path = UIBezierPath(roundedRect: CGRect(x: 0, y: 0, width: 50, height: 50), cornerRadius: 25).cgPath

不是如何正确绘制圆圈，因此，如果这是您的目标，请停止它。使用ovalin;就是这样。完整示例：

    let shapeLayer = CAShapeLayer()

    shapeLayer.frame = CGRect(x: 200, y: 200, width: 50, height: 50)
    shapeLayer.path = UIBezierPath(ovalIn: CGRect(x: 0, y: 0, width: 50, height: 50)).cgPath
    shapeLayer.strokeColor = UIColor.orange.cgColor
    shapeLayer.lineWidth = 4
    shapeLayer.fillColor = nil
    shapeLayer.contents = UIImage(named: "smiley")?.cgImage

    self.view.layer.addSublayer(shapeLayer)

结果：

也请注意，您可能正在用 all 您的形状层犯此错误，而不仅仅是此错误，因此您将需要返回所有此应用程序中的代码（或者更好，您编写的所有代码！），并正确编写所有形状层。图层需要框架！

Answer 2

您可以在单独的一层中创建圆形路径，并将其添加为掩码，并将其添加到包含图像的图层中。首先，我将在父层中添加一个帧，以便可以使用contentsGravity将图像居中。

shapeLayer.frame = CGRect(x: 200, y: 200, width: 50, height: 50)

shapeLayer.contents = UIImage(named: "myIcon")!.cgImage
        
// Center the image within the layer
shapeLayer.contentsGravity = .center
        
// We can set the orange color here
shapeLayer.backgroundColor = UIColor.orange.cgColor

然后，创建将具有圆形路径的图层并将其设置为图像层的掩码：

let maskLayer = CAShapeLayer()
        
maskLayer.path = UIBezierPath(roundedRect: CGRect(x: 0, y: 0, width: 50, height: 50), cornerRadius: 25).cgPath
        
shapeLayer.mask = maskLayer

您的修改代码：

func setupShapeLayer() {
    shapeLayer.frame = CGRect(x: 200, y: 200, width: 50, height: 50)

    shapeLayer.contents = UIImage(named: "myIcon")!.cgImage
        
    // Center the image within the layer
    shapeLayer.contentsGravity = .center
        
    // We can set the orange color here
    shapeLayer.backgroundColor = UIColor.orange.cgColor
        
    // Create mask layer
    let maskLayer = CAShapeLayer()
        
    maskLayer.path = UIBezierPath(roundedRect: CGRect(x: 0, y: 0, width: 50, height: 50), cornerRadius: 25).cgPath
        
    shapeLayer.mask = maskLayer
        
    view.layer.addSublayer(shapeLayer)
}