在溢出菜单图标上添加徽章 - Android

Question

有没有简单的方法可以在工具栏上的溢出菜单（三点菜单）图标上添加简单的徽章/点？

我试图向用户展示里面有一个新的菜单项。请注意，我应该能够以编程方式添加/删除它。任何帮助表示赞赏。

Answer 1

首先，在styles.xml中自定义溢出按钮样式：（

<!-- Application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
    <!-- Your theme customization... -->
    <item name="android:actionOverflowButtonStyle">@style/MyActionOverflowButtonStyle</item>
</style>

<!-- Here you choose the ID of the overflow icon. -->
<item type="id" name="myActionOverflowButtonID"/>

<!-- Style to replace action bar overflow icon. -->
<style name="MyActionOverflowButtonStyle" parent="Widget.AppCompat.ActionButton.Overflow">
    <item name="android:id">@id/myActionOverflowButtonID</item>
</style>

灵感来自如何将 android 上的三点按钮更改为其他按钮，但使用 android:id 而不是 android:src 在样式中）

然后，添加一个 徽章：

// Get the button view
val view = findViewById<View>(R.id.myActionOverflowButtonID)
// Create and customize a badge, e.g:
val badgeDrawable = BadgeDrawable.create(context).apply {
    backgroundColor = getColor(R.color.primary)
    horizontalOffset = 30
    verticalOffset = 30
    number = 2
}
// Attach the badge to the button
// For this API, you need to update Material components dependency to 1.3.0 or later
BadgeUtils.attachBadgeDrawable(badgeDrawable, view)

Answer 2

您可以使用简单的 BadgeDrawable：

val badgeDrawable = BadgeDrawable.create(context).apply {
  // configure (set background color, offsets, etc) 
}

并稍后添加/删除它：

BadgeUtils.attachBadgeDrawable(badgeDrawable, toolbar, menuItemId)

或

BadgeUtils.detachBadgeDrawable(badgeDrawable, toolbar, menuItemId)