9

I have been working on application which is a clone of iBooks, and for last 2 days I have been trying to animate the book cover flow like iBook app perform .

This is an iBooks ScreenShot, I have my book shelf exactly like this:

enter image description here

When the user taps on any book I want to perform animation transition like this :

enter image description here

enter image description here

You can see the book cover flip on left and white view is of new viewcontroller which is for loading the content of the book.

Can anyone please help me with this issue? I want to perform exactly the same animation. with two viewcontrollers.

Kara
  • 5,650
  • 15
  • 48
  • 55
munibsiddiqui
  • 435
  • 5
  • 15
  • 1
    similar question: http://stackoverflow.com/questions/8499601/open-close-unfolding-book-animation-in-ibooks – shahid-rasheed Jul 20 '12 at 06:03
  • Thanks for reply ,but prob is there is difference between UIView animation and UiViewController animation . – munibsiddiqui Jul 20 '12 at 06:13
  • You could/would probably implement this as a custom segue if you want to transition between two view controllers. The code would be similar as transitioning between two views. I believe that last years WWDC session video for Core Animation had a custom segue (with fire :P) at the end of the video. – David Rönnqvist Jul 20 '12 at 08:16

4 Answers4

5

I have code a ibook open effect demo on github , you can see iBooksOpen

Guo Luchuan
  • 4,659
  • 23
  • 33
  • hi Guo, can I use your iBooksOpen project in my app ? I can't find the licence. Is it open source? Thanks – Max Jul 11 '13 at 18:49
4

Check it out may b this can help you:

   coverView.layer.anchorPoint=CGPointMake(0, .5);
  coverView.center = CGPointMake(coverView.center.x - coverView.bounds.size.width/2.0f, coverView.center.y);

    NSLog(@"%f",coverView.layer.anchorPoint.y);

    [UIView animateWithDuration:.5 delay:0 options:UIViewAnimationCurveEaseIn  animations:^{
        coverView.transform = CGAffineTransformMakeTranslation(0,0);
        CATransform3D _3Dt = CATransform3DIdentity;
        _3Dt =CATransform3DMakeRotation(3.141f/2.0f,0.0f,-1.0f,0.0f);
        _3Dt.m34 = 0.001f;
        _3Dt.m14 = -0.0015f;
        coverView.layer.transform =_3Dt;
    } completion:^(BOOL finished){
        if (finished) {
            [self animateCurrentViewController];
            [self toolBarAndNavigationBarNeedToShow:YES];
        }
    }];

CoverView is nothing but ur's view

sachin
  • 1,015
  • 4
  • 11
  • 24
1

Legend: LibraryViewController - the shelf thingy with books ReadingViewController - the ViewController where reading occurs (see last image of the question)

Lets say the cover is UIImageView. Using iOS 5.0+ you can add readingViewController as a subview of LibrabryViewController. Then one of the animations is zooming the book (readingViewController + UIIMageView). I suggest here animating a UIView which is a container of both. Second one is fliping the cover:

UIIMageView.transform = CGAffineTransformMake(a,b,c,d,tx,ty); I think a and d should be -1 here See more for CGAffineTransform

P.S. This seems an interesting problem. Please let me know if my suggested method is possible!

Riskov
  • 834
  • 7
  • 12
0

i am not sure but may be you can try UIPageViewController, it will give you book effect. here is link: http://developer.apple.com/library/ios/#DOCUMENTATION/UIKit/Reference/UIPageViewControllerClassReferenceClassRef/UIPageViewControllerClassReference.html

sachin
  • 1,015
  • 4
  • 11
  • 24
  • Thanks for the quick reply , but sir UipageViewController gives ur curl effect during turning pages which i have already achieved , what i want is the book cover opening effect – munibsiddiqui Jul 20 '12 at 05:59