Android/Dialog

[Android] BottomSheetDialog 사용하기

O_Gyong 2022. 11. 21.

BottomSheetDialog는 하단에서 나타나는 Dialog로 xml을 통해 자신이 사용하고자 하는 데로 커스텀할 수 있다.

 

기본적으로 Dialog를 띄우려는 곳에 BottomSheetDialog의 객체를 만들어서 종속된 메서드들을 사용하면 되지만,

여러 화면에서 공용으로 사용하고 싶다면 BottomSheetDialog를 Builder 패턴의 클래스로 만들어 사용하는게 좋다고 생각한다.

 

예제로 버튼을 누르면 BottomSheetDialog를 띄우고 '취소' 버튼을 누르면 Dialog를 내리고, '확인' 버튼을 누르면 Toast를 띄우려고 한다.


Builder 패턴을 사용한 Dialog 클래스 만들기

class CustomBottomSheetDialog(context: Context) : BottomSheetDialog(context) {

    interface BtnClickListener {
        fun onBtnClick()
    }

    private var mBinding = DialogBottomSheetBinding.inflate(layoutInflater)

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        requestWindowFeature(Window.FEATURE_NO_TITLE)
        setContentView(mBinding.root)

        val behavior = BottomSheetBehavior.from(mBinding.root.parent as View)
        behavior.isHideable = false
    }

    class Builder(context: Context) {
        private val mDialog = CustomBottomSheetDialog(context)

        fun setTitle(text: String): Builder {
            mDialog.mBinding.tvTitle.text = text
            return this
        }

        fun setContent(text: String): Builder {
            mDialog.mBinding.tvContent.text = text
            return this
        }

        fun setCancelBtn(): Builder {
            mDialog.mBinding.btnCancel.setOnClickListener {
                mDialog.dismiss()
            }
            return this
        }

        fun setCheckBtn(rightBtnClickListener: BtnClickListener? = null): Builder {
            mDialog.mBinding.btnCheck.setOnClickListener {
                rightBtnClickListener?.onBtnClick()
            }
            return this
        }

        fun show(): CustomBottomSheetDialog {
            mDialog.show()
            return mDialog
        }
    }
}

 Builder 클래스에서 show() 이외에는 Builder 객체 자신이 리턴되도록 하고, Dialog를 보여줘야 하는 show()에서는 Dialog 객체를 리턴하도록 한다.

 

클릭 이벤트는 커스텀 리스너를 구현하여 처리했다. setCheckBtn에서 이벤트를 받아 Activity나 Fragment에서 override해서 사용할 수 있다.

 

Dialog가 노출되었을 때 드래그를 하면 Dialog가 닫히게 된다.

이 동작을 막으려면 BottomSheetBehavior를 사용해야 한다. BottomSheetBehavior의 ishideable은 아래로 드래그했을 때 View를 숨길지에 대한 여부를 결정한다.

ishideable의 값을 false로 하여 드래그를 막았다.


Activity에서의 사용

mBinding.btnOpen.setOnClickListener {
    CustomBottomSheetDialog.Builder(this)
        .setTitle("다이얼로그")
        .setContent("다이얼로그 생성")
        .setCheckBtn(object: CustomBottomSheetDialog.BtnClickListener{
            override fun onBtnClick() {
                Toast.makeText(this@MainActivity, "완료", Toast.LENGTH_LONG).show()
            }
        })
        .setCancelBtn()
        .show()
}

전체 코드

댓글