【问题标题】:How to scale and rotate a view in a single animation如何在单个动画中缩放和旋转视图
【发布时间】:2012-02-18 12:54:00
【问题描述】:

我试图通过使其从屏幕中心出现并增长到完整尺寸来呈现视图,同时以 3D 方式围绕 x 轴旋转它。当我创建视图时,我对其应用变换以确保它被缩小并旋转以开始(它是如此之小以至于实际上不可见),然后我尝试使用这样的 CATransform3D:

CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform"];
CATransform3D transform = CATransform3DRotate(view.layer.transform, M_PI, 1.0, 0, 0);
transform = CATransform3DScale(transform, 1000, 1000, 1000);
transform.m34 = 1.0 / 10000;
[anim setToValue:[NSValue valueWithCATransform3D:transform]];
[anim setDuration:0.75f];
anim.removedOnCompletion = NO;
anim.delegate = self;
[view.layer addAnimation:anim forKey:@"grow"];

但是这个动画并没有改变图层的实际变换,所以我也这样做了:

- (void)animationDidStop:(CAAnimation *)theAnimation finished:(BOOL)flag {
    view.layer.transform = CATransform3DIdentity;
    [view.layer removeAllAnimations];
}

设置动画停止后的变换。但是,这有时会导致动画结束时出现明显的闪烁。我相信这是因为动画将原始变换放回动画阶段的末尾,并且这会在调用 animationDidStop 例程之前瞬间发生。有没有更好的方法来做到这一点?

编辑:将其合并到 UIView 动画中,这样您就可以直接设置变换:

view.layer.transform = CATransform3DScale(CATransform3DIdentity, 0.001, 0.001, 0.001);
view.layer.transform = CATransform3DRotate(view.layer.transform, M_PI, 1.0, 0.0, 0.0);

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.75];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
CATransform3D transform = CATransform3DRotate(view.layer.transform, M_PI, 1.0, 0, 0);
transform = CATransform3DScale(rotationTransform, 1000, 1000, 1000);
transform.m34 = 1.0 / -500;
view.layer.transform = transform;
[UIView commitAnimations];

但是,我仍然希望得到原始查询的答案,即如何使用 CAAnimation 成功实现相同的目标,因为这通常为动画提供了更大的灵活性。

Edit2:似乎我最初的问题(如何解决 CAAnimation 的问题)的答案实际上非常简单。为了保持结束状态(并消除闪烁),我只需要添加以下行:

anim.fillMode = kCAFillModeForwards;

【问题讨论】:

  • 不,它在动画层上设置为 YES。
  • 不幸的是,它没有任何区别。

标签: iphone ios core-animation rotation scale


【解决方案1】:

这可能会对您有所帮助:

  animationView.layer.anchorPoint = CGPointMake(0.0f, 0.0f);

  animationView.center = CGPointMake(0, 
                                  (animationView.center.y - 
                                   (animationView.bounds.size.height/2.0f)));

  // start the Page Open
  [UIView beginAnimations:@"Animation" context:nil];
  [UIView setAnimationDuration:2.0];     
  // set angle as per requirement
  [animationView.layer setValue:[NSNumber numberWithInt:180] 
                  forKeyPath:@"transform.rotation.x"];

  [UIView commitAnimations];

【讨论】:

  • 谢谢,但我认为这并没有达到我的目标。我知道当动画完成时会保留变换,但它不允许缩放,或者最重要的是您使用 CATransform3D 获得的透视。
  • 好的,我将整个变换放在 UIView 动画中,view.layer.transform = transform;,这样就成功了。感谢您的指点。我以为你必须使用 CAAnimation 来做图层动画,但似乎我错了。
  • 但是,我仍然想知道如何使用 CABasicAnimation 解决这个问题 :)
  • 欢迎您.. 您能否在问题中添加解决方案,以便对其他人也有用。 :)
【解决方案2】:

我知道这不是您可能希望得到的简洁而简短的答案:)

但是在这里(UIView Animation Tutorial: Practical Recipes ) 您可以找到一个可下载的示例,该示例还展示了如何进行缩放和旋转。

如果你运行这个例子,你可以看到比例和旋转,点击HUD然后点击停止。

【讨论】:

  • 感谢您的链接,我喜欢“排水”动画,已经合并了;)。它还提供了一些其他有用的指示。
【解决方案3】:

有关 iPad 应用商店如何旋转和缩放以获取答案和代码,请参阅此主题:How can I flip and enlarge a UIView it at the same time like iOS 7 iPad App Store?

【讨论】:

    猜你喜欢
    • 2018-04-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-22
    • 1970-01-01
    • 2010-11-08
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多