我正在为填充但未描边的 CAShapeLayer 的路径值设置动画,我想让它的动画更流畅

Posted

技术标签:

【中文标题】我正在为填充但未描边的 CAShapeLayer 的路径值设置动画,我想让它的动画更流畅【英文标题】:I am animating the path value of a filled but not stroked CAShapeLayer and I would like to make it animate more smoothly 【发布时间】:2013-07-21 07:23:25 【问题描述】:

好吧,我再说一遍:

。 这是基本的动画代码:

CABasicAnimation * pathAnimation = [CABasicAnimation animationWithKeyPath:@"path"];
        pathAnimation.toValue = (id)targetPath.CGPath;
        pathAnimation.fromValue = (id)shapePath.CGPath;
        //pathAnimation.fromValue = (id)((CAShapeLayer*)[currentShapeLayers objectForKey:key]).path;
        pathAnimation.repeatCount = 0;
        pathAnimation.duration = animationTime;
        pathAnimation.autoreverses = NO;
        [[currentShapeLayers objectForKey:key] addAnimation:pathAnimation forKey:@"animatePath"];

嗯,没问题。但是这些路径的形状很奇怪,而且是动态形成的。我尝试确保路径之间的点数始终相同,这很有帮助。但我仍然会得到一些我不想动画的路径动画。我真正想做的是保持路径的一部分静态,而路径的其余部分从一侧长出或缩回到一侧,或者在某些情况下,从主路径分离到单独的子路径。

我考虑过找到中间路径阶段并首先制作动画,然后从那里完成动画,但我觉得可能还有其他解决方案。

【问题讨论】:

【参考方案1】:

我找到了a solution to this。我不确定这是否是最有效的解决方案,因为它涉及大量重绘,但它确实允许对动画的行为方式进行大量控制。

【讨论】:

以上是关于我正在为填充但未描边的 CAShapeLayer 的路径值设置动画,我想让它的动画更流畅的主要内容,如果未能解决你的问题,请参考以下文章

带描边的 SVG 蒙版

如何给SVG填充和描边应用线性渐变

UIBezierPath + CAShapeLayer - 填充一个圆圈的动画[重复]

用一种颜色作为描边绘制一个多边形,用另一种颜色作为填充?

CAShapeLayer shadowPath 动画。如何防止动画完成时的阴影填充?

UIBezierPath 填充与 CAShapeLayer