Slide Navigation View Controller

Building an app with slide navigation to reveal a hidden view/menu beneath the main view, like one seen in Facebook and Piggie (picture of the left) ?

Well, that is exactly the purpose of the slide navigation view controller discussed in this post.

Why a view hidden beneath the main view?

I think there are at least 2 reasons for this design.

• Reserve valuable screen real estate, this is true especially for the iPhone. With very limited space available, you want to keep only the important things front and center.
• Cleaner/Uncluttered look and feel. For the sample apps mentioned above, It will easily clutter the screen when the ‘hidden’ view that contains menus/buttons are constantly shown.

MWFSlideNavigationViewController

This component is designed to be simple and easy to use. You call initWithRootViewController: method to initialize with a root UIViewController object. The root view controller is the main view of your application.

Subsequently, you can call slideForViewController:direction:portraitOrientationDistance:landscapeOrientationDistance: to reveal the secondary hidden view. The same method is used to slide the main view back.

This method takes 4 parameters:

•  viewController, this is the view controller that manages the secondary hidden view. If you call this method to slide the main view back, you can supply nil value for the view controller.
• direction, i.e. MWFSlideDirectionUp, MWFSlideDirectionLeft, MWFSlideDirectionDown, MWFSlideDirectionRight. To slide main view back, use MFWSlideDirectionNone.
• portraitOrientationDistance, the slide distance in pixels when in portrait orientation.
• landscapeOrientationDistance, the slide distance in pixels when in landscape orientation.

For custom/application specific behavior on the event when the sliding will/did occur, your can implement the MWFSlideNavigationViewControllerDelegate protocol. Example usage of the protocol is demonstrated in the Demo app, to show overlay view with tap gesture recognizer on the main view. When the overlay view is tapped, it slides the main view back to conceal the secondary view.

Additionally, there is a category included to provide convenient access to the slide navigation view controller to your view controller. Just like the built-in navigationController property in UIViewController.

How to use in your project

Download/fork the source code from Github, then add the MWFSlideNavigationController .h and .m files into your project.

Requirements

• iOS 5 and above only
• Full ARC

Source Codes and Documentation

The source codes are hosted at github.
You can refer to the documentation here.

Licensing

This is free and open source component covered under the MIT license. You are free to use and modify the source as long as you retain the copyrights and include permission notice in all copies/substantial portions of your software.

For attribution free license, you can contact me at meiwin@blockthirty.com.

Hope this component helps in your project. You can consider paypal donation to venansius.meiwin@gmail.com if you like what you see.

 

Updates: new post describing changes introduced in version 0.2