Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Badging for Tabs and Bottom Navigation

umechanhika
February 12, 2020

Badging for Tabs and Bottom Navigation

umechanhika

February 12, 2020
Tweet

More Decks by umechanhika

Other Decks in Programming

Transcript

  1. val tabBadge: BadgeDrawable = tabLayout.getTabAt(0)?.orCreateBadge tabBadge.isVisible = true Show “Dot

    badge” Reference:https://material.io/develop/android/components/tab-layout/
  2. Show “Badge with number” val tabBadge: BadgeDrawable = tabLayout.getTabAt(0)?.orCreateBadge tabBadge.number

    = 99 tabBadge.isVisible = true Reference:https://material.io/develop/android/components/tab-layout/
  3. Show “Badge with a maximum count” val tabBadge: BadgeDrawable =

    tabLayout.getTabAt(0)?.orCreateBadge tabBadge.maxCharacterCount = 3 tabBadge.number = 1000 tabBadge.isVisible = true Reference:https://material.io/develop/android/components/tab-layout/
  4. Caution max “character” count It can shows “9+”, “99+” or

    etc. It cannot shows “5+”, “10+” or etc. Reference:https://material.io/develop/android/components/tab-layout/
  5. Tab and BottomNav can show badges since MDC 1.1.0 Use

    BadgeDrawable It can show “Dot”, “Number” and “Maximum count” badge Summary