Friday, May 3, 2013

Adding a Foursquare, Google+ like sliding drawer to your android app


Currently Android SDK does not support such a feature. But this kind of designs are very popular between the users. But there are many open source libraries which facilitates sch omplementation. https://github.com/jfeinstein10/SlidingMenu is an open sorce sliding drawer library which is used many poplar android applications. Using this is prettry simple. This video explains how to integrate with your android project. After the integration is done you can create a sliding drawer like this.



Add the following code to onCreate() method of your activity.

    menu = new SlidingMenu(this);
    menu.setMode(SlidingMenu.LEFT);
    menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
    menu.setShadowWidth(5);
    menu.setFadeDegree(0.0f);
    menu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
    menu.setBehindWidth(150); //change width according to your device
    menu.setMenu(R.layout.menu_frame);

Here menu_frame is the layout of the sliding drawer. It has to be a frame layout and you can add any other layout to the frame layout.

If your application has a actionbar you may need to link sliding drawer to the app icon like in Google+ and Youtube Android applications. What is usually happen is toggling the sliding drawer when the app icon is clicked. It can be implemented like this.

@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
       case android.R.id.home:
               menu.toggle();
               return true;
   }
   return true;
 }