본문 바로가기

안드로이드

[Android Studio] 바텀 네비게이션 뱃지 활용하기 (코틀린)

728x90

 

Meterial Design 사이트

https://m2.material.io/components/bottom-navigation/android#using-bottom-navigation

 

Material Design

Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.

m3.material.io

 

 

 

// bottomNavigation = 객체 id 값 
var badge = bottomNavigation.getOrCreateBadge(menuItemId) // menuItemId = cliked 된 메뉴 id
badge.isVisible = true
// An icon only badge will be displayed unless a number is set:
badge.number = 99

 

뱃지 위치 조정하기 

 // 수직 위치 변경 (입력값이 클수록 뱃지가 아래로 이동)
badge.verticalOffset = dpToPxSize(2)
  // 수평 위치 변경 (입력값이 클수록 뱃지가 왼쪽으로 이동)
badge.horizontalOffset = dpToPxSize(2)


fun dpToPxSize(dp: Int): Int {
    val density = resources.displayMetrics.density
    return (dp.toFloat() * density).roundToInt()
}

 

 

뱃지, Text 색상 변경하기 

badge.backgroundColor = ContextCompat.getColor(
    this@MainActivity, R.color.black)
badge.badgeTextColor = ContextCompat.getColor(
  this@MainActivity, R.color.white)