How to flip between views like FlipBoard Animation

Question

I want to switch from one view to another view in iOS 5, it switch normally.

But I want to flip between views like FlipBoard animation.

Is it possible? If it is, Please help me to do this in my project.

Thank you in advance.

Answer 1

Have a look at this

https://github.com/ITechRoof/ITRFlipper

This is much simpler and easy to use with custom views.

Answer 2

Download the code at this link.It renders exact output like the flipBorad

Answer 3

Have a look at: https://github.com/mpospese/MPFoldTransition this may help you

Answer 4

I attempted to solve this problem by using CALayers and Core Animation. I have two main layers to accomplish this animation, a static layer and an animation layer.

The static layer is the size of the entire view. This layer does not animate it simply holds two images, the left and right side (left and right side images are screen shots of the pages you want to flip too). The animation layer is half the size of the entire view, and this layer animates to perform the flip animation. The animation layers front and back side are also screen shots of the current page and next page.

For example lets say we want to flip to the next page.

The static layer's left side will contain a screen shot of the left side of the current page. The Right side will contain a screen shot of the right side of the next page. The animation layer will sit on top of the static view and its front side will contain an screen shot of the right side of the current page. The back of the animation layer will contain a screen shot of the left side of the next page.

As you pan your finger you will perform a CATransform3DRotate on the y axis of the animation layer. So, as your finger moves from the right side of the screen to the left, the animation layer will flip over and reveal the right side of the static view and back side of itself.

Here is the basic code to perform a flip animation on a layer (animationLayer CALayer).

    var t = CATransform3DIdentity
    t.m34 = 1.0/850 //Adds depth to the animation
    t = CATransform3DRotate(t, newRadianAngleValue, 0, 1, 0)

    CATransaction.begin()
    CATransaction.setAnimationDuration(0)
    yourAnimationCALayer.transform = t
    CATransaction.commit()

I created my own library that uses this basic concept, check it out. (still a work in progress though)

https://github.com/djk12587/DJKSwiftFlipper