android Material Design 学习之三:NavigationView 使用

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/dhl_1986/article/details/80226798

在MD学习之二中提到了DrawerLayout 侧滑,但是滑动区域太过于单调,我们看看网易云音乐的侧滑,下图:


就比较充实,MD 提供了一种可以让滑动变得丰富的控件 NavigationView 。


基本使用

布局:

在DrawerLayout 添加 NavigationView,直接把MD 学习之二 中的TextView 换成 NavigationView

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:openDrawer="start"
    >

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <include layout="@layout/tool_bar_layout"/>

</FrameLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/nav_menu" />

</android.support.v4.widget.DrawerLayout>

在这里,引用了headerLayout 和 menu 

headerLayout :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="@dimen/nav_header_height"
    android:background="?attr/colorPrimary"
    android:gravity="bottom"
    android:orientation="vertical"
    android:padding="16dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing"
        app:srcCompat="@mipmap/ic_launcher_round" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing"
        android:text="test"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="***@**.com" />

</LinearLayout>

menu:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    tools:showIn="navigation_view">

    <group android:checkableBehavior="single">
        <item
            android:id="@+id/nav_camera"
            android:icon="@drawable/ic_menu_camera"
            android:title="Import" />
        <item
            android:id="@+id/nav_gallery"
            android:icon="@drawable/ic_menu_gallery"
            android:title="Gallery" />
        <item
            android:id="@+id/nav_slideshow"
            android:icon="@drawable/ic_menu_slideshow"
            android:title="Slideshow" />
        <item
            android:id="@+id/nav_manage"
            android:icon="@drawable/ic_menu_manage"
            android:title="Tools" />
    </group>

    <item android:title="Communicate">
        <menu>
            <item
                android:id="@+id/nav_share"
                android:icon="@drawable/ic_menu_share"
                android:title="Share" />
            <item
                android:id="@+id/nav_send"
                android:icon="@drawable/ic_menu_send"
                android:title="Send" />
        </menu>
    </item>

</menu>

这里上面四个Item ,下面2个item,group 表示一个组,

android:checkableBehavior="single"

代表每个Item 只能单选。


代码:

先获取实例

navigationView = (NavigationView) findViewById(R.id.nav_view);

 默认选中的Item

navigationView.setCheckedItem(R.id.nav_camera);

选择事件监听:

  navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                drawerLayout.closeDrawers();
                switch (item.getItemId())
                {
                    case R.id.nav_camera:
                        Toast.makeText(DrawerLayoutActivity.this, "相机", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.nav_gallery :
                        Toast.makeText(DrawerLayoutActivity.this, "相册", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.nav_slideshow :

                        break;
                    case R.id.nav_manage :

                        break;
                    case R.id.nav_share :
                        Toast.makeText(DrawerLayoutActivity.this, "分享", Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.nav_send:
                        Toast.makeText(DrawerLayoutActivity.this, "发送", Toast.LENGTH_SHORT).show();
                        break;

                }
                return true;
            }
        });


猜你喜欢

转载自blog.csdn.net/dhl_1986/article/details/80226798