ตัวอย่างการทำ Navigation Drawer บน Android

1
dependencies {
2
    compile fileTree(dir: 'libs', include: ['*.jar'])
3
    compile "com.android.support:support-v4:20.0.+"
4
}

1
<resources>
2
    <style name="AppTheme" parent="android:Theme.Holo.Light">
3

4
    </style>
5
</resources>

1
<android.support.v4.widget.DrawerLayout
2
    xmlns:android="http://schemas.android.com/apk/res/android"
3
    android:id="@+id/drawer_layout"
4
    android:layout_width="match_parent"
5
    android:layout_height="match_parent">
6

7
    <!-- Content -->
8
    <FrameLayout
9
        android:id="@+id/container"
10
        android:layout_width="match_parent"
11
        android:layout_height="match_parent" />
12

13
    <!-- Navigation drawer -->
14
    <ListView android:id="@+id/drawer"
15
              android:layout_width="240dp"
16
              android:layout_height="match_parent"
17
              android:layout_gravity="start"
18
              android:choiceMode="singleChoice"
19
              android:dividerHeight="1dp"
20
              android:background="#ff31415a"/>
21
</android.support.v4.widget.DrawerLayout>

1
package com.devahoy.navigationdrawerdemo;
2

3
import android.app.Activity;
4
import android.os.Bundle;
5
import android.support.v4.widget.DrawerLayout;
6
import android.widget.ArrayAdapter;
7
import android.widget.ListView;
8

9

10
public class MyActivity extends Activity {
11

12
    public static final String KEY_DRAWABLE_ID = "drawableId";
13

14
    private String[] mDrawerTitle = {"Cover", "Guitar", "Bass", "Drum"};
15
    private DrawerLayout mDrawerLayout;
16
    private ListView mListView;
17

18
    @Override
19
    protected void onCreate(Bundle savedInstanceState) {
20
        super.onCreate(savedInstanceState);
21
        setContentView(R.layout.activity_my);
22

23
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
24
        mListView = (ListView) findViewById(R.id.drawer);
25

26
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
27
                android.R.layout.simple_list_item_1, mDrawerTitle);
28

29
        mListView.setAdapter(adapter);
30
    }
31

32
}

1
<?xml version="1.0" encoding="utf-8"?>
2
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3
              android:orientation="vertical"
4
              android:layout_width="match_parent"
5
              android:layout_height="match_parent">
6

7
    <ImageView android:id="@+id/image"
8
               android:layout_width="match_parent"
9
               android:layout_height="match_parent"
10
               android:scaleType="fitXY"
11
               android:gravity="center" />
12

13
</LinearLayout>

1
package com.devahoy.navigationdrawerdemo;
2

3
import android.app.Fragment;
4
import android.os.Bundle;
5
import android.support.annotation.Nullable;
6
import android.view.LayoutInflater;
7
import android.view.View;
8
import android.view.ViewGroup;
9
import android.widget.ImageView;
10

11
public class MyFragment extends Fragment {
12

13
    @Override
14
    public View onCreateView(LayoutInflater inflater,
15
                             @Nullable ViewGroup container,
16
                             @Nullable Bundle savedInstanceState) {
17

18
        int resourceId = getArguments().getInt(MyActivity.KEY_DRAWABLE_ID);
19
        View view = inflater.inflate(R.layout.fragment_my, container, false);
20

21
        ImageView imageView = (ImageView) view.findViewById(R.id.image);
22
        imageView.setImageResource(resourceId);
23

24
        return view;
25
    }
26
}

1
package com.devahoy.navigationdrawerdemo;
2

3
import android.app.Activity;
4
import android.app.Fragment;
5
import android.app.FragmentTransaction;
6
import android.os.Bundle;
7
import android.support.v4.widget.DrawerLayout;
8
import android.view.View;
9
import android.widget.AdapterView;
10
import android.widget.ArrayAdapter;
11
import android.widget.ListView;
12

13
public class MyActivity extends Activity {
14

15
    private int[] imageResourceIds = {
16
        R.drawable.cover,
17
        R.drawable.guitar,
18
        R.drawable.bass,
19
        R.drawable.drum
20
    };
21

22
    @Override
23
    protected void onCreate(Bundle savedInstanceState) {
24
        ...
25

26
        mListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
27
            @Override
28
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
29
                selectFragment(position);
30
            }
31
        });
32
        selectFragment(0);
33
    }
34

35
    private void selectFragment(int position) {
36
        Fragment fragment = new MyFragment();
37
        Bundle args = new Bundle();
38
        args.putInt(KEY_DRAWABLE_ID, imageResourceIds[position]);
39
        fragment.setArguments(args);
40

41
        FragmentTransaction transaction = getFragmentManager().beginTransaction();
42
        transaction.replace(R.id.container, fragment);
43
        transaction.commit();
44
    }
45
}

1
public class MyActivity extends Activity {
2
    private ActionBarDrawerToggle mDrawerToggle;
3

4
    @Override
5
    protected void onCreate(Bundle savedInstanceState) {
6
        super.onCreate(savedInstanceState);
7
        setContentView(R.layout.activity_my);
8

9
        getActionBar().setDisplayHomeAsUpEnabled(true);
10
        getActionBar().setHomeButtonEnabled(true);
11

12
        mDrawerToggle = new ActionBarDrawerToggle(
13
                this,   // Context
14
                mDrawerLayout,  // DrawerLayout
15
                R.drawable.ic_drawer,  // รูปภาพที่จะใช้
16
                R.string.drawer_open, // ค่า String ในไฟล์ strings.xml
17
                R.string.drawer_close // ค่า String ในไฟล์ strings.xml
18
                ) {
19

20
            public void onDrawerClosed(View view) {
21
                super.onDrawerClosed(view);
22
                invalidateOptionsMenu();
23
            }
24

25
            public void onDrawerOpened(View drawerView) {
26
                super.onDrawerOpened(drawerView);
27
                invalidateOptionsMenu();
28
            }
29
        };
30

31
        mDrawerLayout.setDrawerListener(mDrawerToggle);
32
}

1
@Override
2
protected void onCreate(Bundle savedInstanceState) {
3
    super.onCreate(savedInstanceState);
4
    setContentView(R.layout.activity_my);
5

6
    getActionBar().setDisplayHomeAsUpEnabled(true);
7
    getActionBar().setHomeButtonEnabled(true);
8

9
    mDrawerToggle = new ActionBarDrawerToggle(
10
    ...
11
}

1
<?xml version="1.0" encoding="utf-8"?>
2
<resources>
3
    <string name="drawer_open">Open Navigation drawer</string>
4
    <string name="drawer_close">Close Navigation drawer</string>
5
</resources>

1
@Override
2
public boolean onOptionsItemSelected(MenuItem item) {
3
    if (mDrawerToggle.onOptionsItemSelected(item)) {
4
        return true;
5
    }
6
    return super.onOptionsItemSelected(item);
7
}