Как использовать CABasicAnimation и CALayer для анимации пути Безье

Я пытаюсь анимировать изменение цвета пути Безье в UIView, но я думаю, что мне не хватает чего-то очень простого, так как слой не отображается в моем UI View. Просто добавление слоя в self.layer, похоже, не запускает метод рисования в контексте. Я не очень понимаю основы того, какой розыгрыш запускается, когда и в какие слои.

public class ProgressIndicatorView: UIView {


    var bubble = BubbleLayer()

    public required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

    public class var sharedInstance: ProgressIndicatorView {
        struct Singleton {
            static let instance = ProgressIndicatorView(frame: CGRect.zeroRect)
        }
        return Singleton.instance
    }

    public override init(frame: CGRect) {
        super.init(frame: frame)
        self.updateFrame(frame)

        self.backgroundColor = UIColor(white: 0.0, alpha: 0.3)
        self.layer.addSublayer(bubble)

    }


    func updateFrame(frame:CGRect)
    {
        self.frame = frame
        bubble.frame = CGRect(x:self.center.x, y:self.center.y, width: 126, height: 126)
    }

    func animate(){

        let anim = CABasicAnimation(keyPath:"percentage")
        anim.fromValue = 0.000
        anim.toValue = 1.000
        anim.repeatCount = 1000
        bubble.addAnimation(anim, forKey: "percentage")

    }


    public class func show() {

        let window = UIApplication.sharedApplication().windows.first as UIWindow
        let indicator = ProgressIndicatorView.sharedInstance
        indicator.updateFrame(window.frame)

        if indicator.superview == nil {

            window.addSubview(indicator)
            indicator.animate()
        }
    }

    public class func hide(){

        let indicator = ProgressIndicatorView.sharedInstance

        UIView.animateWithDuration(0.33, delay: 0.0, options: .CurveEaseOut, animations: {
            indicator.alpha = 0.0
            }, completion: {_ in
                indicator.alpha = 1.0
                indicator.removeFromSuperview()

        })

    }
}

public class BubbleLayer : CALayer {

    public var percentage:CGFloat = 0

    public override func animationForKey(key: String!) -> CAAnimation! {
        var anim = CABasicAnimation(keyPath: key)
        anim.fromValue = self.presentationLayer().key
        anim.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
        anim.duration = CATransaction.animationDuration()

        return anim
    }

    public override func actionForKey(event: String!) -> CAAction! {
        if (event == "percentage"){
            return self.animationForKey(event)
        }
        else {
            return super.actionForKey(event)
        }
    }

    public override func drawInContext(ctx: CGContext!) {
        super.drawInContext(ctx)
        UIGraphicsPushContext(ctx)

        let context = UIGraphicsGetCurrentContext()
        let frame = self.bounds


        let white = UIColor(red: self.percentage, green: 1.000, blue: 1.000, alpha: 1.000)
        let white_20 = UIColor(red: self.percentage, green: 1.000, blue: 1.000, alpha: 0.200)

        //// Oval 10 Drawing
        CGContextSaveGState(context)
        CGContextTranslateCTM(context, 1.3, 0.8)

        var oval10Path = UIBezierPath(ovalInRect: CGRectMake(5, 5, 113.6, 113.6))
        white_20.setStroke()
        oval10Path.lineWidth = 10
        oval10Path.stroke()

        CGContextRestoreGState(context)

        //// Bezier 122 Drawing
        var bezier122Path = UIBezierPath()
        bezier122Path.moveToPoint(CGPointMake(63, 5.9))
        bezier122Path.addCurveToPoint(CGPointMake(119.8, 62.7), controlPoint1: CGPointMake(94.4, 5.9), controlPoint2: CGPointMake(119.8, 31.3))
        bezier122Path.lineCapStyle = kCGLineCapRound;

        bezier122Path.lineJoinStyle = kCGLineJoinRound;

        white.setStroke()
        bezier122Path.lineWidth = 10
        bezier122Path.stroke()


    }

}

0 ответов

Другие вопросы по тегам