Android DrawerLayout and DrawerListener

This exercise show how to use android.support.v4.widget.DrawerLayout and implement DrawerListener. DrawerLayout is a top-level container that allows for interactive "drawer" views to be pulled out from the edge of the window.

android.support.v4.widget.DrawerLayout and DrawerListener
android.support.v4.widget.DrawerLayout and DrawerListener

Layout, to define <android.support.v4.widget.DrawerLayout> as top-level container.
<android.support.v4.widget.DrawerLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:background="@android:color/background_light"
tools:context=".MainActivity" >

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Main layout" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:autoLink="web"
android:text="http://android-er.blogspot.com/"
android:textStyle="bold" />

<Button
android:id="@+id/opendrawer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Open Drawer" />

<TextView
android:id="@+id/prompt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right" />
<TextView
android:id="@+id/prompt2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right" />
</LinearLayout>

<LinearLayout
android:id="@+id/drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@android:color/background_dark"
android:orientation="vertical"
android:padding="5dp" >

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Drawer" />

<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher" />

<Button
android:id="@+id/closedrawer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Close Drawer" />
</LinearLayout>

</android.support.v4.widget.DrawerLayout>

MainActivity.java
package com.example.androiddrawerlayout;

import android.os.Bundle;
import android.app.Activity;
import android.support.v4.widget.DrawerLayout;
import android.support.v4.widget.DrawerLayout.DrawerListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends Activity {

DrawerLayout drawerLayout;
View drawerView;
TextView textPrompt, textPrompt2;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

textPrompt = (TextView)findViewById(R.id.prompt);
textPrompt2 = (TextView)findViewById(R.id.prompt2);

drawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout);
drawerView = (View)findViewById(R.id.drawer);

Button buttonOpenDrawer = (Button)findViewById(R.id.opendrawer);
buttonOpenDrawer.setOnClickListener(new OnClickListener(){

@Override
public void onClick(View arg0) {
drawerLayout.openDrawer(drawerView);
}});

Button buttonCloseDrawer = (Button)findViewById(R.id.closedrawer);
buttonCloseDrawer.setOnClickListener(new OnClickListener(){

@Override
public void onClick(View arg0) {
drawerLayout.closeDrawers();
}});

drawerLayout.setDrawerListener(myDrawerListener);

/*
* In my trial experiment:
* Without dummy OnTouchListener for the drawView to
* consume the onTouch event, touching/clicking on
* un-handled view on drawView will pass to the view
* under it!
* - Touching on the Android icon will
* trigger the TextView("http://android-er.blogspot.com/")
* to open the web.
*/
drawerView.setOnTouchListener(new OnTouchListener() {

@Override
public boolean onTouch(View v, MotionEvent event) {
// TODO Auto-generated method stub
return true;
}
});
}

DrawerListener myDrawerListener = new DrawerListener(){

@Override
public void onDrawerClosed(View drawerView) {
textPrompt.setText("onDrawerClosed");
}

@Override
public void onDrawerOpened(View drawerView) {
textPrompt.setText("onDrawerOpened");
}

@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
textPrompt.setText("onDrawerSlide: " + String.format("%.2f", slideOffset));
}

@Override
public void onDrawerStateChanged(int newState) {
String state;
switch(newState){
case DrawerLayout.STATE_IDLE:
state = "STATE_IDLE";
break;
case DrawerLayout.STATE_DRAGGING:
state = "STATE_DRAGGING";
break;
case DrawerLayout.STATE_SETTLING:
state = "STATE_SETTLING";
break;
default:
state = "unknown!";
}

textPrompt2.setText(state);
}};

}


download filesDownload the files.

Next:
DrawerLayout with ListView