在学习之前，我们先得知道侧边导航栏是什么？

它是一个 可以让内容从屏幕边缘滑出的布局容器，由安卓官方提供，用于创建侧边菜单，通常搭配 NavigationView 使用；

添加依赖：

在app下的build.gradle中添加以下代码：

implementation 'androidx.appcompat:appcompat:1.6.1'implementation 'com.google.android.material:material:1.11.0'implementation 'androidx.drawerlayout:drawerlayout:1.2.0'implementation 'androidx.constraintlayout:constraintlayout:2.1.4'

我们还需要在导包的时候修改一下：

把

import android.widget.Toolbar;

修改成

import androidx.appcompat.widget.Toolbar;

做好之后，我们就正式的开始学习了；

DrawerLayout的基本结构和用法

其实导航栏的实现就是靠DrawerLayout来实现的，我把概念放在下面：

DrawerLayout 是一个允许内容从屏幕边缘滑出显示的布局，适合放置菜单、用户信息或页面切换功能。它可以从**左边（start）或右边（end）**滑出，通常用于构建带有侧边栏的 Material Design 风格 App。

DrawerLayout的功能和特点

1. 侧滑菜单功能：DrawerLayout 提供侧边滑出菜单的实现，允许用户通过滑动屏幕边缘或点击按钮打开抽屉菜单，提升界面简洁性和可用性；

2. 支持左右两侧菜单：支持从屏幕的左侧或右侧分别展示抽屉菜单。通过 layout_gravity="start"（左侧）和 layout_gravity="end"（右侧）来指定；

3. 与 Toolbar 集成：可以与 Toolbar 和 ActionBarDrawerToggle 配合使用，在 Toolbar 上显示图标，通过点击图标打开或关闭抽屉；

4. 内建动画效果：DrawerLayout 自动提供抽屉打开和关闭的动画效果。主内容视图可以根据抽屉的滑动进行遮挡或平移，增强用户体验；

5. 支持监听抽屉事件：提供 DrawerListener，可以监听抽屉的打开、关闭、滑动、状态变化等事件，方便开发者根据抽屉状态执行相关操作。

6. 适配不同屏幕大小：DrawerLayout 可以自动适配小屏和大屏设备，适用于手机和平板等不同尺寸的屏幕，支持响应式布局。

7. 结合 NavigationView 使用：常与 NavigationView 配合使用，后者提供了方便的菜单项管理、头部布局和选中状态功能，适合构建标准的侧边导航菜单。

我们来讲讲代码，在代码中通过讲解它的属性，布局等来学习：

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayoutxmlns: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/main"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><LinearLayoutandroid:layout_width="match_parent"android:orientation="vertical"android:layout_height="match_parent"><androidx.appcompat.widget.Toolbarandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:id = "@+id/toolbar"app:subtitle="子标题"app:title="标题"app:navigationIcon="@drawable/title"></androidx.appcompat.widget.Toolbar><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Hello World!"android:layout_gravity="center"android:layout_marginTop="300dp"/></LinearLayout><com.google.android.material.navigation.NavigationViewandroid:layout_width="wrap_content"android:layout_height="match_parent"android:id = "@+id/nav_view"android:layout_gravity="start"app:headerLayout="@layout/nax_drawer_header"app:menu = "@menu/nav_drawer_menu"></com.google.android.material.navigation.NavigationView></androidx.drawerlayout.widget.DrawerLayout>

小知识点：

关于布局方面，我们需要学习两点：

  • 这里我们可以看到，drawerlayout布局中，可以放置多个子布局，但是子布局的顺序很重要：drawerlayout布局中，第一个子布局必须是app的主内容，后续的子布局才能是你的侧边导航栏；

官方规定：drawerlayout的第一个子view会被视为“主界面”，后续的view会被视为抽屉视图，比如侧边栏；

  • DrawerLayout 最多只能有两个直接子 View；

什么是直接子view，给大家举个例子?

比如上图，中间的两个子view都是直接子view;

<DrawerLayout><LinearLayout>                <FrameLayout />          <NavigationView />        </LinearLayout>
</DrawerLayout>

在上图中，<FrameLayout /> 就不是直接子view了；

回顾代码：

