New Slide Out Animation for iOS

In many recent applications on app store I have seen a new type of UIView animation. Applications like Facebook are using a new concept of slide in/out animation. This slide out animation concept can give your application a rich UI. So I thought why not create a sample application to try it out. At the end of the blog I will attach the sample project.

Let's get straight on this...

Following video shows the sample project that I wrote for this. You can see that I am using a map view as the main view and a table view as the slide in/out view.

The Main View controller

In the sample I have created a Main View Controller which is subclassed from UIViewController. This  class is the root view controller for the main navigation controller. It manages our two views: 1. MapView 2. TableView. Following image shows the interface builder layout.

Let's Slide In/Out the Table View

The method to perform the actual slide in/out animation looks something like this:

It was that simple...really? What is it doing?

So the method uses UIView animation method: animateWithDuration.  It gets the table view's frame and sets the origin of the map view to the width of the table view. The animation is done over a period of 0.25 seconds. You can obviously choose what ever value that best fits your need. When you select the same menu button again method also resets (slides out the table view) the entire view. That's the reason why it checks weather the table view is already hidden or not. If table view is hidden it slides it in otherwise it slides it out.

Continue reading here...

Goto Sample Project: SlidingUiView