当前位置:   article > 正文

Android侧滑菜单之DrawerLayout用法详解_android drawerlayout 关闭

android drawerlayout 关闭

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


一)创建DrawerLayout

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

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


 

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

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


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


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

  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. <TextView
  7. android:id="@+id/tv"
  8. android:layout_width="match_parent"
  9. android:layout_height="wrap_content"
  10. android:layout_gravity="center"
  11. android:textSize="25sp"/>
  12. </LinearLayout>

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

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

最后别忘了关闭抽屉

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


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

使用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()

  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. @Override
  10. public void onDrawerClosed(View drawerView) {
  11. super.onDrawerClosed(drawerView);
  12. getActionBar().setTitle(mTitle);
  13. invalidateOptionsMenu();
  14. }
  15. };
  16. mDrawerLayout.setDrawerListener(mDrawerToggle);

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

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

res/values/menu/main.xml

  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. <item
  5. android:id="@+id/websearch"
  6. android:icon="@drawable/action_search"
  7. android:showAsAction="ifRoom|withText"
  8. android:title="webSearch"
  9. />
  10. </menu>

然后将菜单加载进来

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

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

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

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

  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的功能

  1. //开启actionBar的APP icon的功能
  2. getActionBar().setDisplayHomeAsUpEnabled(true);
  3. getActionBar().setHomeButtonEnabled(true);

2)因为图标也是一个菜单项,所以点击它也是会调用onOptionsItemSelected(MenuItem item)
  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()

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


综合以上的所有内容,效果图如下



声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/279529
推荐阅读
相关标签
  

闽ICP备14008679号