34. [안드로이드/java] 커스텀 다이얼로그(Custom Dialog) 예제

Custom Dialog란?

AlretDialog의 화면을 직접 디자인한 화면을 뜻합니다.

---

Custom Dialog 만드는 과정

화면(xml) 만들기 > 코드(MainActivity) 연결 > 앱 빌드 후 확인

---

Custom Dialog 만들기

이것을 만들어 보겠습니다.

 

1. Dialog를 표시할 버튼 만들기

res/layout/activity_main.xml에 아래 코드를 입력합니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center">

    <Button
        android:id="@+id/showBtn"
        android:text="show!"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:backgroundTint="#F699CD"/>

</LinearLayout>

 

버튼 화면

 

 

res > layout > 파일 선택 > 오른쪽 클릭 > New > Layout Resource File 클릭합니다.

 

File name을 작성하고 OK를 클릭합니다.

 

diglog.xml에 아래 코드를 입력합니다.

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:text="앱을 종료하시겠습니까?" />

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

        <Button
            android:id="@+id/noBtn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:backgroundTint="#F699CD"
            android:text="아니오" />

        <Button
            android:id="@+id/yesBtn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:backgroundTint="#F699CD"
            android:text="네" />
    </LinearLayout>

</LinearLayout>

 

MainActivity.java에 아래 코드를 입력합니다.

package com.drizzle.dialog;

import androidx.appcompat.app.AppCompatActivity;

import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
    Dialog dialog; // 커스텀 다이얼로그

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        dialog = new Dialog(MainActivity.this);       // Dialog 초기화
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE); // 타이틀 제거
        dialog.setContentView(R.layout.dialog);             // xml 레이아웃 파일과 연결

        // 버튼: 커스텀 다이얼로그 띄우기
        findViewById(R.id.showBtn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                showDialog(); // 아래 showDialog() 함수 호출
            }
        });
    }
    
    // dialog01을 디자인하는 함수
    public void showDialog(){
        dialog.show(); // 다이얼로그 띄우기

        /* 이 함수 안에 원하는 디자인과 기능을 구현하면 된다. */

        // 위젯 연결 방식은 각자 취향대로~
        // '아래 아니오 버튼'처럼 일반적인 방법대로 연결하면 재사용에 용이하고,
        // '아래 네 버튼'처럼 바로 연결하면 일회성으로 사용하기 편함.
        // *주의할 점: findViewById()를 쓸 때는 -> 앞에 반드시 다이얼로그 이름을 붙여야 한다.

        // 아니오 버튼
        Button noBtn = dialog.findViewById(R.id.noBtn);
        noBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 원하는 기능 구현
                dialog.dismiss(); // 다이얼로그 닫기
            }
        });
        // 네 버튼
        dialog.findViewById(R.id.yesBtn).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 원하는 기능 구현
                finish(); // 앱 종료
            }
        });
    }

}

---

결과물