Question

我正在努力实现与卡片应用（http://www.youtube.com/watch?v=aWjX_qufmc0）相同的效果，以打开内部的内容（横向贺卡开场类型动画：https://store.marathonpress.com/image/cache/data/store_381/Previews/Press-Printed-Card-Folded-5x7-H-C-500x500.jpg）。我已经尝试使用CABasicAnimation但没有访问权限，有人可以帮助我实现相同的动画效果。

我这样想：

- (void)loadInsideMessageView {

    [UIView transitionWithView:backgroundView
                      duration:1.0
                       options:UIViewAnimationOptionTransitionFlipFromBottom //any animation
                    animations:^ {
                        insideView.frame = CGRectMake(0, 40, 568, 280);
                        [backgroundView addSubview:insideView];
                    }
                    completion:nil];
}

感谢。

Answer 1

要创建必要的动画，您可以使用Core Animation Function。

创建新的Single View Application项目并在ViewController.m中插入以下代码，了解其工作原理。

- (void)viewDidLoad {
  [super viewDidLoad];
  [[self view] setBackgroundColor:[UIColor grayColor]];

  //create frame for 2 test views
  CGRect frame = CGRectMake(50.0, 100.0 , 200.0 ,100.0);

  //lower view
  UIView *insideViev = [[UIView alloc] initWithFrame: frame];
  [insideViev setBackgroundColor:[UIColor redColor]];

  //upper view
  UIView *pageView = [[UIView alloc] initWithFrame:frame];
  [pageView setBackgroundColor:[UIColor greenColor]];

  [[self view] addSubview:insideViev];
  [[self view] addSubview:pageView];

  //get layer of upper view and set needed property
  CALayer *viewLayer = [pageView layer];
  [viewLayer setAnchorPoint:(CGPoint){0.5 , 0.0}];
  [viewLayer setFrame:frame];

  //create perspective
  CATransform3D mt = CATransform3DIdentity;
  mt.m34 = 1.0/-500.;

  //create rotation
  CATransform3D open = CATransform3DMakeRotation(3 * M_PI_4, 1, 0, 0);

  //create result transform
  CATransform3D openTransform = CATransform3DConcat(open, mt);

  [UIView animateWithDuration:3.0 animations:^
   {
 //close animation
 [viewLayer setTransform:openTransform];
   } completion:^(BOOL finished)
   {
     [UIView animateWithDuration:3.0 animations:^
      {
        //close animation
        [viewLayer setTransform:CATransform3DIdentity];
      }];
   }];
}

动画像卡app iphone

1 个答案: