NavigationView在MD设计中非常重要,之前Google也提出了使用DrawerLayout来实现导航抽屉。这次,在Android Design Support Library中,Google提供了NavigationView来实现导航菜单界面。

这次我们写的代码在Android用TabLayout实现类似网易选项卡动态滑动效果这篇文章代码的基础上进行修改,所以最好先看看上面这篇文章

首先仍旧是配置build.gradle:

dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:22.2.0'
compile 'com.android.support:design:22.2.0'
compile 'com.android.support:recyclerview-v7:22.2.0'
compile 'com.android.support:cardview-v7:22.2.0'
}

‘com.android.support:design:22.2.0’com.android.support:design:22.2.0就是我们需要引入的Android Design Support Library,其次我们还引入了Recyclerview和Cardview。

主界面布局(activity_tab_layout.xml)

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
android:id="@+id/dl_main_drawer"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".TabLayoutActivity"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="#ADBE107E"
app:tabMode="scrollable"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="@+id/nv_main_navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/navigation_header"
app:menu="@menu/drawer_view"/>
</android.support.v4.widget.DrawerLayout>

DrawerLayout标签包含了主界面的布局以及抽屉的布局,NavigationView标签下app:headerLayout=”” 可以引入头部文件
app:menu=””则引入菜单的布局。

头部布局文件(navigation_header.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="?attr/colorPrimaryDark"
android:orientation="horizontal"
android:theme="@style/ThemeOverlay.AppCompat.Dark">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="50dp"
android:background="@drawable/ic_user"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_gravity="center_vertical"
android:text="Liuwangshu"
android:textAppearance="@style/TextAppearance.AppCompat.Body1"
android:textSize="20sp"/>
</LinearLayout>

菜单布局文件(drawer_view.xml)

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item
android:id="@+id/nav_home"
android:icon="@drawable/ic_dashboard"
android:title="首页"/>
<item
android:id="@+id/nav_messages"
android:icon="@drawable/ic_event"
android:title="事项"/>
<item
android:id="@+id/nav_friends"
android:icon="@drawable/ic_headset"
android:title="音乐"/>
<item
android:id="@+id/nav_discussion"
android:icon="@drawable/ic_forum"
android:title="消息"/>
</group>
<item android:title="其他">
<menu>
<item
android:icon="@drawable/ic_dashboard"
android:title="设置"/>
<item
android:icon="@drawable/ic_dashboard"
android:title="关于我们"/>
</menu>
</item>
</menu>

来看看主界面的java代码(TabLayoutActivity.java)

package com.example.liuwangshu.mytablayout;
import android.support.design.widget.NavigationView;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.GravityCompat;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import java.util.ArrayList;
import java.util.List;
public class TabLayoutActivity extends AppCompatActivity {
private DrawerLayout mDrawerLayout;
private ViewPager mViewPager;
private TabLayout mTabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab_layout);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final ActionBar ab = getSupportActionBar();
ab.setHomeAsUpIndicator(R.drawable.ic_menu);
ab.setDisplayHomeAsUpEnabled(true);
mViewPager = (ViewPager) findViewById(R.id.viewpager);
mDrawerLayout = (DrawerLayout) findViewById(R.id.dl_main_drawer);
NavigationView navigationView =
(NavigationView) findViewById(R.id.nv_main_navigation);
if (navigationView != null) {
navigationView.setNavigationItemSelectedListener(
new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(MenuItem menuItem) {
menuItem.setChecked(true);
mDrawerLayout.closeDrawers();
return true;
}
});
}
initViewPager();
}

navigationView.setNavigationItemSelectedListener对菜单的条目进行了监听,如果被点击则将条目设置为选中状态并收回抽屉。当然别忘了对toolbar的菜单选项进行监听回调,否则抽屉就出不来了。
(TabLayoutActivity.java)

@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
mDrawerLayout.openDrawer(GravityCompat.START);
return true;
}
return super.onOptionsItemSelected(item);
}

最后运行程序来看看效果

github源码下载

Android Design Support Library(二)用NavigationView实现抽屉菜单界面的更多相关文章

  1. Android Design Support Library初探,NavigationView实践

    前言 在前几天的IO大会上,Google带来了Android M,同时还有Android支持库的新一轮更新,其中更是增加一个全新的支持库Android Design Support Library,包 ...

  2. 【转】【翻】Android Design Support Library 的 代码实验——几行代码,让你的 APP 变得花俏

    转自:http://mrfufufu.github.io/android/2015/07/01/Codelab_Android_Design_Support_Library.html [翻]Andro ...

  3. Android Design Support Library 的 代码实验——几行代码,让你的 APP 变得花俏

    原文:Codelab for Android Design Support Library used in I/O Rewind Bangkok session--Make your app fanc ...

  4. Android Design Support Library使用详解

    Android Design Support Library使用详解 Google在2015的IO大会上,给我们带来了更加详细的Material Design设计规范,同时,也给我们带来了全新的And ...

  5. Codelab for Android Design Support Library used in I/O Rewind Bangkok session

    At the moment I believe that there is no any Android Developer who doesn't know about Material Desig ...

  6. Android Design Support Library: 学习CoordinatorLayout

    简述 CoordinatorLayout字面意思是"协调器布局",它是Design Support Library中提供的一个超级帧布局,帮助我们实现Material Design ...

  7. Material Design 开发利器:Android Design Support Library 介绍

    转自:https://blog.leancloud.cn/3306/ Android 5.0 Lollipop 是迄今为止最重大的一次发布,很大程度上是因为 material design —— 这是 ...

  8. Android Design Support Library使用详解——Snackbar

    Google在2015 I/O大会上,给我们带来了更加详细的Material Design规范,同时也引入了Android Design Support Library,为我们提供了基于Materia ...

  9. Android Design Support Library——Navigation View

    前沿 Android 从5.0开始引入了Material design元素的设计,这种新的设计语言让整个安卓的用户体验焕然一新,google在Android Design Support Librar ...

随机推荐

  1. 使用代码查看Nutch爬取的网站后生成的SequenceFile信息

    必须针对data文件中的value类型来使用对应的类来查看(把这个data文件,放到了本地Windows的D盘根目录下). 代码: package cn.summerchill.nutch; impo ...

  2. MySQL数据导入到Mongo

    背景:如题干所述,需要将一份数据导入到mongo数据库,减少项目依赖的数据源. 解决方案: 使用mongo自带的mongoimport工具. 首先在test库里创建一个空集合:[import_test ...

  3. C# 多线程学习系列三之CLR线程池系列之ThreadPool

    一.CLR线程池 1.进程和CLR的关系一个进程可以只包含一个CLR,也可以包含多个CLR2.CLR和AppDomain的关系一个CLR可以包含多个AppDomain3.CLR和线程池的关系一个CLR ...

  4. 浅尝Vue.js组件(二)

    本篇目录: 插槽(Slot) 插槽内容 作用域 具名插槽 作用域插槽 独占默认插槽的缩写语法 解构插槽Prop 使用场景举例 动态插槽名 具名插槽缩写 动态组件&keep-alive 异步组件 ...

  5. Java1.8 JDK源码中,对两个类进行 按位与 操作是什么意思

    Java容器类库中的Map接口(java\util\Map.java)中有一个Entry接口(java\util\Map.java),其中有几个接口方法用到了类和类的按位与操作,即类和类之间有 &am ...

  6. java提供类与cglib包实现动态代理

    终于有点空余时间,决定把之前学习的知识点整理一下,备以后复习. 动态代理有三角色:抽象角色,代理角色,真是角色. 第一个记录下java提供的动态代理.即使用Proxy类和InvocationHande ...

  7. WPF中Grid的行的Height和列的Width根据内容自适应

    Grid中RowDefinition的Height和ColumnDefinition的设置都有三种: 1. 具体数值,固定不变: 2. * 星号,如: 2*,5*,8*: 分母为(2+5+8=15), ...

  8. C++关于sort和priority_queue的运算符重载

    C++中的sort函数默认是将元素升序排列的,而priority_queue默认是将元素降序排列的(默认实现的是大顶堆). 自定义运算符用的比较多,以下2种对sort和priority_queue运算 ...

  9. CentOS6.5 QT5.3 找不到GLIBCXX3.4.15解决方法

    下载安装后 启动的时候提示 GLIBCXX_3.4.15,发现libstdc++.so.6的版本过, 在安装qt-creator的时候运行这个IDE就出现了这个问题,是由于libstdc++.so.6 ...

  10. java中数据的传递方式到底是怎样的!

    今天早上我了一道有关java的题.主要考点是考java中值得传递方式. 之前我在javaoo里总结的是:基本数据类型中保存的是实际的值,引用数据类型保存的是被引用的内存地址,那么基本数据类型就是按值传 ...