<DrawerLayout><FrameLayout /> or ConstraintLayout<NavigationView />
</DrawerLayout>

关于主界面中所需要用到的Toolbar:

第一个view:Toolbar

Toolbar 是 Android 中用于替代传统 ActionBar 的一个可高度自定义的顶部导航栏控件。它通常位于屏幕顶部，承载着应用的标题、导航按钮（如返回箭头或抽屉菜单图标）、操作菜单（如搜索、分享）等元素；

Toolbar 的特点：

  • 灵活可定制：可以自由设置布局、样式、颜色和内容，比传统 ActionBar 更加灵活；

  • 兼容性好：支持在不同 Android 版本中统一外观；

  • 可嵌入布局中：不像 ActionBar 固定，Toolbar 可以作为普通视图嵌入到任意布局，方便自定义设计；

  • 支持导航控件：例如左上角图标，常用于控制 DrawerLayout 的开合；

总结一下：Toolbar 就是你 App 界面顶部的“工具栏”，负责承载导航和操作入口；

这里不做过多的介绍，简要告诉大家属性：

      <androidx.appcompat.widget.Toolbarandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:id = "@+id/toolbar"app:subtitle="子标题"app:title="标题"app:navigationIcon="@drawable/title"></androidx.appcompat.widget.Toolbar>

在这段代码中：
比较生疏的属性就三个：

  1. app:subtitle="子标题"    设置副标题，显示在主标题下方，一般用来补充信息，比如当前子页面名、状态等。

  2. app:title="标题"         设置 Toolbar 的主标题，通常显示应用名称或当前页面名称
  3. app:navigationIcon="@drawable/title"   设置左侧的导航图标，比如常见的“返回箭头”或“汉堡菜单”图标，用于导航或打开 DrawerLayout 抽屉。

这是这么设置后的效果；

第二个布局是NavigationView，我们来系统的介绍一下吧；

NavigationView

主要介绍：

NavigationView 是 Android 支持库中提供的一个专门用于配合 DrawerLayout 实现侧边导航菜单的控件。它本质上是一个可滚动的菜单容器，通常放在 DrawerLayout 的“抽屉”部分，用于显示应用的导航条目。

它的主要作用：

  • 显示菜单项：可通过 menu 属性引用菜单 XML 文件（menu.xml），自动生成可点击的导航项；

  • 支持添加头部视图：通过 app:headerLayout 属性或 Java 代码添加用户头像、昵称、背景等内容；

  • 与 DrawerLayout 搭配：放在 DrawerLayout 的第二个子视图中，用来显示侧边导航栏；

  • 支持状态高亮、点击事件：点击某个菜单项自动高亮，可以配合 NavigationItemSelectedListener 实现页面跳转；

  • 自带 Material Design 风格：默认支持波纹点击动画、图标与文本组合布局等；

   <com.google.android.material.navigation.NavigationViewandroid:layout_width="wrap_content"android:layout_height="match_parent"android:id = "@+id/nav_view"android:layout_gravity="start"app:headerLayout="@layout/nax_drawer_header"app:menu = "@menu/nav_drawer_menu"></com.google.android.material.navigation.NavigationView>
  • app:menu：引用一个菜单 XML 文件，定义导航项
  • app:headerLayout：引用一个布局 XML 文件，作为导航头部
  • android:layout_gravity="start"：指定抽屉从哪边滑出，通常是 start 表示左侧，end代表右侧；
  • itemIconTint, itemTextColor：设置菜单图标和文字的颜色

app:menu：菜单的定义 

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:id="@+id/it_title"android:title="更改头像"/><itemandroid:id="@+id/it_name"android:title="修改昵称"/><itemandroid:id="@+id/it_chatperson"android:title="在线人数"/><itemandroid:id="@+id/it_gotochat"android:title="去聊天"/><itemandroid:id="@+id/it_exit"android:title="退出"/>
</menu>

 app:headerLayout ：导航头部

