Swift: Draw a Circle around a Label
Solution 1
Ugh, it was what I thought, silly mistake.
X and Y are calculated from the middle instead of from the top left when dealing with BezierPath's.
So the code for x and y should be as follows:
let x = countLabel.layer.position.x - (countLabel.frame.height / 2)
let y = countLabel.layer.position.y - (countLabel.frame.height / 2)
Solution 2
You can instead just use corner radius on your label's layer. You make the label square and then set its layer's corner radius to half the width/height of the label which will make it perfectly round. The you set the border width to something greater than zero and the border color to the stroke color you want to use.
let size:CGFloat = 35.0 // 35.0 chosen arbitrarily
countLabel.bounds = CGRectMake(0.0, 0.0, size, size)
countLabel.layer.cornerRadius = size / 2
countLabel.layer.borderWidth = 3.0
countLabel.layer.backgroundColor = UIColor.clearColor().CGColor
countLabel.layer.borderColor = UIColor.greenColor().CGColor
It will look something like this:
Although the full code for that goes like this in a single view controller iPad template project:
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let size:CGFloat = 35.0 // 35.0 chosen arbitrarily
let countLabel = UILabel()
countLabel.text = "5"
countLabel.textColor = .greenColor()
countLabel.textAlignment = .Center
countLabel.font = UIFont.systemFontOfSize(14.0)
countLabel.bounds = CGRectMake(0.0, 0.0, size, size)
countLabel.layer.cornerRadius = size / 2
countLabel.layer.borderWidth = 3.0
countLabel.layer.backgroundColor = UIColor.clearColor().CGColor
countLabel.layer.borderColor = UIColor.greenColor().CGColor
countLabel.center = CGPointMake(200.0, 200.0)
self.view.addSubview(countLabel)
}
}
Solution 3
countLabel.layer.cornerRadius = 0.5 * countLabel.bounds.size.width
Kristofer Doman
Updated on July 28, 2022Comments
-
Kristofer Doman almost 2 years
I'm trying to draw a circle around a label at runtime in a TableViewCell's cell.
I can figure out how to get it roughly around the label, but I'm having some trouble centring it exactly around the label.
The circle seems to be drawing just to the right and towards the middle of the label.
Here's my code so far, I'm sure this will be easy for someone to bang out.
func drawCircle() { let x = countLabel.layer.position.x - (countLabel.frame.width) let y = countLabel.layer.position.y - (countLabel.frame.height / 2) let circlePath = UIBezierPath(roundedRect: CGRectMake(x, y, countLabel.frame.height, countLabel.frame.height), cornerRadius: countLabel.frame.height / 2).CGPath let circleShape = CAShapeLayer() circleShape.path = circlePath circleShape.lineWidth = 3 circleShape.strokeColor = UIColor.whiteColor().CGColor circleShape.fillColor = UIColor.clearColor().CGColor self.layer.addSublayer(circleShape) }