この記事はmaterial-components-androidのv1.1.0系の使い方で最新では使えないのでAndroid BottomNavigationViewにBadgeをつけるをご参照ください。
先日、たまたまmaterial-components-android
のCatalogアプリを見ていたらBottomNavigationにBadge機能がついていました。
これ、最近追加されたんですかね・・・。もしかして自分が知らなかっただけ?
Badge機能がないからViewに無理やりBadge風なviewを追加して対応していた思い出があるので標準対応すると安心感があっていいですね。
Badgeの付け方
まずテーマにTheme.MaterialComponents
か、それを継承しているテーマを指定する必要があります。
今回はTheme.MaterialComponents.DayNight.DarkActionBar
を指定しました。
Badgeの付け方はすごいシンプルで以下のようになります。
またBadgeで数が多いと999+
のように省略されます。
このときに表示する桁数(文字数)を指定することができます。
デフォルトの桁数はBadgeDrawable#DEFAULT_MAX_BADGE_CHARACTER_COUNT
として定義されて4桁になっているみたいです。
BadgeDrawable.java
もし特定のタブだけ桁数を変える場合はプログラムで変更することができます。
スタイルにbadgeStyle
を指定することでバッジ全体に設定することもできます。
ただ今回スタイルに指定しているTheme.MaterialComponents.DayNight.DarkActionBar
の祖先Base.V14.Theme.MaterialComponents.Light
でbadgeStyle
が追加されたのはmaterial:1.1.0-alpha07
からなので1.1.0-alpha06
の場合はbadgeStyle
は指定できません。
桁数はmaxCharacterCount
で設定します。
試しにmaxCharacterCount
に2を設定すると以下のような画面になり設定が反映されているのがわかります。
またBadgeの背景色を変えたい場合はbackgroundColor
を変更すればよさそうです。
AndroidXもそうですけどマテリアルコンポーネントもいろいろ進化していて追従するのが大変ですが、確実に便利になっていると感じます。