Jetpack：014-Jetpack中的小红点

我们在上一章回中介绍了Jetpack库中底部栏相关的内容，本章回中主要介绍 小红点。闲话休提，让我们一起Talk Android Jetpack吧！

1. 概念介绍

我们在本章回中介绍的小红点是指位于导航栏图标右侧的小红点，它通常用来显示提示信息，常见的场景是微信底部导航栏中显示小红点，红点内还有数字，用来显示发来的消息数量。本章回中将介绍如何在底部导航栏中添加小红点。

2. 使用方法

小红点通过Badge可组合函数实现，不过还需要设置它与图标的位置，推荐的做法是使用BadgedBox可组合函数，该函数会自动调整小红点的位置，使用小红点位于图标的右上方。这两个可组合函数都提供了相关的参数来控制自己，接下来我们将分别介绍它们各自的参数。

2.1 Badge

• containerColor参数：用来控制小红点的背景颜色，通常是红色；
• contentColor参数：用来控制小红点中内容的颜色，通常是白色；
• content参数：用来存放小红点中的内容，通常使用Text可组合函数；

除了上面介绍的这些参数外，该可组合函数还有一个modifier通用参数，该参数可以修改小红点的大小。

2.2 BadgedBox

• badge参数:主要用来存放小红点，把Badge可组合函数赋值给它就可以；
• content参数:主要用来存放小红点附属的图标，通常使用Icon可组合函数给它赋值；

此外，content参数是可组合函数类型，而且是最后一个参数，因此可以使用尾lambda的语法给它赋值。我们将在后面的小节中通过示例代码来演示具体的用法。该函数会自动调整小红点的位置，使小红点位于content参数对应图标