Saturday, October 13, 2012

Remove views with nice animations

In iOS is very simple to create effective animations on UI components.

For an app I'm currently working on, I would like to create an animation on a set of views, vertically aligned. When user taps on a button inside the view, the app should start an animation that translates and rotates te view offscreen, while fading it at the same time. At the same time, all the views below it, should react by translating up occupying the space left by the removed view.

This is the initial scenario:

To perform this effect, we need two different animations, one on the view to delete, and the other on the views below it.

This is the first one:

To translate all the views below the one that we want delete, we first need to find them:

 and then we can apply the translation to all of them:

The complete sample project can be found here: