android中NavigationView(导航抽屉)

效果演示

<iframe allowfullscreen="true" data-mediaembed="bilibili" frameborder="0" id="J2PFUKUM-1586765521395" src="https://player.bilibili.com/player.html?aid=625228598"></iframe>

演示


NavigationView的布局文件

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    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">
    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="320dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/navigation_background_light"
        android:overScrollMode="never"
        app:headerLayout="@layout/layout_navigation_header"
        app:menu="@menu/navigation_main" />
</android.support.v4.widget.DrawerLayout>

下面才是关键
1、app:headerLayout="@layout/layout_navigation_header"
这条代码的作用就是设置导航抽屉的样子

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:id="@+id/header_container"
    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="200dp"
    android:clickable="true">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorPrimary">

        <ImageView
            android:id="@+id/background_image_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center|end|bottom"
            android:clickable="true"
            android:src="@drawable/home_menu_bg_click"
            android:tint="@color/nav_head_image_background" />
    </FrameLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:paddingTop="@dimen/activity_vertical_margin">

        <tingyuxuan.hosition.zxyoyo.com.tingyuxuan.view.design.CircleImageView
            android:id="@+id/user_avatar_view"
            android:layout_width="74dp"
            android:layout_height="74dp"
            android:layout_gravity="start|top"
            android:layout_marginEnd="16dp"
            android:layout_marginStart="@dimen/activity_vertical_margin"
            android:layout_marginTop="20dp"
            android:src="@drawable/ico_user_default"
            app:border_color="@android:color/white"
            app:border_width="1dp" />


        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:layout_marginEnd="20dp"
            android:layout_marginTop="20dp"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/iv_head_noftiy"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_navigation_header_notification" />


        </LinearLayout>


        <LinearLayout
            android:id="@+id/subtitle_layout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/user_avatar_view"
            android:layout_gravity="bottom"
            android:layout_marginStart="10dp"
            android:background="?attr/selectableItemBackground"
            android:orientation="vertical"
            android:paddingTop="5dp">


            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:orientation="horizontal"
                android:padding="5dp">

                <TextView
                    android:id="@+id/user_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/app_name"
                    android:textColor="@color/white"
                    android:textSize="16sp" />

                <TextView
                    android:id="@+id/user_level"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="3dp"
                    android:background="@drawable/white_border"
                    android:text="LV1"
                    android:gravity="center"
                    android:textColor="@color/white"
                    android:textSize="10sp" />

            </LinearLayout>


            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="3dp"
                android:background="@drawable/round_wihte_bg"
                android:padding="3dp"
                android:text="@string/app_name"
                android:textColor="@color/nav_head_roung_text_background"
                android:textSize="10sp" />

            <TextView
                android:text="@string/header_introduce"
                android:id="@+id/user_other_info"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="3dp"
                android:textColor="@color/white"
                android:textSize="14sp" />
        </LinearLayout>

    </RelativeLayout>


</FrameLayout>

2、app:menu="@menu/navigation_main"
这条代码的作用是设置导航抽屉中每个Item

<?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/item_home"
            android:checked="true"
            android:icon="@drawable/ic_home_black_24dp"
            android:title="@string/item_home" />
        <item
            android:id="@+id/item_serach"
            android:icon="@drawable/ic_action_search"
            android:title="图书搜索" />

    </group>


    <group
        android:id="@+id/group_user"
        android:checkableBehavior="single">

        <item
            android:id="@+id/item_favourite"
            android:icon="@drawable/ic_star_black_24dp"
            android:title="@string/item_favourite" />

        <item
            android:id="@+id/item_history"
            android:icon="@drawable/ic_history_black_24dp"
            android:title="@string/item_history" />


    </group>


    <group android:checkableBehavior="single">

        <item
        android:id="@+id/item_settings"
        android:icon="@drawable/ic_settings_black_24dp"
        android:title="@string/item_settings" />
        <item
            android:id="@+id/item_manager"
            android:icon="@drawable/ic_manager"
            android:title="@string/item_manager" />
        <item
            android:id="@+id/item_exit"
            android:icon="@drawable/ic_exit_to_app_black_24dp"
            android:title="@string/item_exit" />
    </group>
</menu>

之后就是在Activity中具体引用了

/*初始化NavigationView里面的内容*/
    private void initNavigationView() {
        mNavigationView.setNavigationItemSelectedListener(this);
        View headerView = mNavigationView.getHeaderView(0);
        CircleImageView mUserAvatarView = (CircleImageView) headerView.findViewById(R.id.user_avatar_view);
        TextView mUserName = (TextView) headerView.findViewById(R.id.user_name);
        TextView mUserLevel = (TextView) headerView.findViewById(R.id.user_level);
        String name = getSharedPreferences("user", MODE_PRIVATE).getString("username", "听雨喧");
        userLevel = DbUtil.getUserLevel(this, name);
        mUserLevel.setText("LV"+ userLevel);
        //设置名字
        mUserName.setText(name);
    }
/*重写onNavigationItemSelected方法,为每个点击item设置不同的效果*/
    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()){
            case R.id.item_exit:
                //切换帐号
                getSharedPreferences("user", MODE_PRIVATE).edit().putString("username","").commit();
                startActivity(new Intent(this,LoginActivity.class));
                finish();
                break;
                //主页
            case R.id.item_home:
                toggleDrawer();
                changeFragmentIndex(item, 0);
                boolean update = getSharedPreferences("book", MODE_PRIVATE).getBoolean("update", false);
                //System.out.println("-0-----------------dianjile--item_home:"+update);
                if(update){
                    homeFragment.reFreshData();
                }
                break;
                //管理界面
            case R.id.item_manager:
                toggleDrawer();
                if(userLevel<2){
                    ToastUtil.showLong(this,"抱歉,只有管理员才能进入");
                }else {
                    changeFragmentIndex(item, 1);
                }
                break;
                //收藏图书界面
            case R.id.item_favourite:
                toggleDrawer();
                changeFragmentIndex(item, 2);
                break;

                //设置界面
            case R.id.item_settings:
                toggleDrawer();
                changeFragmentIndex(item,3);
                break;

            case R.id.item_history:
                toggleDrawer();
                changeFragmentIndex(item, 4);
                break;
            case R.id.item_serach:
                toggleDrawer();
                changeFragmentIndex(item,5);
                break;
        }
        return false;
    }
上一篇:使用Kotlin实现文字渐变TextView


下一篇:安卓数据传递和数据回传简单注册和宠物装备购买