欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android组件创建DrawerLayout导航

程序员文章站 2024-02-24 09:10:34
概述 本篇博客是对developer.android.com/上的training课程的简单翻译,若是觉得翻译出来的理解有困难,请点击下方链接查看原文! 关于drawe...

概述
本篇博客是对developer.android.com/上的training课程的简单翻译,若是觉得翻译出来的理解有困难,请点击下方链接查看原文!
关于drawerlayout的training:
关于drawerlayout的api:http://developer.android.com/reference/android/support/v4/widget/drawerlayout.html

创建抽屉布局

        创建一个抽屉布局必须得以drawerlayout作为xml文件的根节点,记住,drawerlayout引用的是android.support.v4.drawerlayout,然后在布局内部添加内容视图区域和一个或者两个抽屉视图区域,这里理解抽屉视图即为上面描述的菜单视图。例如下面一段布局中显示,在布局中添加一个framelayout作为内容区域(通常用来呈现fragment),另外在下面定义了一个listview用来呈现抽屉菜单视图:

<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" /> 
  <!-- 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> 

这个布局文件示范了一些重要的布局特征.

  • 主要内容的视图(framelayout)必须是drawlayout的第一个子元素, 因为导航抽屉是在主要内容视图的上面.
  • 主要内容视图设置为匹配父视图的宽度和高度, 因为它代表了整个界面导航抽屉是隐藏的.
  • 抽屉视图(listview)必须指定其水平重力与android:layout_gravity属性。支持从右到左(rtl)语言,指定值与 "start" 代替 "left"(所以抽屉里出现在布局的右侧当布局是rtl时).
  • 抽屉视图指定其宽度用dp单位和高度匹配父视图。抽屉里的宽度不能超过320 dp, 所以用户总是可以看到主要内容视图的一部分.

初始化抽屉列表

        在你的activity中, 第一件事就是初始化导航抽屉列表里面的元素, 你如何做取决于你的应用程序的内容,但一个导航抽屉通常包括一个listview, 因此清单应该由一个adapter填充(例如arrayadapter或simplecursoradapter).
例如, 这里演示了如何用string array来初始化一个导航列表.

public class mainactivity extends activity { 
  private string[] mplanettitles; 
  private drawerlayout mdrawerlayout; 
  private listview mdrawerlist; 
  ... 
 
  @override 
  public void oncreate(bundle savedinstancestate) { 
    super.oncreate(savedinstancestate); 
    setcontentview(r.layout.activity_main); 
 
    mplanettitles = getresources().getstringarray(r.array.planets_array); 
    mdrawerlayout = (drawerlayout) findviewbyid(r.id.drawer_layout); 
    mdrawerlist = (listview) findviewbyid(r.id.left_drawer); 
 
    // set the adapter for the list view 
    mdrawerlist.setadapter(new arrayadapter<string>(this, 
        r.layout.drawer_list_item, mplanettitles)); 
    // set the list's click listener 
    mdrawerlist.setonitemclicklistener(new draweritemclicklistener()); 
 
    ... 
  } 
} 

这个代码调用setonitemclicklistener()去接收导航抽屉列表的点击事件. 下一节将展示如何实现这个接口,当用户选择一个item时改变内容视图.

处理导航点击事件

当用户选择了抽屉列表里面的一个item时, 系统调用onitemclicklistener上的onitemclick(), 给setonitemclicklistener().
你在onitemclick()方法里面做什么, 取决于你的app实现的结构. 在下面的例子中, 选择每一个item都会在主要内容的布局中插入一个不同的fragment.

private class draweritemclicklistener implements listview.onitemclicklistener { 
  @override 
  public void onitemclick(adapterview parent, view view, int position, long id) { 
    selectitem(position); 
  } 
} 
 
/** swaps fragments in the main content view */ 
private void selectitem(int position) { 
  // create a new fragment and specify the planet to show based on position 
  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 fragmentmanager = getfragmentmanager(); 
  fragmentmanager.begintransaction() 
          .replace(r.id.content_frame, fragment) 
          .commit(); 
 
  // highlight the selected item, update the title, and close the drawer 
  mdrawerlist.setitemchecked(position, true); 
  settitle(mplanettitles[position]); 
  mdrawerlayout.closedrawer(mdrawerlist); 
} 
 
@override 
public void settitle(charsequence title) { 
  mtitle = title; 
  getactionbar().settitle(mtitle); 
} 

监听打开和关闭事件

       侦听抽屉打开和关闭事件,调用你的drawerlayout setdrawerlistener(), 并将其传递给drawerlayout.drawerlistener的实现. 这个接口提供了回调抽屉事件, 如ondraweropened()和ondrawerclosed ()。
      然而, 相对于实现drawerlayout.drawerlistener, 如果你的activity包括工具栏, 可以代替继承actionbardrawertoggle类. actionbardrawertoggle实现了drawerlayout.drawerlistener. 所以你仍然可以覆盖这些回调, 但它也有助于正确的交互行为, 在工具栏的图标和导航抽屉之间(下一节将进一步讨论)。
      就像在导航抽屉设计指南一样,当抽屉是可见的时候, 你应该修改工具栏的内容, 如改变标题和删除操作item. 下面的代码用actionbardrawertoggle类的一个实例, 显示了如何重写drawerlayout.drawerlistener的回调方法:

