Android App 侧边栏菜单的简单实现
效果图

Layout
注意事项
想要实现侧边栏,需要配合使用DrawerLayout。因为会用到嵌套布局,所以根布局不能是 ConstraintLayout,最好使用 LinearLayout 布局。
DrawerLayout 布局下再嵌套两个布局,一个放置内容如 LinearLayout,一个放置侧划菜单,这里使用 NavigationView
为了出现侧边栏点击图标和菜单图标,需要自定义一个 ToolBar,放置在内容 Layout 里
重点
侧划菜单 NavigationView 一定要设置 android:layout_gravity="start"
实例
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ebook.EbookActivity">
<androidx.drawerlayout.widget.DrawerLayout
android:id="@+id/drawer_ebook"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/main_menu_ebook"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:navigationIcon="@mipmap/menu_more" />
<TextView
android:id="@+id/bookContent"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/navigation_ebook"
android:layout_width="230dp"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/navigation_ebook_header"
app:menu="@menu/menu_drawer_ebook"/>
</androidx.drawerlayout.widget.DrawerLayout>
</LinearLayout>
上面不能加注释,有一点想特别说明一下,因为搞了好久,就是那个menu的三横图标怎么弄出来,开始一直在navigation上找,行不能,最后看到说toolbar本身可以设定,尝试一下确实ok
自已找的喜欢的图标
app:navigationIcon="@mipmap/menu_more"
Activity
绑定侧划监听事件
private lateinit var mBinding: ActivityEbookBinding
private lateinit var mDrawerToggle: ActionBarDrawerToggle
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
mBinding = ActivityEbookBinding.inflate(layoutInflater)
setContentView(mBinding.root)
setSupportActionBar(mBinding.mainMenuEbook)
initialData()
}
private fun initialData(){
//初使化侧边栏监听事件
mDrawerToggle = ActionBarDrawerToggle(this, mBinding.drawerEbook, mBinding.mainMenuEbook, R.string.openDrawerContentDesc, R.string.closeDrawerContentDesc)
mDrawerToggle.syncState()
//绑定侧边栏监听事件
mBinding.drawerEbook.addDrawerListener(mDrawerToggle)
//侧边栏菜单图标颜色恢复正常,而非默认的灰色
mBinding.navigationEbook.itemIconTintList = null
//绑定侧边栏菜单点击事件
mBinding.navigationEbook.setNavigationItemSelectedListener { item: MenuItem ->
when(item.itemId){
R.id.menu_drawer_ebook_setting -> showSnackBar(mBinding.navigationEbook,"menu_drawer_setting")
R.id.menu_drawer_ebook_close -> finish()
}
true
}
}
分类:
Android
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· Blazor Hybrid适配到HarmonyOS系统
· Obsidian + DeepSeek:免费 AI 助力你的知识管理,让你的笔记飞起来!
· 分享4款.NET开源、免费、实用的商城系统
· 解决跨域问题的这6种方案,真香!
· 一套基于 Material Design 规范实现的 Blazor 和 Razor 通用组件库