Badge
徽章角标
设计与 API 文档
使用徽章
| Badge | 带数字的Badge | 带最大字符数的Badge |
|---|---|---|
![]() | ![]() |
⭐ 注意
此组件仍在开发中,可能不支持 Material Android 组件通常支持的全部自定义范围,例如主题属性。
BadgeDrawable 代表动态信息,例如在 BottomNavigationView 或 TabLayout中的待处理请求数量。
用法
API 和源代码:
通过调用 create(Context) 或 createFromAttributes(Context, AttributeSet, int, int) 创建 BadgeDrawable 的实例。
在 API 级别上,添加和显示 BadgeDrawable 的方法取决于 API 级别:
在 API 18 及以上(支持 ViewOverlay 的 API)
将
BadgeDrawable添加为所需锚视图的 ViewOverlay。使用
#updateBadgeCoordinates(View)根据锚视图更新BadgeDrawable的坐标(中心和边界)。
这两个步骤已封装在一个工具方法中:
BadgeUtils.attachBadgeDrawable(badgeDrawable, anchor);在 API 18 以下
- 将
BadgeDrawable设置为锚视图的FrameLayout祖先的前景。 - 根据锚视图的坐标相对其
FrameLayout祖先的坐标空间,更新BadgeDrawable的坐标(中心和边界)。
选项 1: BadgeDrawable 将动态创建并包装锚视图在一个 FrameLayout 中,然后将 FrameLayout 插入到视图层次结构中的原始锚视图位置。 语法与 API 18 及以上相同。
BadgeUtils.attachBadgeDrawable(badgeDrawable, anchor);选项 2:如果您不希望 BadgeDrawable 修改视图层次结构,可以指定一个 FrameLayout 来显示徽章。
BadgeUtils.attachBadgeDrawable(badgeDrawable, anchor, anchorFrameLayoutParent);Gravity 模式
BadgeDrawable 提供两种 Gravity 模式来控制徽章与锚视图的对齐方式。 默认情况下(TOP_END),徽章与锚的顶部和末尾边缘对齐(带有一些偏移)。 另外,您可以使用 TOP_START 将徽章与锚的顶部和起始边缘对齐。 请注意,BOTTOM_START 和 BOTTOM_END 已被弃用,不建议使用。
位置和偏移
默认情况下,BadgeDrawable 与其锚视图的顶部和末尾边缘对齐(如果 offsetAlignmentMode 为 legacy,则带有一些偏移)。 调用 setBadgeGravity(int) 可以将其更改为其他支持的模式。 要根据锚的中心调整徽章的偏移量,请使用 setHorizontalOffset(int) 或 setVerticalOffset(int)。
无论偏移量如何,徽章会自动移动到其第一个不会裁剪其子视图的祖先视图的边界内,以确保在有足够空间时徽章不会被裁剪。
属性
| 特性 | 相关属性 |
|---|---|
| 颜色 | app:backgroundColor app:badgeTextColor |
| 宽度 | app:badgeWidth app:badgeWithTextWidth |
| 高度 | app:badgeHeight app:badgeWithTextHeight |
| 形状 | app:badgeShapeAppearance app:badgeShapeAppearanceOverlay app:badgeWithTextShapeAppearance app:badgeWithTextShapeAppearanceOverlay |
| 标签 | app:badgeText (用于文本) app:number (用于数字) |
| 标签长度 | app:maxCharacterCount (用于所有文本) app:maxNumber (仅用于数字) |
| 标签文本颜色 | app:badgeTextColor |
| 标签文本外观 | app:badgeTextAppearance |
| 徽章重力 | app:badgeGravity |
| 偏移对齐 | app:offsetAlignmentMode |
| 水平内边距 | app:badgeWidePadding |
| 垂直内边距 | app:badgeVerticalPadding |
| 大字体垂直偏移 | app:largeFontVerticalOffsetAdjustment |
| 徽章固定边缘 | app:badgeFixedEdge |
⭐ 注意
如果同时指定了 app:badgeText 和 app:number,徽章标签将为 app:badgeText。
Talkback 支持
BadgeDrawable 提供了一个获取其内容描述的方法,该描述基于显示的数字或文本(如果有)。 为了指定内容描述,开发者可以使用以下方法:
setContentDescriptionForText(CharSequence)setContentDescriptionQuantityStringsResource(@PluralsRes int)setContentDescriptionExceedsMaxBadgeNumberStringResource(@StringRes int)setContentDescriptionNumberless(CharSequence)

