引言
本文主要參考Android開發(fā)文檔Creating a Navigation Drawer。
創(chuàng)建DrawLayout布局
為了在項目中引入DrawLayout
布局,讓DrawLayout
對象作為布局的根視圖,然后在這個DrawLayout
里面添加一個主內容視圖(當導航抽屜隱藏時,顯示內容的布局)以及一個包含導航抽屜內容的視圖。如下所示:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ListView
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp"
android:background="#111"/>
</android.support.v4.widget.DrawerLayout>
引入DrawerLayout
布局要注意一些要求:
- 主要內容的視圖(
FrameLayout
)必須是DrawLayout
的第一個子節(jié)點, 因為導航抽屜是在主要內容視圖的上面。 - 主要內容視圖的
layout_width
layout_height
均設置為match_parent
,因為當導航抽屜隱藏時,它填充了整個界面。 - 抽屜視圖(
ListView
)必須指定其水平重力(android:layout_gravity
)屬性。如果指定為左菜單時,值為left
,右菜單為right
。然而不過要跟隨系統(tǒng)語言方向(比如系統(tǒng)文字是從做到右,或者從右到左)用start
。 - 抽屜視圖用dp單位來指定其寬度,并且高度匹配父視圖。抽屜的寬度不能超過320 dp, 因此用戶總是可以看到主要內容視圖的一部分。
初始化Drawer ListView
初始化列表就是為抽屜里的列表填充數據,這里我們將數據定義在res/values/strings.xml
里,如下所示
<string-array name="drawer_menu">
<item>Menu 1</item>
<item>Menu 2</item>
<item>Menu 3</item>
<item>Menu 4</item>
</string-array>
為ListView
中的子項創(chuàng)建布局如下:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:gravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textColor="#fff"
android:background="?android:attr/activatedBackgroundIndicator"
android:minHeight="?android:attr/listPreferredItemHeightSmall"/>
接下來,在MainActivity.java
中對ListView
進行初始化,配置適配器,設置監(jiān)聽器,如下所示:
// 定義變量
private String[] mDrawerMenuTitles;
private DrawerLayout mDrawerLayout;
private ListView mDrawerListView;
// 初始化變量
mDrawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout);
mDrawerListView = (ListView)findViewById(R.id.left_drawer);
mDrawerMenuTitles = getResources().getStringArray(R.array.drawer_menu);
// 為ListView設置適配器
mDrawerListView.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, mDrawerMenuTitles));
// 為ListView設置監(jiān)聽器
mDrawerListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
selectItem(position); // 對點事件的處理
}
});
處理ListView
中子項的點擊事件
這里實現點擊事件為切換主界面的Fragment
,每點擊一個Item
,就會創(chuàng)建相應的ContentFragment
,然后更換掉主界面的Fragment
。因此要創(chuàng)建一個繼承自Fragment
的ContentFragment
,首先創(chuàng)建一個fragment_content
布局:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/text2"
android:layout_width="match_parent"
android:layout_height="match_parent">
</TextView>
創(chuàng)建ContentFragment
類,以及實現selectItem()
(點擊事件的處理)
public static class ContentFragment extends Fragment {
public static final String ARG_DRAWER_MENU_NUMBER = "drawer_menu_number";
public ContentFragment() {
// Empty constructor required for fragment subclasses
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_content, container, false);
int i = getArguments().getInt(ARG_DRAWER_MENU_NUMBER);
String menuItem = getResources().getStringArray(R.array.drawer_menu)[i];
((TextView)rootView.findViewById(R.id.text2)).setText(menuItem);
return rootView;
}
}
private void selectItem(int position){
Fragment fragment = new ContentFragment();
Bundle args = new Bundle();
switch (position) {
case 0:
args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
break;
case 1:
args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
break;
case 2:
args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
break;
case 3:
args.putInt(ContentFragment.ARG_DRAWER_MENU_NUMBER, position);
break;
default:
break;
}
// FragmentActivity將點擊的菜單列表標題傳遞給Fragment
fragment.setArguments(args);
// 插入Fragment
FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction().replace(R.id.content_frame, fragment).commit();
// 更新選擇后的item和title,然后關閉菜單
mDrawerListView.setItemChecked(position, true);
setTitle(mDrawerMenuTitles[position]);
mDrawerLayout.closeDrawer(mDrawerListView);
}