Путь CAShapeLayer не отображается - PullRequest
1 голос
/ 17 июня 2020

В настоящее время я работаю над круглым индикатором выполнения, для этого я создал 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)
    }
}

1 Ответ

1 голос
/ 17 июня 2020

Установить рамку shapeLayer

shapeLayer.frame = bounds

И лучший подход - не использовать метод рисования

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
    }
}

enter image description here

...