• android组件之DrawerLayout（抽屉导航）-- 侧滑菜单效果

    转载请注明出处：http://blog.csdn.net/crazy1235/article/details/41696291

    一、 介绍

        导航抽屉显示在屏幕的最左侧，默认情况下是隐藏的，当用户用手指从边缘向另一个滑动的时候，会出现一个隐藏的面板，当点击面板外部或者向原来的方向滑动的时候，抽屉导航就会消失了！
    好了，这个抽屉就是DrawerLayout，该类位于V4包中。
     

    二、 使用

    抽屉导航的实现步骤非常简单。只要配置好带有抽屉导航的布局就可以实现简单的策划菜单。布局代码如下：
    [html] view plain copy
     
    print?在CODE上查看代码片派生到我的代码片
    1. <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    2.     xmlns:tools="http://schemas.android.com/tools"  
    3.     android:id="@+id/id_drawerlayout"  
    4.     android:layout_width="match_parent"  
    5.     android:layout_height="match_parent" >  
    6.     <FrameLayout  
    7.         android:id="@+id/id_framelayout"  
    8.         android:layout_width="match_parent"  
    9.         android:layout_height="match_parent" >  
    10.         <Button  
    11.             android:id="@+id/id_btn1"  
    12.             android:layout_width="wrap_content"  
    13.             android:layout_height="wrap_content"  
    14.             android:text="1111" />  
    15.     </FrameLayout>  
    16.     <LinearLayout  
    17.         android:id="@+id/id_drawer"  
    18.         android:layout_width="240dp"  
    19.         android:layout_height="match_parent"  
    20.         android:layout_gravity="start"  
    21.         android:background="#E0EEE0"  
    22.         android:orientation="vertical" >  
    23.             <ListView  
    24.             android:id="@+id/id_lv"  
    25.             android:layout_width="wrap_content"  
    26.             android:layout_height="wrap_content"  
    27.             android:divider="#CD853F"  
    28.             android:dividerHeight="2dp" >  
    29.         </ListView>  
    30.     </LinearLayout>  
    31. </android.support.v4.widget.DrawerLayout>  
    <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/id_drawerlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <FrameLayout
        android:id="@+id/id_framelayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <Button
            android:id="@+id/id_btn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1111" />
    </FrameLayout>
    <LinearLayout
        android:id="@+id/id_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#E0EEE0"
        android:orientation="vertical" >
            <ListView
            android:id="@+id/id_lv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:divider="#CD853F"
            android:dividerHeight="2dp" >
        </ListView>
    </LinearLayout>
