SnackBar

- Toast의 업그레이드 버전이라고 불리기도 하는 메시징 도구이다.

- Activity 위에 표시되며 하단에 나타나는 메시지이다.

- 안드로이드 11버전 부터 기본 Toast는 계속 사용 가능하고 커스터 마이징 부분은 SnackBar를 이용하는 것을 권장한다.

 

기본 SnackBar 구성하기

- SnackBar.make 메서드를 통해 SnackBar를 구성하고 show 메서드로 표시하면된다.

- setTextColor : 표시되는 메시지의 색상을 설정한다.

- setBackgroundTint : 배경 색상을 지정한다.

- animationMode : 나타나고 사라지는 애니메이션을 설정한다.

- setAction : 클릭하면 이벤트를 처리할 수 있는 요소를 설정한다.

 

Callback

- Snackbar가 나타나고 사라졌을 때 반응한다.

 

 

package com.sypark.snackbar

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import com.google.android.material.snackbar.Snackbar
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        button.setOnClickListener{
            val snack1 = Snackbar.make(it,"기본 스낵바",Snackbar.LENGTH_SHORT)
            snack1.show()
        }

    }
}

- SnackBar.make 메서드를 통해 SnackBar를 구성하고 show 메서드로 표시하면된다.

- setTextColor : 표시되는 메시지의 색상을 설정한다.

- setBackgroundTint : 배경 색상을 지정한다.

- animationMode : 나타나고 사라지는 애니메이션을 설정한다.

- setAction : 클릭하면 이벤트를 처리할 수 있는 요소를 설정한다.

 

위 요소들 사용하기

package com.sypark.snackbar

import android.graphics.Color
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import com.google.android.material.snackbar.Snackbar
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        button.setOnClickListener{
            val snack1 = Snackbar.make(it,"기본 스낵바",Snackbar.LENGTH_INDEFINITE)
            snack1.show()

            //커스터 마이징
            snack1.setTextColor(Color.RED)
            snack1.setBackgroundTint(Color.WHITE)
            snack1.animationMode = Snackbar.ANIMATION_MODE_FADE
            snack1.setAction("Button"){
                textView.text = "Action Click"
            }
        }

    }
}

기본 스낵바 BUTTON 클릭시

 

Callback 사용하기

val callback = object:BaseTransientBottomBar.BaseCallback<Snackbar>(){
                override fun onShown(transientBottomBar: Snackbar?) {
                    textView2.text = "SnackBar가 나타났습니다"
                }

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

            snack1.addCallback(callback)

 

SnackBar 커스터마이징

- Snackbar는 새로운 View를 설정하는 메서드나 프로퍼티가 없다.

- Snackbar를 구성하기 위해 사용되는 Layout을 추출해 View를 추가해서 처리한다.

 

package com.sypark.snackbar

import android.graphics.Color
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.TextView
import com.google.android.material.snackbar.BaseTransientBottomBar
import com.google.android.material.snackbar.Snackbar
import kotlinx.android.synthetic.main.activity_main.*
import kotlinx.android.synthetic.main.custom_snakbar.*

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        button.setOnClickListener{
            val snack1 = Snackbar.make(it,"기본 스낵바",Snackbar.LENGTH_INDEFINITE)

            //커스터 마이징
            snack1.setTextColor(Color.RED)
            snack1.setBackgroundTint(Color.WHITE)
            snack1.animationMode = Snackbar.ANIMATION_MODE_FADE

            val callback = object:BaseTransientBottomBar.BaseCallback<Snackbar>(){
                override fun onShown(transientBottomBar: Snackbar?) {
                    textView2.text = "SnackBar가 나타났습니다"
                }

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

            snack1.addCallback(callback)

            snack1.setAction("Button"){
                textView.text = "Action Click"
            }
            snack1.show()
        }

        button2.setOnClickListener {
            //스낵바를 만들어준다.
            val snack2 = Snackbar.make(it,"Custom SnackBar",Snackbar.LENGTH_SHORT)
            //스낵바를 통해 보여줄 뷰를 생성한다.
            val snackView = layoutInflater.inflate(R.layout.custom_snakbar,null)

            snackView.run{
                imageView.setImageResource(R.drawable.ic_launcher_foreground)
                textView3.text = "새로 추가된 View"
                textView3.setTextColor(Color.WHITE)
            }

            //스낵바 레이아웃을 추출해서 새로운 뷰를 추가한다.
            val snackbarlayout = snack2.view as Snackbar.SnackbarLayout
            snackbarlayout.addView(snackView)

            //스낵바에 있는 TextView를 추출해서 이를 보이지 않게 처리한다.
            val snackTest = snackbarlayout.findViewById<TextView>(com.google.android.material.R.id.snackbar_text)
            snackTest.visibility = View.INVISIBLE
            snack2.show()
        }

    }
}

학습정리

- SnackBar는 Activity 하단에 나타나는 메시지이다.

- Toast 대신 사용하는 것을 권장한다.

 

커스터 마이징 오류 떠서 작동안함.. 담에 다시 시도