CAKeyframeAnimation的交错动画？ [英] Staggered animations with CAKeyframeAnimation?

问题描述

我想在特定的时间点对3张不同的图像进行动画处理，使其表现为这种方式。

  1）第一张图像从（Xx，Yx）移至（Xz，Yz）
 2）等待10秒
 3）第二张图像出现在Xa，Yb 
 4）等待一半2 
 5）淡出第二张图像
 6）第三张图像与第二张图像
  

如果这些图像的每个动画都在各自的CALayers上，我可以将CAKeyframeAnimation用于多个图层吗？如果没有，那么做交错动画的另一种方法是什么呢？

我正在尝试使纸牌从屏幕外移动到特定位置，然后制作一些其他技巧来制作动画几秒钟后出现在屏幕上。

解决方案

编辑

当我写这篇文章时，我以为您不能使用CAAnimationGroup为多个图层设置动画。 Matt刚刚发布了一个答案，表明您可以做到这一点。我在这里吃了我的话。

我已经把Matt的答案中的代码用于我已经上传到

（以下语句不正确）
不，您不能使用关键帧动画为多层设置动画。给定的CAAnimation只能作用于单个图层。顺便说一下，这包括组图层。

如果您要做的只是像直线移动图像，淡出和淡入，为什么不这样做呢？您使用UIView动画吗？看一下以animateWithDuration：animations开头的方法的名称：那些方法可以让您同时创建多个动画，然后完成块可以触发其他动画。

如果需要要出于某种原因使用图层动画，可以使用beginTime属性（CAAnimation对象具有该属性是因为它们符合CAMediaTiming协议。）对于不属于动画组的CAAnimation，请使用

  animation.beginTime = CACurrentMediaTime（）+延迟； 
  

其中delay是一个以秒为单位的延迟时间的倍数。

如果delay为0，动画将开始。

第三个选项是将视图控制器设置为动画的委托，并使用animationDidStop：finished：方法链接动画。我认为这最终是最混乱的实施方法。

I want to animate 3 different images at specific point in time such that it behaves this way.

1) 1st image moves from (Xx, Yx) to (Xz,Yz) 
2) Wait 10 seconds
3) 2nd image appears in place at Xa,Yb
4) Wait half as long as in step 2
5) Fade out 2nd image
6) 3rd image appears at the same place as 2nd image

If each of these image's animations are on their own CALayers, can I use CAKeyframeAnimation with multiple layers? If not, what's another way to go about doing staggered animations?

I'm trying to animate a playing card move from offscreen to a particular spot and then few other tricks to appear on screen several seconds later.

解决方案

Edited

When I wrote this, I thought you could not use a CAAnimationGroup to animate multiple layers. Matt just posted an answer demonstrating that you can do that. I hereby eat my words.

I've taking the code in Matt's answer and adapted it to a project which I've uploaded to Github (link.)

The effect Matt's animation creates is of a pair of feet walking up the screen. I found some open source feet and installed them in the project, and made some changes, but the basic approach is Matt's. Props to him.

Here is what the effect looks like:

(The statement below is incorrect) No, you can't use a keyframe animation to animate multiple layers. A given CAAnimation can only act on a single layer. This includes group layers, by the way.

If all you're doing is things like moving images on a straight line, fading out, and fading in, why don't you use UIView animation? Take a look at the methods who's names start with animateWithDuration:animations: Those will let you create multiple animations at the same time, and the completion block can then trigger additional animations.

If you need to use layer animation for some reason, you can use the beginTime property (which CAAnimation objects have because they conform to the CAMediaTiming protocol.) For CAAnimations that are not part of an animation group, you use

animation.beginTime = CACurrentMediaTime() + delay;

Where delay is a double which expresses the delay in seconds.

If the delay is 0, the animation would begin.

A third option would be to set your view controller up as the delegate of the animation and use the animationDidStop:finished: method to chain your animations. This ends up being the messiest approach to implement, in my opinion.

这篇关于CAKeyframeAnimation的交错动画？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！