翻转，增长和翻译animation

看看这个 MLB蝙蝠应用程序的video 。 基本上，我只想呈现一个带有UIModalPresentationFormSheet风格的UIModalPresentationFormSheet并从另一个视图增长，然后翻转。 就像在MLB应用程序的记分牌上点击游戏一样。 任何人都知道我可以做到这一点？

谢谢

编辑：我的主要观点是几乎相同的设置作为MLB应用程序。 我正在使用AQGridView并希望点击网格视图中的单元格时发生animation。

编辑2：我也打开了沟渠UIViewController概念，只是使用普通的UIView ，然后手动复制UIModalPresentationFormSheet的样式，如果更容易。

编辑3：好吧，忘记使用UIViewController来做到这一点，因为我没有得到任何答复，我会认为这是不可能的。 我的新问题是如何使用UIView的在发布的video中复制animation？ 所以基本上，最初的观点需要同时增长，移动和翻转。

编辑4：我想我有实际的animation想通了，现在我唯一的问题是计算坐标饲料CATransform3DTranslate 。 我的观点需要在video中非常像animation。 它需要重新开始另一个视图，并在屏幕中心生成animation。 下面是我正在试图计算在中心popup的视图的坐标：

 CGPoint detailInitialPoint = [gridView convertPoint:view.frame.origin toView:detailView.frame.origin]; CGPoint detailFinalPoint = detailView.frame.origin; 

gridView是我的主视图的容器视图，包含较小的网格项目。 view是我们正在animation的特定网格项目。 而detailView是在屏幕中间出现的视图。

Answer 1

您可以使用UIViewControler上的类别实现自己的转换。

的UIViewController + ShowModalFromView.h

 #import <Foundation/Foundation.h> #import <QuartzCore/QuartzCore.h> @interface UIViewController (ShowModalFromView) - (void)presentModalViewController:(UIViewController *)modalViewController fromView:(UIView *)view; @end 

的UIViewController + ShowModalFromView.m

 #import "UIViewController+ShowModalFromView.h" @implementation UIViewController (ShowModalFromView) - (void)presentModalViewController:(UIViewController *)modalViewController fromView:(UIView *)view { modalViewController.modalPresentationStyle = UIModalPresentationFormSheet; // Add the modal viewController but don't animate it. We will handle the animation manually [self presentModalViewController:modalViewController animated:NO]; // Remove the shadow. It causes weird artifacts while animating the view. CGColorRef originalShadowColor = modalViewController.view.superview.layer.shadowColor; modalViewController.view.superview.layer.shadowColor = [[UIColor clearColor] CGColor]; // Save the original size of the viewController's view CGRect originalFrame = modalViewController.view.superview.frame; // Set the frame to the one of the view we want to animate from modalViewController.view.superview.frame = view.frame; // Begin animation [UIView animateWithDuration:1.0f animations:^{ // Set the original frame back modalViewController.view.superview.frame = originalFrame; } completion:^(BOOL finished) { // Set the original shadow color back after the animation has finished modalViewController.view.superview.layer.shadowColor = originalShadowColor; }]; } @end 

这可以很容易地改变使用任何animation过渡你想要的; 对于你的，你可能想要使用CA3DTransform。 希望这可以帮助！

Answer 2

