Android之DrawerLayout实现ViewPager+左右侧边栏

Android在V4包中提供了DrawerLayout布局来实现侧边栏的效果，代替了之前总是用第三方库实现的方法。

关于DrawerLayout网上的介绍也很多，今天我们来实现一个基于DrawerLayout实现的Demo:

框架结构：

内容区域是ViewPager，里边包含Fragment，通过FragmentPageAdapter来与ViewPager关联。

侧边栏我们用的是LinearLayout布局，当然，也可以用ListView等其他布局代替。

实现过程中遇到的一些问题记录在了Android侧边栏DrawerLayout实现问题笔记，大家可以参考下。

先上效果图：

内容区域：

该界面是一个只包含TextView的Fragment嵌套在ViewPager中可以左右滑动，具体扩展可以根据自己的需求。

左侧边栏： 右侧边栏：

  

左侧边栏呼出方式：

1.通过自带的从左侧滑出

2.通过DrawerLayout与ActionBar相关联，由ActionBar左上角按钮打开/隐藏

右侧边栏呼出方式：

默认的从右侧滑出

项目结构：

这里只介绍一些关键的文件：

主布局文件activity_main.xml：

DrawerLayout布局结构：

第一层Viewpager为主内容区域，位于Z轴最低端，被左右侧边栏呼出时覆盖。

第二层include的LinearLayout为左侧边栏

第三层LinearLayout为右侧边栏

注意，侧边栏要实现以下属性：

 1.android:layout_width="320dp" 由于侧边栏不需要覆盖整个屏幕，Android文档建议最大宽度不超过320dp

 2.android:layout_gravity="start" 或者android:layout_gravity="end" 分别对应左右侧边栏

主Activity MainActivity.java:

public class MainActivity extends FragmentActivity {
	private DrawerLayout drawerLayout;
	private ActionBarDrawerToggle drawerToggle;
	private LinearLayout layout;
	private ViewPager pager;
	private List list = new ArrayList();

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

	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

	private void initView() {
		// TODO Auto-generated method stub
		drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
		layout = (LinearLayout) findViewById(R.id.include_list);
		TextView textView = (TextView) layout.findViewById(R.id.text1);
		textView.setText("Item1");
		pager = (ViewPager) findViewById(R.id.content);

		FragmenAddr fragmenAddr = new FragmenAddr();
		FragmenFriend fragmenFriend = new FragmenFriend();
		FragmenSetting fragmenSetting = new FragmenSetting();
		FragmenWeixin fragmenWeixin = new FragmenWeixin();
		list.add(fragmenWeixin);
		list.add(fragmenAddr);
		list.add(fragmenSetting);
		list.add(fragmenFriend);

		pager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {

			@Override
			public int getCount() {
				// TODO Auto-generated method stub
				return list.size();
			}

			@Override
			public Fragment getItem(int arg0) {
				// TODO Auto-generated method stub
				return list.get(arg0);
			}
		});

		// 设置ActionBarDrawerToggle与DrawerLayout通过setDrawerListener相关联
		drawerToggle = new ActionBarDrawerToggle(this, drawerLayout,
				R.drawable.ic_drawer, R.string.action_settings,
				R.string.hello_world) {
			@Override
			public void onDrawerOpened(View drawerView) {
				super.onDrawerOpened(drawerView);
				// getActionBar().setTitle("已打开");
				invalidateOptionsMenu();
			}

			@Override
			public void onDrawerClosed(View drawerView) {
				super.onDrawerClosed(drawerView);
				// getActionBar().setTitle("已关闭");
				invalidateOptionsMenu();
			}
		};

		drawerLayout.setDrawerListener(drawerToggle);

		// 为ActionBar左上角图标加上一个返回箭头的图标
		getActionBar().setDisplayHomeAsUpEnabled(true);
		// 使左上角图标可以点击
		getActionBar().setHomeButtonEnabled(true);
		// true:显示左上角图标 false:不显示图标，只显示一个标题
		getActionBar().setDisplayShowHomeEnabled(false);
	}

	/*
	 * 动态显示ActionBar时候由invalidateOptionsMenu()方法调用
	 */
	@Override
	public boolean onPrepareOptionsMenu(Menu menu) {
		boolean drawerOpen = drawerLayout.isDrawerOpen(layout);
		menu.findItem(R.id.action_settings).setVisible(!drawerOpen);
		return super.onPrepareOptionsMenu(menu);
	}

	/*
	 * 不常用的Activity生命周期方法。在start()和onRestoreInstanceState()后执行。
	 * 用于Activity初始化完成后最后执行的方法
	 */
	@Override
	protected void onPostCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onPostCreate(savedInstanceState);
		drawerToggle.syncState();
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		// TODO Auto-generated method stub
		if (drawerToggle.onOptionsItemSelected(item)) {
			return true;
		}
		return super.onOptionsItemSelected(item);
	}

}

ActionBarDrawerToggle类为DrawerLayout侧边栏与ActionBar相关联的工具类。

ActionBarDrawerToggle 的作用：
1.改变android.R.id.home返回图标。
2.Drawer拉出、隐藏，带有android.R.id.home动画效果。
3.监听Drawer拉出、隐藏。

绑定的时候需要调用DrawerLayout的setDrawerListener(ActionBarDrawerToggle对象)