迅速在UIViewController中绘制局部圆

Question

I would like to draw a partial circle and I have the following function to do so in my UIViewController and I call it in viewDidLoad :

import UIKit

class ActivityViewController: UIViewController {

    let progress = CGRect(origin: CGPoint(x:  200, y: 200), size: CGSize(width: 100, height: 100))

    override func viewDidLoad() {
        super.viewDidLoad()
        drawSlice(rect: progress, startPercent: 0, endPercent: 50, color: UIColor.blue)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    func drawSlice(rect: CGRect, startPercent: CGFloat, endPercent: CGFloat, color: UIColor) {
        let center = CGPoint(x: rect.origin.x + rect.width / 2, y: rect.origin.y + rect.height / 2)
        let radius = min(rect.width, rect.height) / 2
        let startAngle = startPercent / 100 * CGFloat(M_PI) * 2 - CGFloat(M_PI)
        let endAngle = endPercent / 100 * CGFloat(M_PI) * 2 - CGFloat(M_PI)
        let path = UIBezierPath()
        path.move(to: center)
        path.addArc(withCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
        path.close()
        color.setFill()
        path.fill()
    }


 }

But when I execute this code, the circle doesn't appear, what am I doing wrong?

Answer 1

You must specify where you want to draw the path you just created. For instance, you can use a CAShapeLayer and do something like:

    let myLayer = CAShapeLayer()
    myLayer.path = path.cgPath

    //set some property on the layer
    myLayer.strokeColor = UIColor.blue.cgColor
    myLayer.fillColor = UIColor.white.cgColor
    myLayer.lineWidth = 1.0
    myLayer.position = CGPoint(x: 10, y: 10)

    // add the layer to your view's layer !!important!!
    self.layer.addSublayer(myLayer)

And then you should see your layer!

Answer 2

You would need to draw as part of a UIView that you place in your UIViewController . One way to do this is to subclass UIView and add the drawing code there:

class MyProgress: UIView {
    // MARK: - Draw

    override func draw(_ rect: CGRect) {

        guard UIGraphicsGetCurrentContext() != nil else {
            return
        }

        let center = CGPoint(x: rect.origin.x + rect.width / 2, y: rect.origin.y + rect.height / 2)
        let radius = min(rect.width, rect.height) / 2
        let startAngle = startPercent / 100 * CGFloat(M_PI) * 2 - CGFloat(M_PI)
        let endAngle = endPercent / 100 * CGFloat(M_PI) * 2 - CGFloat(M_PI)
        let path = UIBezierPath()
        path.move(to: center)
        path.addArc(withCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
        path.close()
        color.setFill()
        path.fill()

        context.addPath(path.cgPath)
        context.setFillColor(color.cgColor)
        context.fillPath()
}

Then you can add this view to your ViewController and place it, using constraints where you would like it to appear.

---

Edit

To see the view, you need to add it to your ViewController.

This would be something like this:

import UIKit

class ActivityViewController: UIViewController {

    let progress = CGRect(origin: CGPoint(x:  200, y: 200), size: CGSize(width: 100, height: 100))

    override func viewDidLoad() {
        super.viewDidLoad()
        // instantiate the view
        let progressView = MyProgressView(frame: progress)

        // add it to the view hierarchy
        view.addSubview(progressView)
    }
}

Depending where you want this progress view to show up, you might have to change the frame or add it to some other place in the view hierarchy.