Design 三: NavigationView + DrawerLayout

2-6 NavigationView控件

这里写图片描述

抽屉导航是app识别度与内部导航的关键,保持这里设计上的一致性对app的可用性至关重要,尤其是对于第一次使用的用户。 NavigationView 通过提供抽屉导航所需的框架让实现更简单,同时它还能够直接通过菜单资源文件直接生成导航元素。把NavigationView作为 DrawerLayout的内容视图来使用。NavigationView处理好了和状态栏的关系,可以确保NavigationView在API21+ 设备上正确的和状态栏交互。

注意项:

你可以通过设置一个OnNavigationItemSelectedListener,使用其 setNavigationItemSelectedListener()来获得元素被选中的回调事件。它为你提供被点击的菜单元素,让你可以处理选择事件、改变复选框状态、加载新内容、关闭导航菜单,以及其他任何你想做的操作。你会注意到NavigationView的两个新自定义属性如下:

new attrdescription
app:headerLayout控制头部的布局
app:menu导航菜单的资源文件(也可以在运行时配置)

实例代码:


页面:

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/dl_id"
    tools:context="bw.com.bw_day13.demo05.NavigationViewActivity">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="我是一个内容页面"
            android:layout_centerInParent="true"
            android:textSize="30sp"
            android:textColor="@color/colorAccent"/>
    </RelativeLayout>
    <!--
        app:headerLayout   控制头部的布局
        app:menu   导航菜单的资源文件(也可以在运行时配置)
    -->
    <android.support.design.widget.NavigationView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/nv_id"
        android:layout_gravity = "left"
        app:headerLayout="@layout/heard_view"
        app:menu="@menu/main"
        />





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

heard_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@mipmap/img4">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/tv_id"
        android:text="醒醒吧,骚年"
        android:textSize="30sp"
        android:layout_centerInParent="true"
        android:textColor="@color/colorAccent"
        />
</RelativeLayout>

菜单:  menu/main.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/action_set"
        android:title="设置"
        android:icon="@mipmap/settings"
        />
    <item
        android:id="@+id/action_above"
        android:title="关于"
        android:icon="@mipmap/message_icon"
        />
    <item
        android:id="@+id/action_clear"
        android:title="清除缓存"
        android:icon="@android:drawable/ic_notification_clear_all"
        />
</menu>

Activity 代码:

public class NavigationViewActivity extends AppCompatActivity {
    private NavigationView mHv;
    private DrawerLayout mDl;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_navigation_view);

        mHv = (NavigationView) findViewById(R.id.nv_id);
        mDl = (DrawerLayout) findViewById(R.id.dl_id);

        //可以获取头部视图
        View headerView = mHv.getHeaderView(0);
        TextView tv = (TextView) headerView.findViewById(R.id.tv_id);
        tv.setTextColor(Color.GREEN);

        //为菜单项添加事件处理
        mHv.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId())
                {
                    case R.id.action_set:
                        Toast.makeText(NavigationViewActivity.this, "你点击了设置选项", Toast.LENGTH_SHORT).show();
                        mDl.closeDrawer(Gravity.LEFT);//关闭抽屉
                        break;
                    case R.id.action_above:
                        Toast.makeText(NavigationViewActivity.this, "你点击了关于选项", Toast.LENGTH_SHORT).show();
                        mDl.closeDrawer(Gravity.LEFT);//关闭抽屉

                        break;

                    case R.id.action_clear:
                        Toast.makeText(NavigationViewActivity.this, "你点击了清除选项", Toast.LENGTH_SHORT).show();
                        mDl.closeDrawer(Gravity.LEFT);//关闭抽屉
                        break;
                }
                return false;
            }
        });
    }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值