首页 > 代码库 > NavigationDrawer的使用

NavigationDrawer的使用

一。Create a NavigationDrawer

     创建Navigation Drawer需要用DrawerLayout 作为界面根控件。在DrawerLayout里面第一个View为当前界面主内容;第二个和第三个View为Navigation Drawer内容。如果当前界面只需要一个Navigation Drawer,则第三个View可以省略。

    下面的例子中,有两个View ,第一个FramLayout是显示内容 的主要页面,第二个ListView 是NavigationDrawer的内容 。

<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">
     
    <!-- the main content view  -->
   <FrameLayout 
       android:id ="@+id/content_frame"
       android:layout_width="match_parent"
       android:layout_height="match_parent"  >
   </FrameLayout>
   
<!--  the navigation drawer -->
<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>

以上内容要注意有:

  1. 显示界面主要的View (也就是上面的FrameLayout)一定要是DrawerLayout的第一个子View

  2. 显示界面的View 的宽度和高度与父类的要一样,原因是当navigation drawer不可见的时候 ,界面 内容代表整个界面 

  3. Navigation Drawer (上面的 ListView) 必须使用android:layout_gravity属性设置水平的 gravity值 .

  4. 抽屉菜单的宽度为 dp 单位而高度和父View一样。抽屉菜单的宽度应该不超过320dp,这样用户可以在菜单打开的时候看到部分内容界面。

二。 initialize the Drawer List

       在您的Activity中需要先初始化Navigation Drawer内容,根据您的应用需要Navigation Drawer的内容可能不是ListView,可以使用其他View。

     在上面的示例中,我们需要给Navigation Drawer的ListView设置一个Adapter来提供数据。如下所示:

public class MainActivity extends Activity {
	private String [] mPlanetTitles;
	private DrawerLayout mDrawerLayout;
	private ListView mDrawerList;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		mPlanetTitles=new String []{"title1","title2","title3"};
		mDrawerLayout= (DrawerLayout) findViewById(R.id.drawer_layout);
		mDrawerList= (ListView) findViewById(R.id.left_drawer);
		
		//set the adapter for the list view
		ArrayAdapter< String > adapter= new ArrayAdapter<String>(this,
				R.layout.drawer_list_item, mPlanetTitles);
		mDrawerList.setAdapter(adapter);
		//set the click listener 
		mDrawerList.setOnItemClickListener(new DrawerItemClickListener());
		
		
	}
}

代码 中调用 了setOnItemClickListener来接收Navigation drawer List中的点击后的事件。

三。处理导航点击事件

在onItemClick()中 什么取决于你的appa 结构 ,下面的例子中,选择每一个项都会在主内容 View (也就是framelayout)中插入一个不同的 fragment.

   private class DrawerItemClickListener  implements OnItemClickListener{

	@Override
	public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
		// TODO Auto-generated method stub
		selectItem(position);
	}
   }
// Swaps fragments in the main content view FrameLayout
	private void selectItem(int position) {
		// TODO Auto-generated method stub
		//create a new fragment and specify thr planet to show based on position
		android.app.Fragment fragment= new PlanetFragment();
		Bundle args = new Bundle();
		args.putInt(PlanetFragment.ARG_PLANET_NUMBER, position);
		fragment.setArguments(args);
		
		//insert the fragment by replacing any existing fragment 
       FragmentManager fManager = getFragmentManager();
		fManager.beginTransaction()
			.replace(R.id.content_frame, fragment)
			.commit();
		//high light the selected item update the title and close the drawer 
		mDrawerList.setItemChecked(position, true);
	
	}
	
	@Override
	public void setTitle(CharSequence title) {
		// TODO Auto-generated method stub
		mTitle= (String) title;
		getActionBar().setTitle(mTitle);
	}