ios - 动画边界变化时的 CAShapeLayer 路径动画

Question

我有一个 CAShapeLayer(它是 UIView 子类的层)，其 path应该在 View 的 bounds 时更新尺寸变化。为此，我覆盖了图层的 setBounds:重置路径的方法:

@interface CustomShapeLayer : CAShapeLayer
@end

@implementation CustomShapeLayer

- (void)setBounds:(CGRect)bounds
{
    [super setBounds:bounds];
    self.path = [[self shapeForBounds:bounds] CGPath];
}

这工作正常，直到我为边界变化设置动画。我想让路径在任何动画边界更改(在 UIView 动画块中)旁边设置动画，以便形状层始终采用其大小。

自 path属性默认不动画，我想出了这个:

覆盖图层的 addAnimation:forKey:方法。在其中，确定是否向图层添加了边界动画。如果是这样，通过复制传递给该方法的边界动画中的所有属性，创建第二个显式动画来为边界旁边的路径设置动画。在代码中:

- (void)addAnimation:(CAAnimation *)animation forKey:(NSString *)key
{
    [super addAnimation:animation forKey:key];

    if ([animation isKindOfClass:[CABasicAnimation class]]) {
        CABasicAnimation *basicAnimation = (CABasicAnimation *)animation;

        if ([basicAnimation.keyPath isEqualToString:@"bounds.size"]) {
            CABasicAnimation *pathAnimation = [basicAnimation copy];
            pathAnimation.keyPath = @"path";
            // The path property has not been updated to the new value yet
            pathAnimation.fromValue = (id)self.path;
            // Compute the new value for path
            pathAnimation.toValue = (id)[[self shapeForBounds:self.bounds] CGPath];

            [self addAnimation:pathAnimation forKey:@"path"];
        }
    }
}

我从阅读 David Rönnqvist 的 View-Layer Synergy article 中得到了这个想法. (此代码适用于 iOS 8。在 iOS 7 上，您似乎必须检查动画的 keyPath 对 @"bounds" 而不是 `@"bounds.size"。)

触发 View 动画边界更改的调用代码如下所示:

[UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.3 initialSpringVelocity:0.0 options:0 animations:^{
    self.customShapeView.bounds = newBounds;
} completion:nil];

问题

这主要有效，但我有两个问题:

偶尔，我会在 EXC_BAD_ACCESS 中 ( CGPathApply() ) 崩溃在上一个动画仍在进行中时触发此动画。我不确定这是否与我的特定实现有关。编辑:没关系。我忘了转换 UIBezierPath至 CGPathRef . Thanks @antonioviero !

使用标准的 UIView spring 动画时， View 边界和图层路径的动画会稍微不同步。也就是说，路径动画也以弹性方式执行，但它并没有完全遵循 View 的边界。

更一般地说，这是最好的方法吗？ 似乎有一个形状图层，其路径取决于其边界大小，并且应该与任何边界变化同步动画，这应该可以正常工作™，但我很难过。我觉得一定有更好的方法。

我尝试过的其他事情

覆盖图层的 actionForKey:或 View 的 actionForLayer:forKey:为了返回 path 的自定义动画对象属性(property)。我认为这将是首选方式，但我没有找到获取应由封闭动画块设置的事务属性的方法。即使从动画块内部调用，[CATransaction animationDuration ] 等总是返回默认值。

有没有办法 (a) 确定您当前位于动画块中，以及 (b) 获取已在该块中设置的动画属性(持续时间、动画曲线等)？

项目

这是动画:橙色三角形是形状层的路径。黑色轮廓是承载形状图层的 View 的框架。



Have a look at the sample project on GitHub . (此项目适用于 iOS 8，需要 Xcode 6 才能运行，抱歉。)

更新

Jose Luis Piedrahita pointed me至 this article by Nick Lockwood ，这建议采用以下方法:

覆盖 View 的 actionForLayer:forKey:或图层的 actionForKey:方法并检查传递给此方法的键是否是您要设置动画的键( @"path" )。

如果是这样，请调用 super在图层的“正常”动画属性之一(例如 @"bounds" )上，将隐含地告诉您您是否在动画块内。如果 View (层的委托(delegate))返回一个有效的对象(而不是 nil 或 NSNull )，我们是。

从[super actionForKey:]返回的动画中设置路径动画的参数(持续时间、计时函数等)并返回路径动画。

这在 iOS 7.x 下确实很好用。但是，在 iOS 8 下，对象是从 actionForLayer:forKey: 返回的。不是标准(并记录在案) CA...Animation但是一个私有(private)实例 _UIViewAdditiveAnimationAction类( NSObject 子类)。由于没有记录此类的属性，因此我无法轻松使用它们来创建路径动画。

_Edit:或者它可能只是工作。正如 Nick 在他的文章中提到的，一些属性如 backgroundColor仍然返回标准 CA...Animation在 iOS 8 上。我必须尝试一下。`

Answer 1

我知道这是一个老问题，但我可以为您提供一个类似于洛克伍德先生方法的解决方案。遗憾的是，这里的源代码很快，因此您需要将其转换为 ObjC。

如前所述，如果该层是 View 的支持层，您可以拦截 View 本身中的 CAAction。然而，这并不方便，例如，如果在多个 View 中使用背衬层。

好消息是 actionForLayer:forKey: 实际上在支持层调用 actionForKey: 。

它位于 actionForKey: 在支持层中，我们可以在其中拦截这些调用并在路径更改时提供动画。

用 swift 编写的示例层如下:

class AnimatedBackingLayer: CAShapeLayer
{

    override var bounds: CGRect
    {
        didSet
        {
            if !CGRectIsEmpty(bounds)
            {
                path = UIBezierPath(roundedRect: CGRectInset(bounds, 10, 10), cornerRadius: 5).CGPath
            }
        }
    }

    override func actionForKey(event: String) -> CAAction?
    {
        if event == "path"
        {
            if let action = super.actionForKey("backgroundColor") as? CABasicAnimation
            {
                let animation = CABasicAnimation(keyPath: event)
                animation.fromValue = path
                // Copy values from existing action
                animation.autoreverses = action.autoreverses
                animation.beginTime = action.beginTime
                animation.delegate = action.delegate
                animation.duration = action.duration
                animation.fillMode = action.fillMode
                animation.repeatCount = action.repeatCount
                animation.repeatDuration = action.repeatDuration
                animation.speed = action.speed
                animation.timingFunction = action.timingFunction
                animation.timeOffset = action.timeOffset
                return animation
            }
        }
        return super.actionForKey(event)
    }

}