<?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="300dp"android:orientation="vertical"><ImageViewandroid:layout_width="70dp"android:layout_height="70dp"android:src = "@drawable/title1"android:layout_marginTop="100dp"android:layout_gravity="center"/><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:id = "@+id/tv_title"android:layout_marginTop="20dp"android:layout_gravity="center"android:text="个人中心"/>
</LinearLayout>

 关于监听事件

    navigationView = findViewById(R.id.nav_view);Toolbar toolbar = findViewById(R.id.toolbar);setSupportActionBar(toolbar);DrawerLayout drawerLayout = findViewById(R.id.main);toolbar.setNavigationOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {drawerLayout.openDrawer(Gravity.LEFT);}});

这是关于toolbar开启侧边栏视图的代码： 

  • 获取 toolbar，设置为当前 Activity 的 ActionBar；

  • setSupportActionBar(toolbar) 使 Toolbar 能使用 ActionBar 的功能，比如标题、返回按钮、菜单等；

  • Toolbar 左上角“导航按钮”的点击事件监听器；

  • 手动打开左侧的抽屉（Gravity.LEFT 表示“左侧抽屉”）；

   drawerLayout.openDrawer(Gravity.LEFT);这句手动打开抽屉视图的代码，同时我们也可以为按钮设立点击事件；

  drawerLayout.closeDrawer(Gravity.RIGHT);

同时我们也可以手动关闭侧边栏 ；

下面是关于每个菜单项的点击事件，我们可以利用点击事件达到我们想要的结果；

  navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {@Overridepublic boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {int id = menuItem.getItemId();if(id == R.id.it_chatperson){Toast.makeText(MainActivity.this,"chatperson",Toast.LENGTH_SHORT).show();}else if(id == R.id.it_exit){Toast.makeText(MainActivity.this,"exit",Toast.LENGTH_SHORT).show();}else if(id == R.id.it_gotochat){Toast.makeText(MainActivity.this,"gotochat",Toast.LENGTH_SHORT).show();}else if(id == R.id.it_name){Toast.makeText(MainActivity.this,"name",Toast.LENGTH_SHORT).show();}else if(id == R.id.it_title){Toast.makeText(MainActivity.this,"title",Toast.LENGTH_SHORT).show();}return true;}});

给 NavigationView 设置一个 菜单点击事件监听器setNavigationItemSelectedListener(...) 是 NavigationView 专用的方法；

最后完成的效果如下： 

本次分享到此结束！ 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若转载，请注明出处：http://www.pswp.cn/web/91605.shtml
繁体地址，请注明出处：http://hk.pswp.cn/web/91605.shtml
英文地址，请注明出处：http://en.pswp.cn/web/91605.shtml

如若内容造成侵权/违法违规/事实不符，请联系英文站点网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

lesson30：Python迭代三剑客：可迭代对象、迭代器与生成器深度解析

lesson30：Python迭代三剑客：可迭代对象、迭代器与生成器深度解析

目录 一、可迭代对象&#xff1a;迭代的起点 可迭代对象的本质特征 可迭代对象的工作原理 自定义可迭代对象 二、迭代器&#xff1a;状态化的迭代工具 迭代器协议与核心方法 迭代器的状态管理 内置迭代器的应用 三、生成器&#xff1a;简洁高效的迭代器 生成器函数&a…
阅读更多...
实时语音流分段识别技术解析：基于WebRTC VAD的智能分割策略

实时语音流分段识别技术解析：基于WebRTC VAD的智能分割策略

引言 在现代语音识别应用中&#xff0c;实时处理音频流是一项关键技术挑战。不同于传统的文件式语音识别&#xff0c;流式处理需要面对音频数据的不确定性、网络延迟以及实时性要求等问题。本文将深入解析一个基于WebRTC VAD&#xff08;Voice Activity Detection&#xff09;…
阅读更多...
word中rtf格式介绍

word中rtf格式介绍

RTF&#xff08;Rich Text Format&#xff0c;富文本格式&#xff09;是一种由微软开发的跨平台文档文件格式&#xff0c;用于在不同应用程序和操作系统之间交换格式化文本。以下是对RTF格式的简要说明&#xff1a; RTF格式特点 跨平台兼容性&#xff1a;RTF文件可以在多种文字…
阅读更多...
Springboot 配置 doris 连接

Springboot 配置 doris 连接

