Android侧滑菜单DrawerLayout

onConfigurationChanged最早的时候实现侧滑菜单功能大多时候需要通过github上一个叫做SlidingMenu的开源通过依赖包来实现,后来谷歌在v4包中添加了DrawerLayout来实现这个功能,完全可以替代SlidingMenu,这里我们来学习DrawerLayout的用法


一)创建DrawerLayout

1)在布局文件里将布局设置为DrawerLaout,而且因为是v4包中的功能,所以必须写全包名,注意第一必须先写主视图布局,然后再写抽屉里的视图,这里我们放了ListView进入抽屉

[java]  view plain  copy
  1. <pre name="code" class="java"><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.       
  8.     <!--The  main content view  抽屉关闭时候的主视图-->  
  9.     <FrameLayout   
  10.         android:id="@+id/content_frame"  
  11.         android:layout_width="match_parent"  
  12.         android:layout_height="match_parent"  
  13.         >  
  14.     </FrameLayout>  
  15.       
  16.     <!-- The Navigation view 左侧拉开之后的导航视图 -->  
  17.     <ListView   
  18.         android:id="@+id/left_drawer"  
  19.         android:layout_width="240dp"  
  20.         android:layout_height="match_parent"  
  21.         android:layout_gravity="start" //从左往右滑出菜单,如果为end就是从右往左滑出菜单  
[java]  view plain  copy
  1. android:background="#ffffcc"  
  2. android:choiceMode="singleChoice"  
  3. android:divider="@android:color/transparent"  
  4. android:dividerHeight="0dp"  
  5. ></ListView>  
  6.   
  7.   
  8. roid.support.v4.widget.DrawerLayout>  


 

2)在activity里将DrawerLayout加载进来,并且给抽屉里的列表适配了数据,这样就将抽屉布局加载进来了。

[java]  view plain  copy
  1. public class MainActivity extends Activity implements OnItemClickListener{  
  2.       
  3.     private DrawerLayout mDrawerLayout;  
  4.     private ListView mListView;  
  5.     private ArrayList<String> menuList;//数据  
  6.     private ArrayAdapter<String> adapter;//适配器  
  7. //  private ActionBarDrawerToggle mDrawerToggle;  
  8. //  private String mTitle;  
  9.   
  10.     @Override  
  11.     protected void onCreate(Bundle savedInstanceState) {  
  12.         super.onCreate(savedInstanceState);  
  13.         setContentView(R.layout.activity_main);  
  14.           
  15.     //  mTitle=(String) getTitle();  
  16.           
  17.         mDrawerLayout=(DrawerLayout) findViewById(R.id.drawer_layout);  
  18.         mListView=(ListView) findViewById(R.id.left_drawer);  
  19.           
  20.         menuList=new ArrayList<String>();  
  21.         for(int i=0;i<5;i++)  
  22.             menuList.add("刘家威"+i);  
  23.           
  24.         adapter=new ArrayAdapter<String>(this,  
  25.                 android.R.layout.simple_list_item_1,menuList);  
  26.         mListView.setAdapter(adapter);  
  27.           


二)给抽屉里的列表添加点击事件,动态添加碎片进入主视图


1)给抽屉里的列表项添加点击事件,每点击列表项,让其在主内容视图里添加一个Fragment,让这个Fragment里显示点击的列表项里的内容,先写这个FragmentLayout里的布局,这里让其显示一段文本

[java]  view plain  copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.       
  7.   
  8.     <TextView   
  9.         android:id="@+id/tv"  
  10.         android:layout_width="match_parent"  
  11.         android:layout_height="wrap_content"  
  12.         android:layout_gravity="center"  
  13.         android:textSize="25sp"/>  
  14.       
  15.       
  16. </LinearLayout>  

