链接图层及其子图层的动画（子图层模型效果超图层动画）答案

【问题标题】：Chaining the animation of a layer and its sublayer (sublayer model effects superlayer animation)链接图层及其子图层的动画（子图层模型效果超图层动画）
【发布时间】：2012-10-16 02:31:47
【问题描述】：

我正在尝试链接图层及其子图层的动画。但是，我遇到的问题是，子层动画位置的模型更新在其超级层动画期间在视觉上是显而易见的。这是我用来链接动画的代码：

// Superlayer. 
CFTimeInterval now = [self.artworkContainer.layer convertTime:CACurrentMediaTime() fromLayer:nil];
CABasicAnimation *slideDown = [CABasicAnimation animationWithKeyPath:@"position"];
slideDown.duration = SLIDE_DOWN_DURATION; //SLIDE_DOWN_DURATION;
slideDown.beginTime = now;
slideDown.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
slideDown.fromValue = [self.artworkContainer.layer valueForKey:@"position"];

CGPoint finalPointOfContainer = CGPointMake(self.artworkContainer.layer.position.x, self.artworkContainer.layer.position.y+verticalDistanceOfFirstFall);
slideDown.toValue = [NSValue valueWithCGPoint:finalPointOfContainer];
self.artworkContainer.layer.position = finalPointOfContainer;
[self.artworkContainer.layer addAnimation:slideDown forKey:@"position"];

// Sublayer 
CABasicAnimation *moveActualArtwork = [CABasicAnimation animationWithKeyPath:@"position"];
moveActualArtwork.duration = timeOfSecondFall;
moveActualArtwork.beginTime = now + SLIDE_DOWN_DURATION;
moveActualArtwork.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
moveActualArtwork.fromValue = [self.artWork.layer valueForKey:@"position"];

CGPoint finalPointOfArtwork = CGPointMake(self.artWork.layer.position.x, self.artWork.layer.position.y+verticalDistanceOfSecondFall);
moveActualArtwork.toValue = [NSValue valueWithCGPoint:finalPointOfArtwork];
self.artWork.layer.position = finalPointOfArtwork; // If this is commented out, the superlayer animation looks correct (of course this isn't a true fix because the sublayer snaps back to its original position without a model update). 

moveActualArtwork.delegate = self;
[self.artWork.layer addAnimation:moveActualArtwork forKey:@"position"];

【问题讨论】：

标签： ios core-animation

【解决方案1】：

我在写问题时找到了答案。我需要设置第二个动画的fillMode属性：moveActualArtwork.fillMode = kCAFillModeBackwards;

如果将fromValue 和toValue 视为时间轴上的位置，那么问题在于，在子图层到达时间轴上的fromValue 点之前，它正在脱离其模型层来确定它的位置。通过使用 kCAFillModeBackwards，fromValue 被有效地扩展以覆盖它之前的时间线，因此 iOS 知道在动画实际开始之前要渲染什么。

我在 45:31 查看 WWDC 2011 视频 Session 421 - Core Animation Essentials 找到了答案。

【讨论】：