안드로이드 스튜디오~

Dialog (팝업창 만들기)

임종뚱 2019. 12. 29. 12:20

Dialog는 기본 액티비티에 전체적인 화면 안에다가 부가적으로 화면을 띄우고 싶을 때  많이 활용하는 것이다.

 

우선 간단하게 레이아웃을 설정해 보자!

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/btn_dialog"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="다이얼로그" />


    <TextView
        android:text="테스트"
        android:id="@+id/tv_content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"/>

</LinearLayout>

 

이런식으로 정말 간단하게 부모 LinearLayout 안에 버튼과 TextView를 만들어 줍니다.

 

 

이제 MainActivity.java에서 설정해 줍니다.

 

 

버튼과 TextView에 대해 각각의 id값을 넣어주고

 

버튼 클릭시 Dialog 팝업창이 뜨게 할 것이다.

여기서 AlertDialog를 사용할 것인데 AlertDialog는 사용자의 전체 화면을 가리지 않으면서 사용자의 응답이나 추가 정보를 입력하도록 하는 작은 창을 의미합니다.

 

 

AlertDialog에 여러정보를 Setting을 하려면 먼저 AlertDialog.Buider 객체를 생성합니다. Builder 클래스에서 제공하는 다양한 함수들을 사용하여 AlertDialog에 여러 정보를 Setting 하는데 위 예제에서는 setIcon()함수로 원하고자 하는 아이콘을 설정하고  setTitle() 함수를 사용하여 다이얼로그 창의 제목을 설정하고 setMessage() 함수를 통해 다이얼로그 창을 통해 사용자에게 보여주고 싶은 Message를 지정하고 팝업창에서 EditText를 통해 질문에 대한 응답을 할 수 있도록 setView() 함수로 포함시킵니다.  

 

 

그 다음 setPositiveButton() 함수로 확인 버튼을 만들어 주고 인자 정보는 첫 번째 인자로 Button의 Text 속성으로 지정할 문자열 값 또는 문자열 리소스 ID 값을 넘겨줍니다.

두 번째 인자는 해당 버튼을 클릭하였을 때 이벤트 처리를 위한 DialogInterface.OnClickListener 구현체를 넘겨줍니다. 위 예제에서는 익명 클래스 생성 방식으로 구현하였으며 onClick() 함수를 오버 라이딩하여 그 안에 해당 버튼을 클릭하였을 때 처리할 동작을 정의하면 됩니다.

 

이제 확인 버튼 클릭시 발생하는 이벤트를 설정해 줍니다. String result 값에 EditText의 문자열들을 getText()로 문자열 형태로 받아오고 TextView에 setText(result)로 그 값을 설정해 줍니다. 이렇게 이벤트가 발생하고 나서 팝업창을 닫을 수 있게 dialog.dismiss(); 를 적어주면 팝업창은 닫게 됩니다.

 

마찬가지로 setNegativeButton() 함수로 취소 버튼을 만들어 주고 new DialogInterface.OnClickListener 을 통해

취소 버튼 클릭시 발생하는 이벤트를 설정해 줍니다. 취소 버튼 클릭시 다른 이벤트가 필요 없이 팝업창을 닫게 할 것이므로 dialog.dismiss(); 를 통해 간단하게 만들 수가 있습니다.

 

그리고 마지막으로 AlertDialog 객체에 show() 함수를 통해 다이얼로그 창을 화면에 보여주게 됩니다.

ad.show();

 

실행 화면

 

 

확인 버튼 클릭시

 

이렇게 잘 작동합니다!!