double-stroke-animation.swift

//: Playground - noun: a place where people can play

import UIKit
import PlaygroundSupport
import XCPlayground

class AnimatedView: UIView {
    
    let rightLayer: CAShapeLayer = CAShapeLayer()
    
    override init(frame: CGRect) {
        
        super.init(frame: frame)
        
        self.backgroundColor = .white
        self.layer.masksToBounds = true
        self.layer.cornerRadius = self.frame.width / 2
        
        self.layer.addSublayer(self.rightLayer)

        self.rightLayer.fillColor = nil
        self.rightLayer.lineWidth = 8
        self.rightLayer.strokeColor = UIColor.red.cgColor
        self.rightLayer.strokeEnd = 0
        
        let bezierPath = UIBezierPath()
        let center: CGPoint = CGPoint(x: self.bounds.midX, y: self.bounds.midY)
        let radius: CGFloat = self.bounds.width / 2
        let startAngle: CGFloat = CGFloat(M_PI_2)
        let endAngle: CGFloat = CGFloat(M_PI_2) + 2 * CGFloat(M_PI)
        bezierPath.addArc(withCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
        
        self.rightLayer.path = bezierPath.cgPath
        self.rightLayer.frame = self.bounds
        self.rightLayer.masksToBounds = true
        self.rightLayer.cornerRadius = self.layer.cornerRadius
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    func animate() -> Void {
        
        let basicAnimation: CABasicAnimation = CABasicAnimation(keyPath: "strokeEnd")
        
        basicAnimation.fromValue = 0
        basicAnimation.toValue = 1
        
        let reverseAnimation: CABasicAnimation = CABasicAnimation(keyPath: "strokeStart")
        
        reverseAnimation.fromValue = 1
        reverseAnimation.toValue = 0
        
        let group: CAAnimationGroup = CAAnimationGroup()
        
        group.animations = [basicAnimation, reverseAnimation]
        group.duration = 2.5
        group.isRemovedOnCompletion = false
        group.fillMode = kCAFillModeForwards
        group.repeatCount = .infinity
        group.autoreverses = true
        self.rightLayer.add(group, forKey: "rightLayerAnimation")
    }
}

let container = AnimatedView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
container.animate()

PlaygroundPage.current.liveView = container