Using Android SlidingDrawer

Remeber Android's old versions' (prior to 2.2) launcher screen where we had a sliding pane at the bottom that when dragged upwards displays the applications menu of the phone, that is called the SlidingDrawer control.

consider this layout:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">
  <SlidingDrawer
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:id="@+id/drawer"
  android:handle="@+id/handle"
  android:content="@+id/content"
  >
  <ImageView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:id="@+id/handle"
  android:src="@drawable/tray_handle_normal"
  />
  <LinearLayout
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical"
  android:id="@+id/content"
  >
  <TextView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="This is some text"
  android:id="@+id/txt"
  />
  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="Click Me"
  android:id="@+id/btn"
  android:onClick="ClickHandler"
  />
  </LinearLayout>
  
  </SlidingDrawer>
</FrameLayout>

when the SlidingDrawer is pressed it looks like this:

the SlidingDrawer is a container that when dragged or pressed shows/hides its contents.

As the SlidingDrawer displays one content at a time, it must be declared within FrameLayout

the SlidingDrawer has two key properties:
android:handle: specifies the id of the control that acts as the handle.
android:content: specifies the id of the view that acts as content of the SlidingDrawer, most times will be a container.

you can open/close the drawer from the code like this:

if(drawer.isOpened())
    {
     drawer.close();
     btnToggle.setText("Open");
    }
    else
    {
     drawer.open();
     btnToggle.setText("Close");
    }

you can open/close the drawer with animation using these methods instead

drawer.animateClose();
drawer.animateOpen();

or you can handle the open/close operations automatically using toggle method:

drawer.toggle();
drawer.animateToggle();

you can lock/unlock the SlidingDrawer to enable/disable dragging or clicking of the drawer using these methods:

drawer.lock();
drawer.unlock();

Responding to SlidingDrawer Events:

SlidingDrawer has three key callbacks:

1. when the drawer is open, handled by implementing OnDrawerOpenListener.
2. when the drawer is close, handled by implementing OnDrawerCloseListener.
3. when the drawer is close, handled by implementing OnDrawerScroll
   Listener.

drawer.setOnDrawerOpenListener(new OnDrawerOpenListener() {
    
    @Override
    public void onDrawerOpened() {
     // TODO Auto-generated method stub
     TextView txtStatus=(TextView)findViewById(R.id.txtStatus);
     txtStatus.setText("Opened");
     ImageView view=(ImageView)drawer.getHandle();
     view.setImageResource(R.drawable.tray_handle_selected);
     
    }
   });
         
         
                  
         drawer.setOnDrawerCloseListener(new OnDrawerCloseListener() {
    
    @Override
    public void onDrawerClosed() {
     // TODO Auto-generated method stub
     TextView txtStatus=(TextView)findViewById(R.id.txtStatus);
     txtStatus.setText("Closed");
     ImageView view=(ImageView)drawer.getHandle();
     view.setImageResource(R.drawable.tray_handle_normal);
    }
   });
         
         drawer.setOnDrawerScrollListener(new OnDrawerScrollListener() {
    
    @Override
    public void onScrollStarted() {
     // TODO Auto-generated method stub
     TextView txtStatus=(TextView)findViewById(R.id.txtStatus);
     txtStatus.setText("Scroll start");
     
    }
    
    @Override
    public void onScrollEnded() {
     // TODO Auto-generated method stub
     TextView txtStatus=(TextView)findViewById(R.id.txtStatus);
     txtStatus.setText("Scroll end");
    }
   });

Notes:

• you can make the drawer appear horizontally from right to left by setting the android:orientation property to horizontal in the xml file.
• you can find images used as a source for the handler from this site: http://www.netmite.com/android/mydroid/1.0/packages/apps/Phone/res/drawable-finger/  I used tray_handle_normal.9.png and tray_handle_selected.9.png