当前位置：首页 > news >正文

Android 实现左侧导航栏：NavigationView是什么？NavigationView和Navigation搭配使用

news 2025/7/15 16:32:52

一、实现左侧导航栏

在这里插入图片描述由于Android这边没有直接提供左侧导航栏的控件，所以我尝试了很多方法，但ui都有很多局限，使用BottomNavigationView达不到如下这种效果，并且我想结合Navigation来使用，简化跳转以及创建fragment的流程。所以呢，研究了一下NavigationView和Navigation搭配使用。

二、NavigationView是什么

NavigationView是一种用于实现应用导航功能的侧滑菜单控件。

NavigationView是Navigation在Android开发中的一个具体实现，特别是用于侧边导航菜单的控件。

Navigation则是一个更广泛的概念，指的是支持用户导航、进入和退出应用中不同内容片段的交互机制。它不仅限于某个特定的控件或组件，而是涵盖了应用中所有与导航相关的功能和设计。

三、NavigationView和Navigation搭配使用

首先，我们先创建NavigationView

（1）创建Menu

在这里插入图片描述

这里我们就先创建两个菜单项

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:id="@+id/backstage_datastatfragment"android:title="首页" /><!--暂时不使用数据统计的功能--><itemandroid:id="@+id/backstage_errorstatfragment"android:title="数据统计"/>
</menu>

（2）创建NavigationView，通过menu属性，绑定刚才创建的菜单项

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:background="@drawable/dingdian_pic_background_sys"><com.google.android.material.navigation.NavigationViewandroid:id="@+id/bnv_main_navigationbar"android:layout_width="400dp"android:layout_height="match_parent"android:background="@color/white"android:paddingHorizontal="9dp"app:itemBackground="@color/white"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"app:menu="@menu/backstage_menu_setting" /></androidx.constraintlayout.widget.ConstraintLayout>

（3）创建Navigation

【参考：这篇文章Android Jetpack(一)：Navigation】https://blog.csdn.net/qq_40853919/article/details/139973342

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:background="@drawable/dingdian_pic_background_sys"><com.google.android.material.navigation.NavigationViewandroid:id="@+id/bnv_main_navigationbar"android:layout_width="400dp"android:layout_height="match_parent"android:background="@color/white"android:paddingHorizontal="9dp"app:itemBackground="@color/white"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"app:menu="@menu/backstage_menu_setting" /><androidx.fragment.app.FragmentContainerViewandroid:id="@+id/home_fragmentcontainerview"android:name="androidx.navigation.fragment.NavHostFragment"android:layout_width="0dp"android:layout_height="match_parent"app:defaultNavHost="true"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toEndOf="@+id/bnv_main_navigationbar"app:navGraph="@navigation/backstage_nav" /></androidx.constraintlayout.widget.ConstraintLayout>

backstage_nav的内容

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/backstage_nav"app:startDestination="@id/backstage_datastatfragment"><fragmentandroid:id="@+id/backstage_datastatfragment"android:name="com.quyunshuo.wanandroid.home.ui.fragment.DataStatFragment"android:label="DataStatFragment" /><fragmentandroid:id="@+id/backstage_errorstatfragment"android:name="com.quyunshuo.wanandroid.home.ui.fragment.ErrorStatFragment"android:label="ErrorStatFragment" />
</navigation>（1）DataStatFragment的布局内容
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"><TextViewandroid:id="@+id/backstage_textview2"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="errorstat"android:textSize="40dp"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>（2）ErrorStatFragment的内容
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"><TextViewandroid:id="@+id/backstage_textview"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Datastat"android:textSize="40dp"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

注意，menu中item的id值必须与Navigation.xml 中定义的fragment的id对应不然点击没有反应

（4）在activity中进行导航跳转

 override fun BackstageActivitySettingBinding.initView() {bnvMainNavigationbar.setNavigationItemSelectedListener{//使用navigation的方法来直接跳转，因为id相同，就可以直接跳转。val findNavController = findNavController(homeFragmentcontainerview.id)findNavController.navigate(it.itemId)true}}

运行程序，点击界面会发生变化。

在这里插入图片描述

四、NavigationView的其他方法

（1）比如我们要给菜单的item增加icon，那么可以使用如下这个属性

在这里插入图片描述
（2）其他属性

app:headerLayout="@layout/navigation_layout"NavigationView的头部布局，指定了一个布局文件作为NavigationView的头部布局。这个头部布局通常包含一些静态信息，如用户的头像和用户名。android:paddingHorizontal="9dp"：为NavigationView设置了水平方向上的内边距（即左右两边）app:itemTextAppearance="@style/Menu"：指定了菜单项文本的外观样式。

总结：NavigationView和Navigation的搭配使用，Navigation简化了非常多的fragment跳转逻辑以及创建，让我们使用起来更加的舒服和方便。

查看全文

http://www.lryc.cn/news/414512.html