Springboot 配置 doris 连接 一. 使用 druid 连接池 因为 Doris 的前端&#xff08;FE&#xff09;兼容了 MySQL 协议&#xff0c;可以像连 MySQL 一样连 Doris。这是 Doris 的一个核心设计特性&#xff0c;目的是方便接入、简化生态兼容。 首先需要引入 pom 依赖:<dependen…
阅读更多...
Linux 系统启动与 GRUB2 核心操作指南

Linux 系统启动与 GRUB2 核心操作指南

Linux 系统启动与 GRUB2 核心操作指南 Linux 系统的启动过程是一个环环相扣的链条&#xff0c;从硬件自检到用户登录&#xff0c;每一步都依赖关键组件的协作。其中&#xff0c;GRUB2 引导器和systemd 进程是核心枢纽&#xff0c;而运行级别则决定了系统的启动状态。以下是系统…
阅读更多...
供应链分销代发源码：一站式打通供应商供货、平台定价、经销商批发及零售环节

供应链分销代发源码：一站式打通供应商供货、平台定价、经销商批发及零售环节

在当前复杂的市场环境中&#xff0c;供应链管理成为企业发展的关键。尤其对于电商平台来说&#xff0c;高效、精准的供应链管理不仅能提升运营效率&#xff0c;还能增强市场竞争力。为了应对日益复杂的供应链挑战&#xff0c;核货宝供应链分销代发系统应运而生&#xff0c;旨在…
阅读更多...
机器学习、深度学习与数据挖掘：核心技术差异、应用场景与工程实践指南

机器学习、深度学习与数据挖掘：核心技术差异、应用场景与工程实践指南

技术原理与核心概念数据挖掘作为知识发现的关键技术&#xff0c;其核心在于通过算法自动探索数据中的潜在模式。关联规则挖掘可以发现项目之间的有趣关联&#xff0c;如经典的"啤酒与尿布"案例&#xff1b;聚类分析能够将相似对象自动分组&#xff0c;常用于客户细分…
阅读更多...
《C++初阶之STL》【stack/queue/priority_queue容器适配器：详解 + 实现】（附加：deque容器介绍）

《C++初阶之STL》【stack/queue/priority_queue容器适配器：详解 + 实现】（附加：deque容器介绍）

【stack/queue/priority_queue容器适配器&#xff1a;详解 实现】目录前言&#xff1a;------------标准接口介绍------------一、栈&#xff1a;stack标准模板库中的stack容器适配器是什么样的呢&#xff1f;1. 栈的基本操作std::stack::topstd::stack::pushstd::stack::pop2…
阅读更多...
Thymeleaf 模板引擎原理

Thymeleaf 模板引擎原理

Thymeleaf 的模板文件&#xff0c;本质上是标准的 HTML 文件&#xff0c;只是“加了标记&#xff08; th&#xff1a;&#xff09;的属性”&#xff0c;让模板引擎在服务端渲染时能 识别并处理 这些属性&#xff0c;从而完成数据&#xff08;model&#xff09; 的填充。<!DO…
阅读更多...
5、生产Redis高并发分布式锁实战

5、生产Redis高并发分布式锁实战

一、核心问题与解决方案 问题本质 #mermaid-svg-W1SnVWZe1AotTtDy {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-W1SnVWZe1AotTtDy .error-icon{fill:#552222;}#mermaid-svg-W1SnVWZe1AotTtDy .error-text{fill:#5…
阅读更多...
CS231n-2017 Lecture8深度学习框架笔记

CS231n-2017 Lecture8深度学习框架笔记

深度学习硬件&#xff1a;CPU:CPU有数个核心&#xff0c;每个核心可以独立工作&#xff0c;同时进行多个线程&#xff0c;内存与系统共享GPU&#xff1a;GPU有上千个核心&#xff0c;但每个核心运行速度很慢&#xff0c;适合并行做类似的工作&#xff0c;不能独立工作&#xff…
阅读更多...
以ros的docker镜像为例，探讨docker镜像的使用

以ros的docker镜像为例，探讨docker镜像的使用