2)创建Fragment,在这里重写onCreateView(),把布局加载进来,然后获取到点击项里的内容,这个是在MainActivity里通过让碎片携带参数的方法来实现
[java]  view plain  copy
  1. package com.example.drawerlayout;  
  2.   
  3. import android.app.Fragment;  
  4. import android.os.Bundle;  
  5. import android.view.LayoutInflater;  
  6. import android.view.View;  
  7. import android.view.ViewGroup;  
  8. import android.widget.TextView;  
  9.   
  10. public class ContentFragment extends Fragment {  
  11.       
  12.     private TextView tv;  
  13.   
  14.     @Override  
  15.     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {  
  16.           
  17.         View view=inflater.inflate(R.layout.fragment_content,container,false);  
  18.         tv=(TextView) view.findViewById(R.id.tv);  
  19.           
  20.         String text=getArguments().getString("text");  //获取到传入的值  
  21.         tv.setText(text);    
  22.           
  23.         return view;  
  24.           
  25.     }  
  26.       
  27. }  

3)给抽屉里的列表添加点击事件,点击后会进入碎片界面,并且碎片携带了Bundle类型的参数,参数的值我们传入了列表数据menuList.get(position),使用碎片的方法如下,获取碎片的实例之后再通过getFragmentManager()获取碎片管理器,给碎片管理器开启事务,开启事务之后的碎片管理器用replace()方法将碎片的布局替换原来的主视图布局,这样一个碎片就添加进来了

最后别忘了关闭抽屉

[java]  view plain  copy
  1. @Override  
  2.     public void onItemClick(AdapterView<?> parent, View view, int position, long id) {  
  3.         //在FrameLayout里动态插入一个Fragment  
  4.           
  5.            Fragment contentFragment=new ContentFragment();      //创建碎片实例  
  6.            Bundle args=new Bundle();  //让每个碎片都携带参数,初始化为Bundle类型  
  7.            args.putString("text", menuList.get(position));  //参数put进入String类型的值,传入当前点击的菜单项的值  
  8.            contentFragment.setArguments(args);  //让碎片携带上参数  
  9.              
  10.              
  11.            FragmentManager fm=getFragmentManager();   
  12.            fm.beginTransaction().replace(R.id.content_frame,contentFragment ).commit();  //开启事务,向容器内加入碎片,最后提交事务  
  13.       
  14.            mDrawerLayout.closeDrawer(mListView);  //进入碎片界面时关闭掉抽屉的内容  
  15.       
  16.     }  


三)监听抽屉的打开关闭事件

使用ActionBarDrawerToggle,最早的时候在v4包里,现在谷歌把它搬到了v7包里,所以要引入v7依赖包

在引入v7包的时候,我遇到了一个错误,support\v7\appcompat\res\values-21\themes-base.xml:error:Error retrieving parent for item :No resources found that matches the given name. 这是因为v7包版本过低,解决方法是在project:properties里target=android-8改为21以上就好

当抽屉打开的时候,标题栏改为"请选择",当抽屉关闭的时候,标题栏变为原来的app标题

mTitle=(String) getTitle()

[java]  view plain  copy
  1. mDrawerToggle=new ActionBarDrawerToggle(this, mDrawerLayout,  
  2.                 R.string.drawer_open,R.string.drawer_close){  
  3.             @Override  
  4.             public void onDrawerOpened(View drawerView) {  
  5.                 super.onDrawerOpened(drawerView);  
  6.                 getActionBar().setTitle("请选择");  
  7.                 invalidateOptionsMenu();//重绘actionBar上的菜单项,执行这个方法的时候会回调onPreareOptionsMenu()  
  8.                   
  9.             }  
  10.             @Override  
  11.             public void onDrawerClosed(View drawerView) {  
  12.                 super.onDrawerClosed(drawerView);  
  13.                 getActionBar().setTitle(mTitle);  
  14.                 invalidateOptionsMenu();  
  15.                   
  16.             }  
  17.         };  
  18.         mDrawerLayout.setDrawerListener(mDrawerToggle);  
  19.           

因为我们改变了ActionBar的内容,因此要调用invalidateOptionsMenu()会重绘actionBar上的菜单项,执行这个方法的时候会回调onPreareOptionsMenu(),所以我们可以在这里通过判断抽屉处于打开还是关闭状态,来进行一些操作,比如隐藏actionbar的菜单项。

