iPhone dev: Creating sliding drawers like Path and

Question

The new Facebook app seem to have done away with the grid-icon layout, with a more interesting custom navigation layout where the bottom-most view shows all the options (like Profile, News Feed, Messages etc for Facebook) and clicking on one of them brings another view sliding over the top. You can press the 3-lines button to then expose the bottom-view again, but the current view is partially visible. The Path app also recently updated to match this scheme.

What's the best way to recreate this? I've searched for any open-source options but haven't found them. Three20 doesn't seem to support this either.

Answer 1

Check my answer here - SplitView like Facebook app on iPhone - which contains a list of open-source codes.

Answer 2

Here's another one: PPSlideDrawer.

http://www.localwisdom.com/blog/2013/05/simple-sliding-drawer-implementation-for-ios/

I checked out @Ephraim's answer (http://code.google.com/p/drawer-navigation-controller/) because it seems pretty easy to work with. The problem, it seems, with drawer-navigation-controller is that the swiping animation does not follow the user's finger--it is automated. PPSlideDrawer aims to solve that. I'm about to try it out in my project and will post some updates.

Might be a dealbreaker for some that the following are still under "TODO:"

1. Implement auto open functionality.
2. Implement swipe from edge functionality(rather than just detect panning gesture).
3. Landscape support.

Answer 3

Everything I've seen on the internet and those recommended by Yosi Taguri are all way too complicated. Drawers can be achieved by a very simple category to UINavigationController with no graphics asset whatsoever and no class extension needed, and backwards compatible with iOS 3.0!

Take a look a this:

http://code.google.com/p/drawer-navigation-controller/

Here is a video http://www.youtube.com/watch?v=5T-1-_pFbG0

Answer 4

I found a really nice project on github:

https://github.com/devindoty/DDMenuController