[Kotlin] 안드로이드 Custom Dialog

 

Dialog Layout 생성

res/layout 에서 우클릭

파일이름은 

custom_common_dialog.xml
참고: 파일명을 이렇게 만들면 바인딩은 CustomCommonDialogBinding 이 됩니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="20dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/dialog_common_title_textView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20sp"
            android:layout_weight="1"
            android:text="Dialog Title" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/dialog_common_content_textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="15sp"
            android:layout_margin="15dp"
            android:layout_weight="1"
            android:text="dialog contents" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">

        <Button
            android:id="@+id/dialog_common_cancel_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_margin="@dimen/stock_item_margin"
            android:text="@string/cancel" />

        <Button
            android:id="@+id/dialog_common_save_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_margin="@dimen/stock_item_margin"
            android:text="@string/ok" />
    </LinearLayout>
</LinearLayout>

이런 모양이 생깁니다.

 

 

Dialog Class

Dialog 를 상속받은 class 를 생성합니다.

CommonDialog.kt

import android.app.Dialog
import android.content.Context
import android.os.Bundle
import com.example.solbarapp.databinding.CustomCommonDialogBinding

class CommonDialog(context: Context,
                   val title: String,
                   val contents: String,
                   val okCallback: () -> Unit,
                   val cancelCallback: () -> Unit) : Dialog(context) {

    lateinit var binding: CustomCommonDialogBinding
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = CustomCommonDialogBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.dialogCommonTitleTextView.text = title
        binding.dialogCommonContentTextView.text = contents
        binding.dialogCommonSaveButton.setOnClickListener {
            okCallback()
            this.dismiss()
        }
        binding.dialogCommonCancelButton.setOnClickListener {
            cancelCallback?.let{
                cancelCallback()
            }
            this.dismiss()
        }
    }
}

파라메터는 

• context = activity 또는 fragment 의 context 를 넘깁니다.
• title = 다이알로그의 타이틀 텍스트
• content = 다이알로그의 본문 내용
• okCallback = 확인버튼 눌렀을 때의 callback event
• cancelCallback = 취소버튼 눌렀을 때의 callback event

this.dismiss() 는 dialog 를 닫습니다.

그리고 

Dialog 를 상속받았기 때문에 .show() 로 dialog 를 open합니다.

.show() 를 하기 전까지는 onCreate 가 실행되지 않습니다.

 

사용하기

Activity 안에서 다음과 같이 사용하면 됩니다.

CommonDialog(this, 
             "Delete Items", 
             "선택한 항목을 삭제하시겠습니까?",
             { deleteSelected() }, 
             { Log.d("TEST", "Cancel Clicked!") }).show()

확인 버튼을 누르면 deleteSeleted() 라는 함수가 실행됩니다.

 

 

layout 의 cutom....dialog.xml 내용을 수정하고 디자인하면 

여러가지 다이알로그를 만들 수 있습니다.

 

끄

ㅅ