cocoa-touch - 插值 CGAffineTransform

Question

我正在为 UIView 制作动画使用它的CALayer的affineTransform属性(property)。我制作动画的变换是这样构建的:CGAffineTransformTranslate(CGAffineTransformScale(zoomContainer.layer.transform, scaleX, scaleY), translateX, translateY) .

现在我想改进这个动画并使其具有交互性。因此，我需要使用完成百分比对 CGAffineTransform 进行插值。但是，在为我制作动画时，我似乎找不到系统插入转换的方式。我总是以奇怪的曲线结束，其中平移与缩放不同步。这是我目前拥有的代码:

CGFloat completion = fmax(0, fmin(completionPercentage, 1));
CGFloat scaleX = CGRectGetWidth(zoomContainerInitialBounds) / CGRectGetWidth(zoomTargetInitialFrame);
CGFloat scaleY = CGRectGetHeight(zoomContainerInitialBounds) / CGRectGetHeight(zoomTargetInitialFrame);
scaleX = 1 + ((scaleX - 1) * (1 - completion));
scaleY = 1 + ((scaleY - 1) * (1 - completion));
CGFloat translateX = CGRectGetMidX(zoomContainerInitialBounds) - CGRectGetMidX(zoomTargetInitialFrame);
CGFloat translateY = CGRectGetMidY(zoomContainerInitialBounds) - CGRectGetMidY(zoomTargetInitialFrame);
translateX *= (1 - completion);
translateY *= (1 - completion);
zoomContainer.layer.affineTransform = CGAffineTransformTranslate(CGAffineTransformScale(initialTransform, scaleX, scaleY), translateX, translateY);

我需要改变什么来插入转换，就像 UIKit 为我做的一样？

Answer 1

如果您希望能够与动画进行交互(可能使用手势、 slider 或其他机制)，那么您可以使用一个小技巧，通过设置 speed 来“暂停”动画。 View 层的 0，然后通过设置 timeOffset 将动画移动到特定时间点层的。

我在 an answer to a similar (but animating a different property) question 中有对此的解释我在 the context of animation timing in a blog post 中有更详细的解释.

所以这不仅仅是一个链接答案，这是您进行此交互所需的非常少的代码。在这种情况下，我假设一个 slider 。博客文章展示了如何将它与滚动事件一起使用，如果你想用手势来做，那么我相信你能弄清楚:)

在您的动画设置中(请注意，我使用的是 CATransform3D 而不是 CGAffineTransform)

CABasicAnimation *yourAnimation = [CABasicAnimation animationWithKeyPath:@"transform"];
yourAnimation.duration  = 1.; // For convenience (so that timeOffset is from 0.0 to 1.0)
yourAnimation.fromValue = [NSValue valueWithCATransform3D:fromTransform];
yourAnimation.toValue   = [NSValue valueWithCATransform3D:toTransform];
[self.yourView.layer addAnimation: yourAnimation forKey:@"Your Animation"];

self.yourView.layer.speed = 0.0; // Pause every animation on that layer

和 slider 来驱动动画的交互( slider 配置为从 0.0 到 1.0):

- (IBAction)sliderChanged:(UISlider *)sender {
    self.yourView.layer.timeOffset = sender.value; // Change the "current time" of the animation
}