[kotlin] 안드로이드 snackbar

Leechaeyeon·2023년 6월 30일

코틀린 안드로이드

목록 보기

4/21

SnackBar

Snackbar은 안드로이드에서 경고, 안내 또는 액션을 사용자에게 표시하는데 사용되는 컴포넌트입니다. Snackbar은 Material Design 스타일에 따라 디자인되어 있으며, 사용자에게 간단한 메시지를 표시하거나 사용자의 조작에 대한 피드백을 제공하는 데 유용

Snackbar은 일시적으로 화면의 하단에 나타나며, 일정 시간이 지나면 자동으로 사라진다. Snackbar은 사용자가 액션을 수행할 수 있는 버튼을 포함할 수 있다.

아래는 유튜브 뮤직이다. 유튜브 뮤직에서 음악을 틀고 내리면 다음과 같이 실행된다.

 snackbar = Snackbar.make(it,"기본 스낵바",Snackbar.LENGTH_INDEFINITE)

Snackbar.LENGTH_SHORT : 짧게 띄웠다가 내리기
Snackbar.LENGTH_LONG : 길게 띄웠다가 내리기
Snackbar.LENGTH_INDEFINITE : 계속 띄우기

snackbar 함수

fun onShown(transientBottomBar: T?)

snackbar가 화면에 나타날 때 호출되는 콜백 메서드
transientBottomBar: 나타나는 Snackbar 인스턴스
onShown() 메서드를 사용하여 Snackbar가 화면에 나타날 때 추가적인 동작을 수행할 수 있습니다. 예를 들어, onShown() 메서드 내에서 UI 요소의 상태를 변경하거나 추가 동작을 수행할 수 있다. 이 메서드는 Snackbar가 화면에 나타난 직후에 호출되므로, Snackbar가 화면에 정확히 나타난 후에 수행해야 하는 작업을 여기에 추가할 수 있다.

fun onDismissed(transientBottomBar: T?, event: Int)

snack가 사라질때 원하는 동작을 수행
transientBottomBar: 사라지는 Snackbar 인스턴스
event: 사라짐 이벤트를 나타내는 정수 값 DISMISSEVENT* 상수 중 하나일 수 있습니다. 예를 들어, DISMISS_EVENT_SWIPE는 사용자가 스와이프하여 Snackbar를 닫을 때 발생한 이벤트를 나타낸다.
onDismissed() 메서드를 사용하여 Snackbar가 사라질 때 추가적인 동작을 수행할 수 있다.
예를 들어, onDismissed() 메서드 내에서 UI 요소의 상태를 변경하거나 추가 동작을 수행할 수 있다.

fun showCustomSnackbar(view: View, message: String) {
        val snackbar = Snackbar.make(view, message, Snackbar.LENGTH_INDEFINITE)
        snackbar.addCallback(object:BaseTransientBottomBar.BaseCallback<Snackbar>(){
            override fun onShown(transientBottomBar: Snackbar?) {
                showSnackTextView.text = "snackbar 나타났습니다!"
                super.onShown(transientBottomBar)
            }

            override fun onDismissed(transientBottomBar: Snackbar?, event: Int) {
                showSnackTextView.text = "SnackBar가 사라졌습니다!"
                super.onDismissed(transientBottomBar, event)
            }
        })
        snackbar.show()
    }

baseTransitenBottomBar

BaseTransientBottomBar.BaseCallback()를 사용하여 Snackbar의 콜백을 정의하고, 필요한 콜백 메서드를 오버라이드하여 원하는 동작을 구현할 수 있다.

Snackbar

선택 전

button 선택 후

snackbar에 있는 Action을 선택 후

fun showCustomSnackbar(view: View, message: String) {
        val snackbar = Snackbar.make(view, message, Snackbar.LENGTH_INDEFINITE)
        snackbar.addCallback(object:BaseTransientBottomBar.BaseCallback<Snackbar>(){
            override fun onShown(transientBottomBar: Snackbar?) {
                showSnackTextView.text = "snackbar 나타났습니다!"
                super.onShown(transientBottomBar)
            }

            override fun onDismissed(transientBottomBar: Snackbar?, event: Int) {
                showSnackTextView.text = "SnackBar가 사라졌습니다!"
                super.onDismissed(transientBottomBar, event)
            }
        })

        // snackbar 메시지 색상
        snackbar.setTextColor(Color.WHITE)
        // 배경색
        snackbar.setBackgroundTint(Color.GRAY)
        // 애니메이션
        snackbar.animationMode = Snackbar.ANIMATION_MODE_SLIDE
        // Action 설정
        snackbar.setAction("Action1"){
            activityMainBinding.textView2.text = "Action1을 눌렀습니다."
        }
        snackbar.show()
    }

activityMainBinding

activityMainBinding.run{
            showSnackTextView = textView
            button.setOnClickListener {
                showCustomSnackbar(root, "메시지") // root를 Snackbar를 표시할 View로 전달
            }
        }

snackbar 지우기

button2.setOnClickListener {
                // snackbar 변수가 초기화 되어있다면
                if(::snackbar.isInitialized){
                    if(snackbar.isShown==true) snackbar.dismiss()
                }
            }

customerSnackbar

fun showCustomSnackbar(view: View, message: String){
      snackbar = Snackbar.make(view,message,Snackbar.LENGTH_INDEFINITE)
      // viewbinding
      val snackbarBinding = SnackbarBinding.inflate(layoutInflater)
      snackbarBinding.run{
          imageViewSnackBar.setImageResource(R.drawable.kotlin_icon_130893)
          TextViewSnackBar.text = message

      }

      val snackBarLayout = snackbar.view as Snackbar.SnackbarLayout
      snackBarLayout.addView(snackbarBinding.root)
      // snackbar가 가지고 잇는 Textview를 보이지 않게 한다.
      val t1 = snackBarLayout.findViewById<TextView>(com.google.android.material.R.id.snackbar_text)
      t1.visibility = View.INVISIBLE

      snackbar.show()
  }