BadgeView 的使用

Posted 2023-03-15

参考技术A

1、定义
一个可以自由定制外观、支持拖拽消除的 MaterialDesign 风格 android BadgeView
2、特性
随意定制外观，包括 Badge 位置、底色、边框、阴影、文字颜色(支持透明色)、大小、内外边距等
Badge 数字小于 0 时显示 dot，等于 0 时隐藏整个 Badge，在普通模式下超过 99 时显示 99+，精确模式下显示具体值
支持设置文本内容
支持设置图片背景
支持类似 QQ 的拖拽消除效果（默认关闭）
支持以动画的方式隐藏 Badge

Badge 需要绑定一个 View，所有方法和操作都是以这个 View 为中心的。因为本文讲的是 BottomNavigationView ，所以就以 BottomNavigationView 的 MenuItemView 为中心。

查看源码可以看到 BottomNavigationMenuView 是 BottomNavigationView 内部添加的一个子 View，也就是说他是导航栏中添加的所有 Menu 的一个父 View ，那么获取 BottomNavigationMenuView 以及子 Menu 就很简单了。

Badge 是一个接口，创建实现类 QBadgeView 对象，然后设置相关属性。

BadgeView 设置绑定 View、数字、位置

setExactMode(boolean isExact) 方法设置为 false，当消息数>99,则显示 99+，若设置为 true，当消息数>99，则显示具体的消息数。

setShowShadow(boolean showShadow) 方法设置为 true 时表示有阴影效果，为 false 时取消阴影效果。

BadgeView 添加 setOnDragStateChangedListener 监听，即可实现仿 QQ 拖拽效果，本文在 BottomNavigationView 导航栏 Item 上使用，也可以在 RecyclerView 的 Item 上实现，使用极其简单。

回调函数 onDragStateChanged 其中 dragState 状态有五种：

以上只是挑选出来几个比较常用的属性做详细讲解，如果对其他属性感兴趣的可以自己写个案例尝试一下。