CODEWITHSUNDEEP
iosiphonecore-animationflipcabasicanimation
york
york

Reputation: 149

Animation like cards app iphone

I am trying to achieve the same effect like in cards app (http://www.youtube.com/watch?v=aWjX_qufmc0) for opening the content inside (Horizontal greeting card opening type animation: https://store.marathonpress.com/image/cache/data/store_381/Previews/Press-Printed-Card-Folded-5x7-H-C-500x500.jpg). I have tried it using CABasicAnimation but no access, Can someone help me to achieve the same animation effect.

I am trying like this:

- (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];
}

Thanks.

Upvotes: 1

Views: 1314

Answers (1)

Ruslan Soldatenko
Ruslan Soldatenko

Reputation: 1728

For create necessary animation you can use Core Animation Function.

Create new Single View Application project and insert the code below in ViewController.m for see how it works.

- (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];
      }];
   }];
}

Upvotes: 2

Related Questions