Sean Danzeiser
Sean Danzeiser

Reputation: 9243

CAShapeLayer path animation -- shrinking a circle

I'm trying to shrink a circular CAShapeLayer but using the key path 'path' does not seem to be working.

CGPathRef startPath = [UIBezierPath bezierPathWithOvalInRect:startRect].CGPath;
CGPathRef endPath   = [UIBezierPath bezierPathWithOvalInRect:CGRectInset(startRect, 15, 15)].CGPath;

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"path"];
animation.duration          = 1.0;
animation.fromValue         = (__bridge id)startPath;
animation.toValue           = (__bridge id)endPath;
animation.autoreverses      = YES;
animation.repeatCount       = CGFLOAT_MAX;
animation.timingFunction    = [CAMediaTimingFunction functionWithControlPoints:0.6 :0.3 :0.8 :0.45];

//circleLayer is a CAShapeLayer
[self.circleLayer addAnimation:animation forKey:@"pathAnimation"];

I think i must be misunderstanding about how a path animation works because pretty much identical code seems to work fine if i am try to animate, say, the opacity or the transform.

Any ideas?

Upvotes: 0

Views: 902

Answers (1)

Cameron
Cameron

Reputation: 1142

I recently had the same question and ended up solving it by creating the circle, then animating the scale CGAffineTransform. In the view whose layer is the circle, I simply used

CGAffineTransform transform = CGAffineTransformIdentity;
transform = CGAffineTransformScale(transform, scaleX, scaleY);

[UIView animateWithDuration: 0.5 animations: ^{
    self.transform = transform;
}];

Hope this helps!

Upvotes: 1

Related Questions