标题以ros的docker镜像为例&#xff0c;探讨docker镜像的使用&#xff08;待完善&#xff09; 1. docker介绍&#xff08;以ros工程距离&#xff09; &#xff08;1&#xff09;个人理解&#xff1a;docker就是一个容器&#xff0c;主要的作用就是将环境打包好&#xff0c;方…
阅读更多...
Android Audio实战——TimeCheck机制解析（十三）

Android Audio实战——TimeCheck机制解析（十三）

上一篇文章我们虽然通过 tombstoned Log 推断出 audioserver 崩溃的原因就是系统调用内核接口时发生阻塞，导致 TimeCheck 检测超时异常而崩溃，但并没有实质性的证据证明是 kernel 层出现问题导致的崩溃，因此这里我们继续看一下 TimeCheck 的检测原理。 一、TimeCheck机制 T…
阅读更多...
飞机大战小游戏

飞机大战小游戏

1.视觉设计&#xff1a;采用柔和的蓝紫色渐变背景&#xff0c;营造梦幻感飞机、敌机和子弹使用柔和的糖果色调添加了粒子爆炸效果&#xff0c;增强视觉反馈星星收集物增加游戏趣味性2.游戏机制&#xff1a;玩家使用左右方向键控制飞机移动空格键发射子弹P键暂停游戏击落敌机获得…
阅读更多...
Linux 启动服务脚本

Linux 启动服务脚本

1. 创建命令文件# 创建可执行文件 touch 文件名称 例&#xff1a; touch stopServer.sh2. 命令文件授权# 授权文件可执行权限 chmod 777 文件名称 例&#xff1a; chmod 777 stopServer.sh3. 停止服务命令编写#!/bin/bash# 获取进程号 pidps -ef | grep -- /mnt/apache-tomcat-…
阅读更多...
【华为机试】34. 在排序数组中查找元素的第一个和最后一个位置

【华为机试】34. 在排序数组中查找元素的第一个和最后一个位置

文章目录34. 在排序数组中查找元素的第一个和最后一个位置描述示例 1&#xff1a;示例 2&#xff1a;示例 3&#xff1a;提示&#xff1a;解题思路算法分析问题本质分析双重二分查找详解左边界查找过程右边界查找过程算法流程图边界情况分析各种解法对比二分查找变种详解时间复…
阅读更多...
【网络编程】WebSocket 实现简易Web多人聊天室

【网络编程】WebSocket 实现简易Web多人聊天室

一、实现思路 Web端就是使用html JavaScript来实现页面&#xff0c;通过WebSocket长连接和服务器保持通讯&#xff0c;协议的payload使用JSON格式封装 服务端使用C配合第三方库WebSocket和nlonlohmann库来实现 二、Web端 2.1 界面显示 首先&#xff0c;使用html来设计一个…
阅读更多...
AI 驱动、设施扩展、验证器强化、上线 EVM 测试网，Injective 近期动态全更新！

AI 驱动、设施扩展、验证器强化、上线 EVM 测试网，Injective 近期动态全更新！

作为一个专注于金融应用、且具有高度可互操作性的高性能 Layer-1 区块链&#xff0c;Injective 自诞生以来便为开发者提供有即插即用的技术模块&#xff0c;以便开发者能够更好地搭建新一代 Web3 金融类应用。谈及项目发展的愿景和基本定位&#xff0c;创始团队曾提到希望 Inje…
阅读更多...
Qt-----初识

Qt-----初识

1. 什么是Qt定义&#xff1a;Qt是一个跨平台的应用程序和用户界面框架&#xff0c;主要用于开发具有图形用户界面的应用程序&#xff0c;同时也支持非GUI程序的开发。 编程语言&#xff1a;主要使用C&#xff0c;但也提供了对Python&#xff08;PyQt&#xff09;、JavaScript&a…
阅读更多...
理解微信体系中的 AppID、OpenID 和 UnionID

理解微信体系中的 AppID、OpenID 和 UnionID

前言: 在开发微信相关的服务(如小程序,公众号,微信开放平台等)时,很多人都会接触到几个看起来相似但实际用途不同的额ID: AppiD, OpenID,UnionID. 搞清楚这三者的区别,是微信生态开发中的基本功,本文将从开发者视角触发,深入浅出地解释它们的关系,区别以及实际应用场景一.什么是…
阅读更多...
最新文章

Copyright @ 2022~2023