CAShapeLayer 路径未显示答案

【问题标题】：CAShapeLayer path not displayedCAShapeLayer 路径未显示
【发布时间】：2020-06-17 11:12:29
【问题描述】：

我目前正在制作圆形进度条，为此我创建了一个 customView。但是 shapeLayer 没有被显示。我尝试向 shapeLayer 以及背景颜色添加一个框架，但是这只显示了一个矩形而不是我期望看到的圆形路径。关于我做错了什么的任何想法：思考：

import UIKit

class CircularProgressBar: UIView {
    override func draw(_ rect: CGRect) {
        setupProgressView()
    }

    private func setupProgressView() {
        let shapeLayer = CAShapeLayer()
        let circularPath = UIBezierPath(arcCenter: center,
                                        radius: 100,
                                        startAngle: 0,
                                        endAngle: 2*CGFloat.pi,
                                        clockwise: true)

        shapeLayer.path = circularPath.cgPath
        shapeLayer.fillColor = UIColor.blue.cgColor
        shapeLayer.strokeColor = UIColor.yellow.cgColor
        shapeLayer.lineWidth = 20

        self.layer.addSublayer(shapeLayer)
    }
}

【问题讨论】：

标签： ios swift xcode calayer uibezierpath

【解决方案1】：

设置 shapeLayer 框架

shapeLayer.frame = bounds

更好的方法是不使用draw方法

import UIKit
 @IBDesignable
 class CircularProgressBar: UIView {

    private lazy var shapeLayer: CAShapeLayer = {
        let shape = CAShapeLayer()
        shape.fillColor = UIColor.blue.cgColor
        shape.strokeColor = UIColor.yellow.cgColor
        shape.lineWidth = 20
        return shape
    }()

    override init(frame: CGRect) {

        super.init(frame: frame)
        addLayers()
    }

    required init?(coder: NSCoder) {

        super.init(coder: coder)
        addLayers()
    }

    private func addLayers() {
        layer.addSublayer(shapeLayer)
    }


    override func layoutSubviews() {
        updatePath()
    }


    private func updatePath() {

        let circularPath = UIBezierPath(arcCenter: CGPoint(x: bounds.midX, y: bounds.midY),
                                        radius: min(bounds.midX, bounds.midY) - shapeLayer.lineWidth/2,
                                        startAngle: 0,
                                        endAngle: 2*CGFloat.pi,
                                        clockwise: true)
        shapeLayer.frame = bounds
        shapeLayer.path = circularPath.cgPath
    }
}

【讨论】：