Custom Dialog 만드는 방법

최대한 쉽고 간단하게 설명해 보도록 하겠습니다

우선 앞서 저는 databinding을 사용하였습니다

 

---

Dialog xml 생성

---

다이어로그로 표시해줄 xml을 생성합니다

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">

    <data>

    </data>

    <RelativeLayout
        android:layout_width="match_parent"
        android:background="@color/white"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingTop="20dp">

            <TextView
                android:id="@+id/text_title"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="10dp"
                android:textAlignment="center"
                android:textColor="#000000"
                android:textSize="24sp"
                tools:text="커스텀 다이얼로그" />

            <TextView
                android:id="@+id/text_description"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="40dp"
                android:textAlignment="center"
                android:paddingHorizontal="10dp"
                android:textColor="#000000"
                android:textSize="16sp"
                tools:text="정말 쉬워요!" />

                <androidx.appcompat.widget.AppCompatButton
                    android:id="@+id/btn_positive"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:background="#000000"
                    android:textColor="@android:color/white"
                    android:textStyle="bold"
                    tools:text="확인" />

        </LinearLayout>

    </RelativeLayout>
</layout>

xml을 생성하셨다면 다음 단계로 넘어갑니다

 

---

Dialog.kt 생성

---

다이얼로그 코틀린 파일을 생성합니다. MainActivity가 아닙니다!

class CategoryDialog : DialogFragment() {
    private var _binding: CategoryDescriptionDialogBinding? = null
    private val binding get() = _binding!!

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        _binding = CategoryDescriptionDialogBinding.inflate(inflater, container, false)
        val view = binding.root
        binding.textTitle.text = "카테고리"
        binding.btnPositive.text = "확인"
        binding.textDescription.text = "넌센스 : 넌센스 문제가 출제 됩니다\n 학교 : 학교 관련 문제가 출제 됩니다\n 상식 : 상식문제가 출제 됩니다"

        binding.btnPositive.setOnClickListener {
            dismiss() 
        }

        return view
    }

    override fun onDestroyView() {
        super.onDestroyView()
        _binding = null
    }
}

저는 저의 프로젝트에 맞게 생성하였습니다. 여러분도 원하시는 이름으로 생성하시면 됩니다

binding으로 text를 넣어줍니다. binding으로 text를 설정해주지 않으면 기본적으로 텍스트가 보이지 않습니다!

dismiss()는 버튼을 눌렀을시 다이어로그를 사라지게 한다는 의미입니다

 

---

MainActivity에서 사용

---

이제 2단계를 모두 거쳤다면 마지막으로 MainActivity에서 사용하시면 됩니다

binding.categoryBtn.setOnClickListener {
            val dialog = CategoryDialog()
            dialog.show(supportFragmentManager, "다이얼로그")
}

저는 버튼을 눌렀을때 나오는걸로 코드를 짜봤습니다.

val dialog = CategoryDialog() 이거는 저가 클래스 이름을 CategoryDialog로 했기 때문에 CategoryDialog클래스의 객체를 생성해 dialog에 저장해줬습니다

 

눌러보시면 정상 작동하시는걸 확인하실수 있습니다