swift 원형 프로그레스 제작
import UIKit
class CircleProgress: UIView {
// 전역변수
let circle = CAShapeLayer()
let pause = CAShapeLayer()
let progress = CAShapeLayer()
let mask = CAShapeLayer()
let black = UIColor.blackColor().CGColor
// 초기값
var value:CGFloat = 0.0
required init?(coder: NSCoder) {
super.init(coder: coder)
Start()
}
override init(frame: CGRect) {
super.init(frame: frame)
Start()
}
func Start() {
// 크기
let rect = self.bounds
let pauseRect = rect.insetBy(dx: rect.width/3, dy: rect.height/3)
let radius = min(rect.width, rect.height) / 2
let center = CGPoint(x: rect.midX, y: rect.midY)
// 레이어 추가
for layer in [progress, pause, circle] {
layer.strokeColor = black
layer.fillColor = nil
self.layer.addSublayer(layer)
}
// 프로그레스 두께 및 색상
progress.lineWidth = 15
progress.strokeColor = UIColor.greenColor().CGColor
// 일시 정지 버튼 색상
pause.fillColor = black
// 패스 설정
pause.path = UIBezierPath(rect: pauseRect).CGPath
circle.path = UIBezierPath(ovalInRect: rect).CGPath
progress.path = UIBezierPath(arcCenter: center, radius: radius, startAngle: 0, endAngle: CGFloat(2 * M_PI), clockwise: true).CGPath
mask.path = UIBezierPath(ovalInRect: rect).CGPath
// 마스크 설정, 외곽 테두리 안보이게
progress.mask = mask
progress.strokeStart = 0
// 상태 갱신
Update()
}
func Update() {
// 1.0 되면 다시 시작
if value <= 1.0 {
value += 0.01
} else {
value = 0.0
}
// 0.1초 후에 재귀시작
let delayTime = dispatch_time(DISPATCH_TIME_NOW, Int64(0.1 * Double(NSEC_PER_SEC)))
dispatch_after(delayTime, dispatch_get_main_queue()) {
self.progress.strokeEnd = self.value
self.Update()
}
}
}
소스입니다.
원형으로 프로그레스를 시계방향으로 돌아가도록 구현해 보았습니다.
사용방법은
let progress = CircleProgress(frame: CGRect(x: 50, y: 50, width: 100, height: 100))
이런식으로 선언해주시고요.
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
view.addSubview(progress)
}
이렇게 하위뷰로 추가하면 천천히 증가하시는 값을 보실 수 있습니다.
댓글
댓글 쓰기