基于输入值(触摸)的iPhone动画不是时间

时间:2011-01-18 03:04:21

标签: iphone core-animation cakeyframeanimation

对于完全适合动画组方法的动画效果,如Brad Larson's answer here所示,我需要根据输入继续动画。具体地说是检测到的触摸的触摸和位置。它很容易处理touchesMoved:并为每次触摸设置元素的位置,但它不像核心动画方法那样平滑。

想象一下凹槽轨道中的大理石。我想把大理石沿着一个方向或另一个方向以任何速度推向任何位置。动画必须做类似的事情,沿着路径移动视觉元素以响应触摸。 CAKeyframeAnimation具有完全相同的路径位,但似乎总是希望基于时间过去的帧到帧的过渡,而不是基于任何其他因素,并且在一个方向上。

1月31日更新 - 感谢所有回复到目前为止,但没有人真正解决问题。我有一个圆形菜单被拖动以选择一个选项。所有这些都需要一起移动,我通过使用一个应用了旋转变换的视图并将逆旋转变换应用于其子视图来解决它,因此图标都以适当的摩天轮方向旋转。当图标沿着略呈卵形的路径动画时,它看起来确实更好......大理石描述试图弄清楚我正在尝试做什么。更好的想法可能是想象磁铁可以排斥所有在凹槽中移动的东西 - 移动一个并且它的邻居也会移动,但不一定在拖动的磁铁随着路径弯曲的方向移动。

现在问题是跟随一个圆创建的简单路径之一,但我真的想知道如何沿任意路径动画对象,仅通过触摸控制位置,不涉及速度或方向的计算。

5 个答案:

答案 0 :(得分:7)

您可以在图层树中使用hierarchical nature of timelines来实现您的目标。实现CAMediaTiming的对象(包括CAAnimationCALayer)继承了父级的时空,他们可以修改(通过缩放,移位和重复)并传播给他们的子级。通过将图层的speed属性设置为0.0并手动调整timeOffset属性,您可以将该图层(及其所有子图层)与通常的时间概念分离。

在您的情况下,您要做的是定义所有菜单项的动画,以便在时间 t 0 期间沿着您想要的CGPath设置其位置的动画。到 t 1 ,每个动画上都有相应的timeOffset,以使你的项目保持适当的间距。请注意,动画上的beginTime 0.0通常被解释为从动画添加到其图层开始,所以如果你想要 t 0 到是0.0,你可能不得不将它设置为一个小的epsilon> 0.0。

CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
animation.beginTime = 1e-100;
animation.duration = 1.0;
animation.fillMode = kCAFillModeBoth;
animation.removedOnCompletion = NO;
animation.path = path;
animation.calculationMode = kCAAnimationPaced;
animation.timeOffset = timeOffset;

然后在父图层(仅包含这些菜单项)上将speed属性设置为0.0,并将其timeOffset更新为 t 之间的值0 t 1 以响应您的触摸事件。

这种方法有两个潜在的警告。因为您已经在这个图层子树上接管了时间的本质,所以您可能无法同时为其他属性设置动画。此外,如果您想要快速轻弹的滑行行为,您可能需要自己制作动画时间。

答案 1 :(得分:1)

如果您的目标是iOS 4.0或更高版本,则可以使用new block based class methods启动对view对象的动画更改。因此,从触摸事件中,您可以对视图中的属性启动动画更改:

[UIView animateWithDuration:1.0 animations:^{
    yourView.alpha = 0.0; // fade out yourView over 1 second
}];

N.B。这可以很容易地改变视图上的另一个属性,比如它的位置。您可以通过以下方式为视图设置以下属性:

@property frame
@property bounds
@property center
@property transform
@property alpha
@property backgroundColor
@property contentStretch

如果您要定位早期版本的iOS,则需要使用UIView beginAnimationscommitAnimations方法来创建动画块:

[UIView beginAnimations:nil context:context];
[UIView setAnimationDuration:1.0]; 
yourView.alpha = 0.0;
[UIView commitAnimations];

这个东西效果很好,一旦你开始使用它,你必须小心你不要上瘾。 ;)

评论更新:

您可以将大理石的位置绑定到触摸事件的位置。获得touchesEnded事件后,您可以使用动画块为大理石的位置设置动画。

答案 2 :(得分:1)

速度=距离/时间。您可以尝试根据移动的触摸和时间给予延迟。您可以计算touchesBegan和touchesEnded方法之间的时间。

答案 3 :(得分:0)

我不完全确定我完全理解你想做什么,但是......为什么不在用户手指的任何地方画出大理石呢?不需要动画。 如果你想在用户离开后保持大理石移动,你需要保持一个动量的概念,并使用它来动画大理石减速。您可以使用CoreAnimation或计时器。

答案 4 :(得分:0)

我会在移动的触摸中进行速度计算,并将其添加到块可以通过计时器变异的局部变量。

换句话说,在移动的触摸中进行速度计算时要记住先前速度的方向。在触摸结束时,发射一个块,翻译“大理石”,在你不喜欢的时候衰减速度。如果用户再次移动大理石,修改局部变量,这将反过来加速大理石的动画或减慢大幅度/改变方向,具体取决于触摸的方向。