既然要隐藏,那么前提是我们得有菜单项,这里先给actionbar添加一个搜索按钮,关于给ActionBar添加按钮的办法,在关于ActionBar的博客里已经讲过了,所以这里直接操作

res/values/menu/main.xml

[java]  view plain  copy
  1. <menu xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     tools:context="com.example.drawerlayout.MainActivity" >  
  4.   
  5. <item  
  6.     android:id="@+id/websearch"  
  7.     android:icon="@drawable/action_search"  
  8.     android:showAsAction="ifRoom|withText"  
  9.     android:title="webSearch"  
  10.     />  
  11. </menu>  

然后将菜单加载进来

[java]  view plain  copy
  1. @Override  
  2. public boolean onCreateOptionsMenu(Menu menu) {  
  3.     getMenuInflater().inflate(R.menu.main, menu);  
  4.     return super.onCreateOptionsMenu(menu);  
  5. }  

顺路给这个搜索按钮设置点击事件

[java]  view plain  copy
  1. /*给actionBar的webSearch设置点击事件*/  
  2.     @Override  
  3.     public boolean onOptionsItemSelected(MenuItem item) {  
  4.   
  5.         switch (item.getItemId()) {  
  6.         case R.id.websearch:  
  7.             Intent intent=new Intent();  
  8.             intent.setAction("android.intent.action.VIEW");  
  9.             intent.setData(Uri.parse("http://www.baidu.com"));  
  10.             startActivity(intent);  
  11.             break;  
  12.         default:  
  13.             break;  
  14.         }  
  15.         return super.onOptionsItemSelected(item);  
  16.     }  

最后在onPrepareOptionsMenu()里通过DrawerLayout的isOpen()来判断,如果打开了就隐藏菜单项

[java]  view plain  copy
  1. @Override  
  2. public boolean onPrepareOptionsMenu(Menu menu) {  
  3.    /*在这里通过判断DrawerLayout是打开还是关闭,来判断是否显示actionBar的webSearch图标*/  
  4.     boolean isDrawerOpen=mDrawerLayout.isDrawerOpen(mListView);  
  5.     menu.findItem(R.id.websearch).setVisible(!isDrawerOpen);  //如果DrawerLayout是关闭的就显示actionBar里的webSearch  
  6.     return super.onPrepareOptionsMenu(menu);  
  7. }  



四)点击图标开闭抽屉

为了更加方便的使用抽屉,我们可以通过点击图标来开闭抽屉界面

1)在onCreate()里开启app icon的功能

[java]  view plain  copy
  1. //开启actionBar的APP icon的功能  
  2.     getActionBar().setDisplayHomeAsUpEnabled(true);  
  3.     getActionBar().setHomeButtonEnabled(true);  

2)因为图标也是一个菜单项,所以点击它也是会调用onOptionsItemSelected(MenuItem item)
[java]  view plain  copy
  1. @Override  
  2. public boolean onOptionsItemSelected(MenuItem item) {  
  3.     //将ActionBar上的图标与Drawer结合起来  
  4.     if(mDrawerToggle.onOptionsItemSelected(item)){  
  5.         return true;  
  6.     }  
  7.   
  8.              .......  

这样就实现了这个功能,但是图标还是原来的icon,现在把抽屉布局和ActionBarDrawerToggle同步

3)谷歌官方推荐在onPostCreate()里来同步,并且谷歌推荐写上onConfigurationChanged()

[java]  view plain  copy
  1. @Override  
  2. protected void onPostCreate(Bundle savedInstanceState) {  
  3.     //将ActionBarDrawerToggle与DrawerLayout同步起来  
  4.     //将ActionBarDrawerToggle中的Drawer图标设置为ActionBar里的Home_Button的图标  
  5.     mDrawerToggle.syncState();  
  6.       
  7.     super.onPostCreate(savedInstanceState);  
  8. }  
  9.   
  10.   //这个方法用来监测手机状态的变化,比如横屏竖屏的切换  
  11. @Override  
  12. public void onConfigurationChanged(Configuration newConfig) {  
  13.       
  14.     mDrawerToggle.onConfigurationChanged(newConfig);  
  15.     super.onConfigurationChanged(newConfig);  
  16. }  
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值