Saturday, August 22, 2009

Android : Sliding Drawer Example

If you have lot’s of stuff to put on your screen for a single activity, you should probably go for the SlidingDrawer widget. It is very simple to use, and looks cute. Here are the steps that you need to do for bringing up the sliding drawer on your activity.

Here is a sample application displaying how to code up a sliding drawer. It's pretty simple, and I don't think it needs more explanation.




















<SlidingDrawer android:id="@+id/slidingDrawer1"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:topOffset="50dip" android:handle="@+id/handle"
        android:content="@+id/content">

The sample project sets up a Sliding Drawer at the bottom of the screen. You can change it to appear at place of the screen. You just need to change/adjust some properties of the SlidingDrawer.
  • The orientation property can be set to either "horizontal" and "vertical"
  • There are properties like "topOffset", "bottonOffset", "rightOffset" and "leftOffset" with which you can position your drawer anywhere.
  • With a few more changes, you can attach backgrounds/images to the whole SlidingDrawer. For example, I have added a color background to the content of the Sliding Drawer.
Update: Here is the link to the source code which shows how to cook up a simple sliding drawer.
Pasted by Unknown at 8:25 PM
Chapter: , , , ,

32 comments:

  1. UnknownDecember 9, 2009 at 5:58 PM

    Macha Please help da

    How can we bring sliderdrawer always on top of other views(canvas)

    ReplyDelete
  2. UnknownDecember 9, 2009 at 8:46 PM

    Doesn't this work?? As far as I can remember, this example shows the drawer on top of all the views. Let me have a look at your code and then I can answer.

    ReplyDelete
  3. UnknownDecember 9, 2009 at 11:49 PM

    i have a canvas which is drawn on the ondraw method ..

    pr = new LayoutParams(320,400);
    setContentView(view);
    getWindow().addContentView(displayPanel,pr);
    view.bringToFront();

    this is how i have set the two in the content view .at first the slide drawer is on the top of canvas.. when i click to make it slide it does well. but when i click on the handler to minimise it its getting hidden beneath the canvas..but its there because as i click on the bottom region, aticipating it would be there, its getting sliding in again.. any help will be appreciated.. thanks in advance..

    ReplyDelete
  4. netdiverJanuary 28, 2010 at 10:44 AM

    Thanks for your easy guide!

    ReplyDelete
  5. UnknownMarch 9, 2010 at 8:55 AM

    I pretty much don't know what i'm doing and I'm trying to learn java by trial and error. Where do I place the LayoutInflater code to call the drawer xml file?

    ReplyDelete
  6. UnknownMarch 9, 2010 at 8:56 AM

    In the onCreate of the Activity, you can do this stuff.

    ReplyDelete
  7. UnknownMarch 9, 2010 at 9:33 AM

    Thanks. I can see that it should work, but I'm getting some weird error that says 'params cannot be resolved to a variable'.

    ReplyDelete
  8. UnknownMarch 9, 2010 at 10:40 AM

    Ok, I will improve this tutorial and update it with a simpler one. Will let you know when I do it. I am a bit busy now. Sorry.

    ReplyDelete
  9. Andrew WebberMarch 9, 2010 at 11:27 AM

    I got some other help from someone and I got it working by using: WindowManager.LayoutParams params = getWindow().getAttributes();

    This covers the entire parent area and I'm looking at only having the drawer slide out just far enough to show all of it's contents. Thanks for your help.

    ReplyDelete
  10. AnonymousMarch 24, 2010 at 2:58 PM

    i want to get visible my custom keyboard on edittext... but it is not coming with sliding..will u plz help me.

    ReplyDelete
  11. AnonymousApril 19, 2011 at 7:34 PM

    Thanks for your example. I add this lines and it works:

    import android.view.ViewGroup.LayoutParams;

    public class Quiz extends Activity{
    public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ...
    LayoutParams pr = new LayoutParams(320,400);
    LayoutInflater inflater = getLayoutInflater();
    View view = inflater.inflate(R.layout.drawer, null);
    getWindow().addContentView(view, pr);
    }
    }

    ReplyDelete
  12. SebastianMay 15, 2011 at 6:56 PM

    I have a Optimus One with Android Froyo but i don`t see the slidedrawer ,i installed slidedrawer apk but is launched as a normal aplication and is empty , i need it on top of my home screen or right of the screen (right to left slide) anny sugestions or download links? if some of you know something PLEASE mail me at sebby.curta at gmail.com

    ReplyDelete
  13. SebastianMay 15, 2011 at 7:02 PM

    I have Optimus One running Froyo and i would like to have slidedrawer on my top of the home screen or on my right, i downloaded a zip archive wich contains manny files and installed the apk but the drawer acts as a usual aplication and when i slide it is empty ( no aplications in it), i need it to be permanently on my home screen (like dockbar is) does anny of you know how and/or a download link? is YES please mail me at sebby.curta at gmail dot com

    ReplyDelete
  14. UnknownMay 15, 2011 at 7:05 PM

    Are you using the same sample? Hmm, I think I will write up a detailed post on how to use the sliding drawer and attach the whole source code.

    ReplyDelete
  15. ShubhamJune 8, 2011 at 3:52 PM

    Hi How to use SlidingDrawer for top to bottom.

    ReplyDelete
  16. necronetJuly 7, 2011 at 9:30 PM

    you can't the SlidingDrawer only works from bottom to top although there are other custom components that do something similar

    ReplyDelete
  17. UnknownJuly 7, 2011 at 10:48 PM

    @Jose: Sliding drawers can be made to slide from each of the four sides.

    ReplyDelete
  18. Arpit HadaSeptember 14, 2011 at 6:58 PM

    Hi
    I want to open drawer from top to bottom and slow down the animation speed....how can i achieve it? Please help !!!

    ReplyDelete
  19. UnknownSeptember 15, 2011 at 12:13 AM

    Top to bottom, it's not possible with the default sliding drawer. I don't know yet if you can slow down the animation.

    Check out this link
    http://w2davids.wordpress.com/android-slidingdrawer-top-down-style/

    ReplyDelete
  20. Arpit HadaSeptember 21, 2011 at 2:05 PM

    Thanks for the reply bibek.
    I'll see to it if I can find an alternate to what I want as desired output.

    ReplyDelete
  21. AbilashSeptember 27, 2011 at 7:12 PM

    Thanks Kumar... it helped me to go forward with my project

    ReplyDelete
  22. AnonymousSeptember 30, 2011 at 10:08 AM

    Is it possible to have drawers sliding out from multiple sides of the screen?

    ReplyDelete
  23. UnknownSeptember 30, 2011 at 10:11 AM

    As of now, by default, sliding drawers can only be made to slide out either from the bottom or the right. Multiple sliding drawers from the bottom and right should be possible to achieve.

    ReplyDelete
  24. bloghnbOctober 10, 2011 at 4:28 PM

    Who know this code can't view gridview: :(

    ReplyDelete
  25. ShubhamNovember 20, 2011 at 7:54 PM

    Hi Kumar, how can i use slider for other handler, means i want to handle slider using any other buttonEvent of screen.

    pls let me know.
    thanks

    ReplyDelete
  26. AnonymousNovember 25, 2011 at 3:47 PM

    Arpit Hada , i want that slider should move slowly , how you achieve the animation slowly,
    any one if know then plz tell me

    ReplyDelete
  27. yaqubJanuary 2, 2012 at 11:07 AM

    Great work!!
    Keep it up!

    ReplyDelete
  28. ronyFebruary 10, 2012 at 5:49 PM

    I have problem with sliding drawer!! when i open sliding drawer and click within sliding drawer area it opens image which is not part of sliding drawer but it's a part of background background screen which is gridview of image!
    Do you have any solution to this!
    Reference this Question too(Below Link):
    http://stackoverflow.com/questions/5056941/clicking-inside-a-sliding-drawer

    ReplyDelete
  29. EchimMarch 12, 2012 at 4:02 PM

    Hi! I'm newbie in android development, and I need help. Your example works great but I need it to slide from top to bottom.
    any suggestions?

    ReplyDelete
  30. GirishApril 13, 2012 at 3:27 PM

    hi..
    i'm having one problem..
    i have a checbox beside sliding drawer handle.when i check it im going to lock the drawer,at the same time checkbox also gets locked i'm unable to uncheck it again..please send any answers if u have..
    email-id:girishbht5@gmail.com

    ReplyDelete
  31. AnonymousFebruary 13, 2013 at 12:53 AM

    hi,

    if I want to keep the drawer open (even if the handle is tapped) but items in the list can be selected, how to do it?
    many thanks.
    email: yqwang_us@yahoo.com

    ReplyDelete
  32. AnonymousMay 17, 2013 at 5:52 PM

    Hi...can any one tell me how to slow down the velocity of Slider

    ReplyDelete

Subscribe to: Post Comments (Atom)