要翻转，增长和翻译animation，可以使用以下代码：

 - (void)animate { int newX, newY; //New position int newW, newH; //New size [UIView animateWithDuration:someDuration delay:someDelay animations:^{ yourView.transform = CATransform3DMakeRotation(M_PI_2,1.0,0.0,0.0); //flip halfway yourView.frame = CGRectMake(newX/2, newY/2, newW/2, newH/2); } completion:^{ while ([yourView.subviews count] > 0) [[yourView.subviews lastObject] removeFromSuperview]; // remove all subviews // Add your new views here [UIView animateWithDuration:someDuration delay:someDelay animations:^{ yourView.transform = CATransform3DMakeRotation(M_PI,1.0,0.0,0.0); //finish the flip yourView.frame = CGRectMake(newX, newY, newW, newH); } completion:^{ // Flip completion code here }]; }]; } 

希望这可以帮助！

Answer 3

好的，我明白了。 以下是我所做的：

 CGFloat duration = 0.8; /* //Detail View Animations */ CATransform3D initialDetailScale = CATransform3DMakeScale(view.frame.size.width/vc.view.frame.size.width, view.frame.size.height/vc.view.frame.size.height, 1.0); CATransform3D initialDetailTransform = CATransform3DRotate(initialDetailScale, -M_PI, 0.0, -1.0, 0.0); CATransform3D finalDetailScale = CATransform3DMakeScale(1.0, 1.0, 1.0); CATransform3D finalDetailTransform = CATransform3DRotate(finalDetailScale, 0.0, 0.0, -1.0, 0.0); NSMutableArray *detailAnimations = [NSMutableArray array]; CABasicAnimation *detailTransform = [CABasicAnimation animationWithKeyPath:@"transform"]; detailTransform.fromValue = [NSValue valueWithCATransform3D:initialDetailTransform]; detailTransform.toValue = [NSValue valueWithCATransform3D:finalDetailTransform]; detailTransform.duration = duration; [detailAnimations addObject:detailTransform]; CABasicAnimation *detailFadeIn = [CABasicAnimation animationWithKeyPath:@"opacity"]; detailFadeIn.fromValue = [NSNumber numberWithFloat:1.0]; detailFadeIn.toValue = [NSNumber numberWithFloat:1.0]; detailFadeIn.duration = duration/2; detailFadeIn.beginTime = duration/2; [detailAnimations addObject:detailFadeIn]; CABasicAnimation *detailMove = [CABasicAnimation animationWithKeyPath:@"position"]; detailMove.fromValue = [NSValue valueWithCGPoint:vc.view.layer.position]; detailMove.toValue = [NSValue valueWithCGPoint:self.view.layer.position]; detailMove.duration = duration; [detailAnimations addObject:detailMove]; CAAnimationGroup *detailGroup = [CAAnimationGroup animation]; [detailGroup setAnimations:detailAnimations]; [detailGroup setDuration:duration]; detailGroup.removedOnCompletion = NO; detailGroup.fillMode = kCAFillModeForwards; detailGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; [vc.view.layer addAnimation:detailGroup forKey:@"anim"]; /* //Grid Item View Animations */ CATransform3D initialGridScale = CATransform3DMakeScale(1.0, 1.0, 1.0); CATransform3D initialGridTransform = CATransform3DRotate(initialGridScale, 0.0, 0.0, 1.0, 0.0); CATransform3D finalGridScale = CATransform3DMakeScale(vc.view.frame.size.width/view.frame.size.width, vc.view.frame.size.height/view.frame.size.height, 1.0); CATransform3D finalGridTransform = CATransform3DRotate(finalGridScale, M_PI, 0.0, 1.0, 0.0); NSMutableArray *gridAnimations = [NSMutableArray array]; CABasicAnimation *gridTransform = [CABasicAnimation animationWithKeyPath:@"transform"]; gridTransform.fromValue = [NSValue valueWithCATransform3D:initialGridTransform]; gridTransform.toValue = [NSValue valueWithCATransform3D:finalGridTransform]; gridTransform.duration = duration; [gridAnimations addObject:gridTransform]; CABasicAnimation *gridFadeOut = [CABasicAnimation animationWithKeyPath:@"opacity"]; gridFadeOut.fromValue = [NSNumber numberWithFloat:0.0]; gridFadeOut.toValue = [NSNumber numberWithFloat:0.0]; gridFadeOut.duration = duration/2; gridFadeOut.beginTime = duration/2; [gridAnimations addObject:gridFadeOut]; CABasicAnimation *gridMove = [CABasicAnimation animationWithKeyPath:@"position"]; gridMove.fromValue = [NSValue valueWithCGPoint:view.layer.position]; gridMove.toValue = [NSValue valueWithCGPoint:[self.view.layer convertPoint:self.view.layer.position toLayer:gridView.layer]]; gridMove.duration = duration; [gridAnimations addObject:gridMove]; CAAnimationGroup *gridGroup = [CAAnimationGroup animation]; [gridGroup setAnimations:gridAnimations]; gridGroup.duration = duration; gridGroup.fillMode = kCAFillModeForwards; gridGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; gridGroup.removedOnCompletion = NO; [view.layer addAnimation:gridGroup forKey:@"anim"]; 

我正在做一个AQGridView的项目。 在我的代码示例view是我animation的AQGridViewCell的实例。 而vc.view是我显示的细节UIViewController / UIView 。

Answer 4

我强烈build议看看这个post。

你不需要亲自处理所有这些animation。

如果使用UIView类方法transitionFromView：toView：duration：options：completion：并传入UIViewAnimationOptionTransitionFlipFromLeft或UIViewAnimationOptionTransitionFlipFromRight – 无论您希望animation翻转的方式。

我使用这种方法实现了与MLB应用程序中显示的相同的function。 你from view将是网格中的单元格， to view将是单元格背面的东西。

希望这会减less你需要的整体代码。

Answer 5

我将使用一个UICollectionView与自定义的UICollectionViewCell和animation与它的委托调用…只是一个例子让别人挑选。

 #pragma mark - UICollectionViewDelegate - (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath: (NSIndexPath *)indexPath { [UIView beginAnimations:@"showImage" context:Nil]; CGRect cellFrame = cell.frame; CGRect imgFram = cell.imageView.frame; [UIView setAnimationDuration:0.8]; [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:cell cache:YES]; cellFrame.size = CGSizeMake(200, 200); cellFrame.origin.y = 10; cellFrame.origin.x = 45; cell.frame = cellFrame; imgFram.size = CGSizeMake(200, 200); cell.imageView.frame = imgFram; [collectionView bringSubviewToFront:cell]; [UIView commitAnimations]; }