IOS viewing animation "folding"

Question

I saw this nice effect , and I would like to use something similar in the application that I am currently developing. I guess this is not one of the “standard” transitions.

Does anyone know how something like this can be achieved? I am not quite after a detailed code code, a higher level of review / pushing in the right direction.

Answer 1

I would do it like this:

• Create two layers: one for the left and one for the right of the view that you want to reset.

• In these layers, visualize the image of the left or right side of the view to be folded, respectively. The renderInContext: method should do this in most cases.

• The initial position of the two layers is on the left edge of the screen (x = 0,0). Set the anchor point of the left layer (0.0, 0.5) and the right layer (1.0, 0.5). You should also assign a rotation rotation around the y axis for the layers: -90 degrees for the left layer and +90 degrees for the correct layer (or vice versa, I'm not sure, try it).

• Now, when the user activates the bending action, start the animation (or continue with a gesture), which resets the transformations of the two layers into a single matrix. You may also need to adjust the correct position of the layer so that it does not touch the left edge of the screen.

• Only when the animation / gesture is complete do you replace the two layers (containing only the static image) with the actual representation that you would like to collapse.