I have this clock
and I want to make something like it. I want it to work in each second, I mean by work to start full and then becomes empty gradually.
What I have tried
I created a custom view and added a UIBezierPath
like the following:
class CircleView: UIView {
required init(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)!
}
override func drawRect(rect: CGRect) {
let startAngle: CGFloat = 0.0
let endAngle: CGFloat = 80.0
let radius: CGFloat = 80.0
let path2 = UIBezierPath(arcCenter: center,
radius: radius/2,
startAngle: startAngle,
endAngle: endAngle,
clockwise: true)
UIColor.greenColor().setFill()
path2.fill()
}
}
and all I get is:
I don't know where is the wrong (maybe my whole approach is wrong), I tried to change the values to start angle as 0 and the end angle as 90, but kept having the same shape.
Updat3 1
after people suggested that i should change degrees to radians, i changed my code like this
class CircleView: UIView {
required init(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)!
}
func degreesToRadians (number: Int) -> CGFloat {
return CGFloat(number) * CGFloat(M_PI) / 180.0
}
override func drawRect(rect: CGRect) {
let startAngle: CGFloat = degreesToRadians(0)
let endAngle: CGFloat = degreesToRadians(270)
let radius: CGFloat = 40.0
let path2 = UIBezierPath(arcCenter: center,
radius: radius,
startAngle: startAngle,
endAngle: endAngle,
clockwise: true)
UIColor.greenColor().setFill()
path2.fill()
}
}
but the result is this:
you can compare the result with the image that i want, the cut is not as i want. please look to the picture, i don't know how to say it in english