大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处.
如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;)
原文在:
http://oleb.net/blog/2010/12/animating-drawing-of-cgpath-with-cashapelayer/
原理说明在:
http://www.codeproject.com/Articles/109729/Low-level-text-rendering
文章写得非常棒!推荐大家阅读.
不过其源代码运行有点小问题,就是有时候画笔显示不出来!
第一次绘制图形的时候没问题,而切换至文字轮廓绘制的时候有时候画笔不显示.
在- (void) animationDidStop:(CAAnimation *)anim finished:(BOOL)flag处下断点,发现在切换视图时(此时上一个动画还未完成),也会被打断.
进入startAnimation方法查看
- (void) startAnimation
{
[self.pathLayer removeAllAnimations];
[self.penLayer removeAllAnimations];
self.penLayer.hidden = NO;
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = 10.0;
pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];
[self.pathLayer addAnimation:pathAnimation forKey:@"strokeEnd"];
CAKeyframeAnimation *penAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
penAnimation.duration = 10.0;
penAnimation.path = self.pathLayer.path;
penAnimation.calculationMode = kCAAnimationPaced;
penAnimation.delegate = self;
[self.penLayer addAnimation:penAnimation forKey:@"position"];
}
发现开头对原有动画做了删除操作,而删除动画也会引起animationDidStop的回调,虽然在删除后作者特地启用了显示画笔:
self.penLayer.hidden = NO;
但是,这和animationDidStop的执行顺序是没有保证的!如果animationDidStop在之后执行,就会出现前面提到的画笔又被隐藏从而不显示的问题.
知道了原因解决起来也就非常简单了,我们只需要修改animationDidStop方法如下即可:
- (void) animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
//如果动画不是由于删除而停止的才隐藏画笔!
if (flag){
self.penLayer.hidden = YES;
}
}
现在运行,小bug得到了修复,可爱的画笔又勤奋的工作了: