Jetpack：013-Jetpack底部导航栏

我们在上一章回中介绍了Jetpack中弹出菜单相关的内容，本章回中将介绍 底部导航栏。闲话休提，让我们一起Talk Android Jetpack吧！

1. 概念介绍

我们在本章回中介绍的底部导航栏就是位于屏幕最下方的内容，它通常包含多个图标，点击图标后可以跳转到不同页面，因此叫作底部导航栏。

Jetpack提供了两个可组合函数来实现底部导航栏，它们是NavigationBar和NavigationBarItem。本章回中将详细它们的使用的方法。

2. 使用方法

2.1 NavigationBar

该可组合函数主要用来当作容器，它可包含导航栏中的内容，主要是NavigationBarItem。它提供了相关的参数来设置导航栏，详细如下：

• containerColor参数:主要用来设置导航栏的背景颜色；
• contentColor参数:主要用来设置导航栏中内容的颜色；
• tonalElevation参数:主要用来设置阴影的效果；

我在实践中发现第二个参数没有效果，第三个参数的效果不是很明显，因此该函数可操控的内容比较少。

2.2 NavigationBarItem

• icon参数:主要用来控制导航栏中的图标；
• label参数:主要用来控制导航栏中的文本；
• selected参数:主要用来控制当前内容是否被选中；
• onClick参数:主要用来响点击事件，和Button中同名参数的用法相同；
• colors参数:主要用来控制Icon和label的颜色，包含选择和未选择时的颜色；

3. 示例代码

3.1 代码和注释

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CustomBottomNavigationBar() {
   
   
    //定义一个状态值在选择bar时使用
    var selectedItem by remember