public class mainactivity extends activity { 
  private drawerlayout mdrawerlayout; 
  private actionbardrawertoggle mdrawertoggle; 
  private charsequence mdrawertitle; 
  private charsequence mtitle; 
  ... 
 
  @override 
  public void oncreate(bundle savedinstancestate) { 
    super.oncreate(savedinstancestate); 
    setcontentview(r.layout.activity_main); 
    ... 
 
    mtitle = mdrawertitle = gettitle(); 
    mdrawerlayout = (drawerlayout) findviewbyid(r.id.drawer_layout); 
    mdrawertoggle = new actionbardrawertoggle(this, mdrawerlayout, 
        r.drawable.ic_drawer, r.string.drawer_open, r.string.drawer_close) { 
 
      /** called when a drawer has settled in a completely closed state. */ 
      public void ondrawerclosed(view view) { 
        super.ondrawerclosed(view); 
        getactionbar().settitle(mtitle); 
        invalidateoptionsmenu(); // creates call to onprepareoptionsmenu() 
      } 
 
      /** called when a drawer has settled in a completely open state. */ 
      public void ondraweropened(view drawerview) { 
        super.ondraweropened(drawerview); 
        getactionbar().settitle(mdrawertitle); 
        invalidateoptionsmenu(); // creates call to onprepareoptionsmenu() 
      } 
    }; 
 
    // set the drawer toggle as the drawerlistener 
    mdrawerlayout.setdrawerlistener(mdrawertoggle); 
  } 
 
  /* called whenever we call invalidateoptionsmenu() */ 
  @override 
  public boolean onprepareoptionsmenu(menu menu) { 
    // if the nav drawer is open, hide action items related to the content view 
    boolean draweropen = mdrawerlayout.isdraweropen(mdrawerlist); 
    menu.finditem(r.id.action_websearch).setvisible(!draweropen); 
    return super.onprepareoptionsmenu(menu); 
  } 
} 

下一节描述actionbardrawertoggle构造函数参数和其他所需的步骤来设置它来处理工具栏的图标.

打开关闭应用图标

        用户可以打开和关闭导航抽屉, 通过手指从屏幕左侧的边缘滑动, 但如果你使用工具栏, 你应该也能允许用户打开和关闭它, 通过触摸应用程序图标. 应用程序图标也可以显示一个特殊的图标关于导航抽屉的状态. 你可以实现所有这些行为通过使用actionbardrawertoggle, 如前一节所示。
让actionbardrawertoggle工作, 创建一个它的实例用它的构造方法, 这就需要以下参数:

  • 持有抽屉的activity.
  • drawerlayout对象.
  • 一个drawable资源作为抽屉指示器.
  • 字符串资源描述"打开抽屉"动作.
  • 字符串资源描述"关闭抽屉"动作.

然后, 无论你是否已经创建了一个actionbardrawertoggle的子类作为你的抽屉的listener, 你需要在几个activity生命周期的地方, 调用你的actionbardrawertoggle:

public class mainactivity extends activity { 
  private drawerlayout mdrawerlayout; 
  private actionbardrawertoggle mdrawertoggle; 
  ... 
 
  public void oncreate(bundle savedinstancestate) { 
    ... 
 
    mdrawerlayout = (drawerlayout) findviewbyid(r.id.drawer_layout); 
    mdrawertoggle = new actionbardrawertoggle( 
        this,         /* host activity */ 
        mdrawerlayout,     /* drawerlayout object */ 
        r.drawable.ic_drawer, /* nav drawer icon to replace 'up' caret */ 
        r.string.drawer_open, /* "open drawer" description */ 
        r.string.drawer_close /* "close drawer" description */ 
        ) { 
 
      /** called when a drawer has settled in a completely closed state. */ 
      public void ondrawerclosed(view view) { 
        super.ondrawerclosed(view); 
        getactionbar().settitle(mtitle); 
      } 
 
      /** called when a drawer has settled in a completely open state. */ 
      public void ondraweropened(view drawerview) { 
        super.ondraweropened(drawerview); 
        getactionbar().settitle(mdrawertitle); 
      } 
    }; 
 
    // set the drawer toggle as the drawerlistener 
    mdrawerlayout.setdrawerlistener(mdrawertoggle); 
 
    getactionbar().setdisplayhomeasupenabled(true); 
    getactionbar().sethomebuttonenabled(true); 
  } 
 
  @override 
  protected void onpostcreate(bundle savedinstancestate) { 
    super.onpostcreate(savedinstancestate); 
    // sync the toggle state after onrestoreinstancestate has occurred. 
    mdrawertoggle.syncstate(); 
  } 
 
  @override 
  public void onconfigurationchanged(configuration newconfig) { 
    super.onconfigurationchanged(newconfig); 
    mdrawertoggle.onconfigurationchanged(newconfig); 
  } 
 
  @override 
  public boolean onoptionsitemselected(menuitem item) { 
    // pass the event to actionbardrawertoggle, if it returns 
    // true, then it has handled the app icon touch event 
    if (mdrawertoggle.onoptionsitemselected(item)) { 
     return true; 
    } 
    // handle your other action bar items... 
 
    return super.onoptionsitemselected(item); 
  } 
 
  ... 
} 

Android组件创建DrawerLayout导航

官方demo:http://xiazai.jb51.net/201701/yuanma/navigationdrawer(jb51.net).rar

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。