</android.support.v4.widget.DrawerLayout>

    说明：
    1. 必须把DrawerLayout作为布局的跟标签。
    2. 然后在跟标签中添加一个包含内容的视图，就是当抽屉完全隐藏的时候显示的内容布局。
    3. 添加一个抽屉布局，这个布局可以按照需求自己定义，我的demo中是一个listview。
    4. 抽屉布局中，需要指定android:layout_gravity属性，官方说明是用start代替left。不过我试了一下start和left，right和end的效果是一样的。知道是什么区别？（谁知道，请留言告知一下！谢谢！）
    5. 抽屉布局的宽度最好不要超过320dp，这样做为了当抽屉完全显示的时候，不至于把内容布局全部遮挡。
     
    好了，此时在你的activity中设置一下布局文件，就可以实现一个简单的侧滑菜单了，不过菜单是在上面的。
     
     
    接下来，就要初始化listview了。
    [java] view plain copy
     
    print?在CODE上查看代码片派生到我的代码片
    1. mLv = (ListView) findViewById(R.id.id_lv);  
    2.         str = new String[] { "item1", "item2", "item3"};  
    3.         ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,  
    4.                 android.R.layout.simple_list_item_1, str);  
    5.         mLv.setAdapter(adapter);  
    6.         mLv.setOnItemClickListener(this);  
    mLv = (ListView) findViewById(R.id.id_lv);
		str = new String[] { "item1", "item2", "item3"};
		ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
				android.R.layout.simple_list_item_1, str);
		mLv.setAdapter(adapter);
		mLv.setOnItemClickListener(this);

    下面，设置抽屉导航的监听事件。添加监听器的时候有三种方式。
     
    1. 设置DrawerLayout.DrawerListener作为监听器类,里面包含四个回调函数。
     
    代码如下：
    [java] view plain copy
     
    print?在CODE上查看代码片派生到我的代码片
    1. mDrawerLayout.setDrawerListener(new DrawerListener() {  
    2.         /** 
    3.          * 当抽屉滑动状态改变的时候被调用 
    4.          * 状态值是STATE_IDLE（闲置--0）, STATE_DRAGGING（拖拽的--1）, STATE_SETTLING（固定--2）中之一。 
    5.          * 抽屉打开的时候，点击抽屉，drawer的状态就会变成STATE_DRAGGING，然后变成STATE_IDLE 
    6.         */  
    7.         @Override  
    8.         public void onDrawerStateChanged(int arg0) {  
    9.             Log.i("drawer", "drawer的状态：" + arg0);  
    10.         }  
    11.         /** 
    12.          * 当抽屉被滑动的时候调用此方法 
    13.          * arg1 表示 滑动的幅度（0-1） 
    14.          */  
    15.         @Override  
    16.         public void onDrawerSlide(View arg0, float arg1) {  
    17.             Log.i("drawer", arg1 + "");  
    18.         }  
    19.         /** 
    20.          * 当一个抽屉被完全打开的时候被调用 
    21.          */  
    22.         @Override  
    23.         public void onDrawerOpened(View arg0) {  
    24.             Log.i("drawer", "抽屉被完全打开了！");  
    25.         }  
    26.         /** 
    27.          * 当一个抽屉完全关闭的时候调用此方法 
    28.          */  
    29.         @Override  
    30.         public void onDrawerClosed(View arg0) {  
    31.             Log.i("drawer", "抽屉被完全关闭了！");  
    32.         }  
    33.     });  
    mDrawerLayout.setDrawerListener(new DrawerListener() {
		/**
		 * 当抽屉滑动状态改变的时候被调用
		 * 状态值是STATE_IDLE（闲置--0）, STATE_DRAGGING（拖拽的--1）, STATE_SETTLING（固定--2）中之一。
		 * 抽屉打开的时候，点击抽屉，drawer的状态就会变成STATE_DRAGGING，然后变成STATE_IDLE
		*/
		@Override
		public void onDrawerStateChanged(int arg0) {
			Log.i("drawer", "drawer的状态：" + arg0);
		}
		/**
		 * 当抽屉被滑动的时候调用此方法
		 * arg1 表示 滑动的幅度（0-1）
		 */
		@Override
		public void onDrawerSlide(View arg0, float arg1) {
			Log.i("drawer", arg1 + "");
		}
		/**
		 * 当一个抽屉被完全打开的时候被调用
		 */
		@Override
		public void onDrawerOpened(View arg0) {
			Log.i("drawer", "抽屉被完全打开了！");
		}
		/**
		 * 当一个抽屉完全关闭的时候调用此方法
		 */
		@Override
		public void onDrawerClosed(View arg0) {
			Log.i("drawer", "抽屉被完全关闭了！");
		}
	});
     
    2. 设置DrawerListener的子类SimpleDrawerListener，使用这个类的时候不必实现全部的回调函数，可以根据自己的需要重写相应的方法。
     
    代码如下：
    [java] view plain copy
     
    print?在CODE上查看代码片派生到我的代码片
    1. mDrawerLayout.setDrawerListener(new DrawerLayout.SimpleDrawerListener() {  
    2.             @Override  
    3.             public void onDrawerClosed(View drawerView) {  
    4.                 super.onDrawerClosed(drawerView);  
    5.             }  
    6.             @Override  
    7.             public void onDrawerOpened(View drawerView) {  
    8.                 super.onDrawerOpened(drawerView);  
    9.             }  
    10.         });  
    mDrawerLayout.setDrawerListener(new DrawerLayout.SimpleDrawerListener() {
			@Override
			public void onDrawerClosed(View drawerView) {
				super.onDrawerClosed(drawerView);
			}
			@Override
			public void onDrawerOpened(View drawerView) {
				super.onDrawerOpened(drawerView);
			}
		});

    3. 使用DrawerListener的子类ActionBarDrawerToggle。一般与ActionBar结合使用。
     
    代码如下：
    [java] view plain copy
     
    print?在CODE上查看代码片派生到我的代码片
    1. mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,  
    2.                 R.drawable.ic_drawer, R.string.drawer_open,  
    3.                 R.string.drawer_close) {  
    4. @Override  
    5. public void onDrawerClosed(View drawerView) {  
    6.     getActionBar().setTitle(mTitle);  
    7.     invalidateOptionsMenu();  
    8. }  
    9. @Override  
    10. public void onDrawerOpened(View drawerView) {  
    11.     getActionBar().setTitle(mDrawerTitle);  
    12.     invalidateOptionsMenu();  
    13.     }  
    14. };  
    15. mDrawerLayout.setDrawerListener(mDrawerToggle);  
    mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,
				R.drawable.ic_drawer, R.string.drawer_open,
				R.string.drawer_close) {
@Override
public void onDrawerClosed(View drawerView) {
	getActionBar().setTitle(mTitle);
	invalidateOptionsMenu();
}
@Override
public void onDrawerOpened(View drawerView) {
	getActionBar().setTitle(mDrawerTitle);
	invalidateOptionsMenu();
	}
};
mDrawerLayout.setDrawerListener(mDrawerToggle);

    调用closeDrawer()和openDrawer()可以关闭和打开抽屉。其他的方法就参考API吧！

    三、 总结

    抽屉导航就介绍到此，总的来说drawer使用起来非常的简单。不过有一点不好的是，它是把抽屉显示在内容的上面，而不是下面。我觉得大多数的侧滑菜单一般都是在下面的。我在api中也没有找到关于设置抽屉上下关系的函数。
    如果想要菜单在下面的方法，就用github上面的slidingmenu吧！
     

    四、 下载

    demo点此下载！欢迎指教！如有问题，请留言！
  • 相关阅读:
    Zabbix客户端日志出现(Not all processes could be identified, 解决
    zabbix 本地编译安装
    redis 配置文件解释 以及集群部署
    Unix shell范例精解 课后题
    if __name__ == '__main__':用法
    爬取猫眼电影100榜单 代码
    CentOS编译安装软件过程中遇到zlib.h: No such file or directory
    Codeigniter添加Composer支持
    CodeIgniter composer.json安装第三类库操作
    使用composer命令加载vendor中的第三方类库 的方法
  • 原文地址：https://www.cnblogs.com/ldq2016/p/5369087.html
Copyright © 2020-2023  润新知