One of the most consistent referrers to Alloylove.com is from a question on Appcelerator’s forum called “Android Slide Menu ( like G+, Facebook, Wunderlist ).”
Apparently there are a lot of people, including myself, that want to know how to easily implement a slide menu like Facebook (pre-iOS7), Path and various others. Below is a list of resources to help you get the slide menu feature in your apps. I have separated this post into two lists, Alloy and Classic.
Also you will notice that each of the resources is tagged with one of three tags native, window, and view. These three tags represent the three different ways that you can achieve the sliding menu effect. Each one has it’s advantages and disadvantages, it is really up to you to figure out which one works best for your situation.
Alloy
If you are using Alloy, this is extremely simple. Here are two repos that will get you on your way to sliding menus. Matt Congrove’s (com.mcongrove.slideMenu) contains instructions and sample code for really simple integration.
- View – alloy-widget-drawermenu – An Appcelerator Alloy Widget to implement a “drawer-style” menu just like Facebook’s and YouTube’s
- View – com.mcongrove.slideMenu – A sliding menu, built on Titanium Alloy.
- View – ds.slideMenu – Blog post about the widget
Classic
With classic this is going to be a little more complicated and require a substantial amount more code on your part. Below I have linked some resources about adding the slide menu to a classic Titanium project.
- Native – MASlidingMenu – A BETA facebook / path style sliding menu for iOS and Android (Android is still in-progress)
- Native – NappDrawer – A side drawer navigation container view controller for Appcelerator Titanium.
- Native – TiSideMenu – iOS 7 style side menu with parallax effect.
- View – CoverSliderExample – Github repo with an example application. (Note: This is iOS only)
- Window – titanium-facebook-slide-menu – Github repo with an example application. (Note: This is iOS only)
- Window – Titanium Mobile: Create a Sliding Menu for iOS – Full tutorial on how to add this to an existing project. (Note: This is iOS only)
- Window – ti-yet-another-slider-menu – A sample ‘Facebook’ style slider for Titanium
Another option would be to dig into one of the Alloy widgets above and convert it to a classic project. Doing this would be a decent amount of work, but if you have a classic app and you want a great sliding menu for it that may be the best solution since most of the Alloy projects are more recently maintained.
If I have missed your favorite library please leave a comment so that we can share it with the rest of the community.
Comments
Nico
Hey,
i think you’ve missed the best one around here:
https://github.com/viezel/NappDrawer
( I think for the future we don’t need to post examples, that are running slow on either ios (or more often) on android. Thus to ensure a high quality on this site and only offer the best modules around there. ) :)
best,
Nico
Josh Jensen Post author
Hey Nico, I will add that to the list above. I totally agree, we should definitely strive to provide the highest quality examples and code sources so I really appreciate your comment. I wanted to include a number a methods for getting the slide effect into the app, but you are absolutely right, some are much better than others.
Matthew Congrove
Thanks for the round-up, Josh. And thanks for including my widget.
I have to cast another vote in favor of people using the NappDrawer module, though. It’s a great implementation, and my widget has a drawback… it was specifically made for apps that are single-window (using views where windows would normally be used for subsequent screens). If that’s how your app is laid out, though, it gives you more control and is easier to customize than NappDrawer. Just an FYI for everyone.
Nico
Sound good :)
(I was afraid that my comment was to aggressive – but you get it totally right^^)
Marcel Pociot
Hey,
I’d like to add my own module to the list.
TiSideMenu – https://github.com/mpociot/TiSideMenu
It’s a different design approach and only runs on iOS, but I think it shouldn’t be missing on this list!
Greetings,
Marcel
Tban
In Alloy, I have used this widget
https://github.com/ricardoalcocer/alloy-widget-drawermenu
Same result for ios and android
Edwin Ardiwinata
There’s another one by Jeff Bones for Classic https://github.com/jeffbonnes/ti-yet-another-slider-menu
Josh Jensen Post author
Thanks all for the comments. I have updated the post with each of your suggestions. By the way, it may be iOS only but Marcel Pociot’s TiSideMenu is really slick. I hope I can use it in one of my projects soon.
Carlos C
Thanks for this useful post!
What about a GitHub use case?
Josh Jensen Post author
Hey Carlos,
Thanks for the comment, I am sorry but I am not sure what you are asking for? Do you mean a sample app?
Carlos Henrique Zinato
Thank you for sharing Josh!
I’ve used Titanium PaperFold module that comes with a nice side menu example!
https://github.com/atsusy/TiPaperFold
Sourabh
Hey,
I tried the same widget as well, I always get app restart when change from one view to another, need help in opening up different views on each row click
Manuel Lehner
I think Tripvi’s DrawerLayout should also be on the list: https://github.com/Tripvi/Ti.DrawerLayout
It’s only Android but a very good implementation.
Claire Williams
I have been looking for an Alloy solution, thus originally ignored the NAppDrawer solution; until I delved further and found the widget https://github.com/FokkeZB/nl.fokkezb.drawer uses the NAppDrawer module; therefore can you add this widget to the Alloy list as it would of saved me lots of time, it’s just what I have been looking for (and this page is great too, a compiled list of good slider menus was really helpful, apart from this one omission for me!) Many Thanks :)
Ravi.G
Could someone please provide the best Alloy Menu Widget that works perfectly for both iOS & Android. ?
Appreciate your help.
Rene
Hello
Anyone has a code in classic language, not a module ? Because sometimes the module is never updated so it s hard do trust.
Thanks
Jong
Check this widget. https://github.com/yomybaby/kr.yostudio.drawer :)