본문 바로가기
Android

[Android] Custom Dialog 만들기

by 유혁. 2017. 8. 4.

결과

 

 

 

지난번에는 AlertDialog 에 대해 포스팅 하였습니다.

 

이번에는 확장성이 가능한 CustomDialog에 대해 알아가는 시간입니다.

 

 

CustomDialog를 사용하는 이유로는 이전의

 

AlertDialog보다 확장성이 높기 때문에 커스터마이징 하여 사용합니다.

 

 

편리성   :   AlertDialog > CustomDialog

 

확장성   :   AlertDialog < CustomDialog

 

 

MainActivity.class 에서 Dialog를 생성하겠습니다.

 

 

 

 

MainActivity.class

 

package com.yoohyeok.dialog;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

private CustomDialog dialog;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button dialog = (Button) findViewById(R.id.btn);
dialog.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Dialog();
}
});
}

public void Dialog(){
dialog = new CustomDialog(MainActivity.this,
"주의", // 제목
"유혁의 Custom Dialog 만들기에 오신것을 환영합니다.", // 내용
leftListener); // 왼쪽 버튼 이벤트
// 오른쪽 버튼 이벤트

//요청 이 다이어로그를 종료할 수 있게 지정함
dialog.setCancelable(true);
dialog.getWindow().setGravity(Gravity.CENTER);
dialog.show();
}
//다이얼로그 클릭이벤트
private View.OnClickListener leftListener = new View.OnClickListener() {
public void onClick(View v) {
Toast.makeText(MainActivity.this, "버튼을 클릭하였습니다.", Toast.LENGTH_SHORT).show();
dialog.dismiss();
}
};
}

CustomDialog 부분이 정의되어 있지 않으므로 밑줄이 생깁니다.

 

Dialog() 메소드 보시면

 

제목과 내용을 넣어줄 수 있으며 클릭 이벤트 까지 정의합니다.

 

dialog.setCancelable(false); 로 설정한다면

 

onBackPressed() 뒤로가기 버튼이 동작하지 않습니다.

 

true면 뒤로가기하면 다이얼로그가 종료됩니다.

 

dialog.dismiss는 다이얼로그 종료 입니다.

 

 

 

CustomDialog.class

 

package com.yoohyeok.dialog;


import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.TextView;

/**
* Created by yoohyeok on 2016-12-09.
*/

public class CustomDialog extends Dialog {

private TextView mTitleView;
private TextView mContentView;
private Button mLeftButton;
private Button mRightButton;
private String mTitle;
private String mContent;

private View.OnClickListener mLeftClickListener;
private View.OnClickListener mRightClickListener;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

// 다이얼로그 외부 화면 흐리게 표현
WindowManager.LayoutParams lpWindow = new WindowManager.LayoutParams();
lpWindow.flags = WindowManager.LayoutParams.FLAG_DIM_BEHIND;
lpWindow.dimAmount = 0.8f;
getWindow().setAttributes(lpWindow);

setContentView(R.layout.custom_dialog);


mTitleView = (TextView) findViewById(R.id.dialog_title);
mContentView = (TextView) findViewById(R.id.dialog_text);
mLeftButton = (Button) findViewById(R.id.dialog_btn);
//mRightButton = (Button) findViewById(R.id.dialog_btn2);

// 제목과 내용을 생성자에서 셋팅한다.
mTitleView.setText(mTitle);
mContentView.setText(mContent);

// 클릭 이벤트 셋팅

if (mLeftClickListener != null && mRightClickListener != null) {
mLeftButton.setOnClickListener(mLeftClickListener);
mRightButton.setOnClickListener(mRightClickListener);
} else if (mLeftClickListener != null
&& mRightClickListener == null) {
mLeftButton.setOnClickListener(mLeftClickListener);
} else {

}
}

// 클릭버튼이 하나일때 생성자 함수로 클릭이벤트를 받는다.
public CustomDialog(Context context, String title, String content,
View.OnClickListener singleListener) {
super(context, android.R.style.Theme_Translucent_NoTitleBar);
this.mTitle = title;
this.mContent=content;
this.mLeftClickListener = singleListener;
}


// 클릭버튼이 확인과 취소 두개일때 생성자 함수로 이벤트를 받는다
/*
public CustomDialog(Context context, String title,
String content, View.OnClickListener leftListener,
View.OnClickListener rightListener) {
super(context, android.R.style.Theme_Translucent_NoTitleBar);
this.mTitle = title;
this.mContent = content;
this.mLeftClickListener = leftListener;
this.mRightClickListener = rightListener;
}
*/
}

 

다 연결되어 있는 소스이며

 

lpWindow.dimAmount = 0.8f;

 

뒷 배경 어두운 정도를 나타내는 수치입니다.

 

 

mRightClickListener 는 버튼이 한개이므로

 

사용하지 않았습니다.

 

버튼을 2개 사용하고싶으면 아래 주석부분이 생성자가 되어야하고

 

메인에서 mRightClickListener를 정의해 주어야합니다.

 

CustomDialog.xml 에서 버튼도 추가는 당연히 아시겠죠?

 

 

 

 

custom_dialog.xml 입니다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="250dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:gravity="center"
android:weightSum="10"
android:background="@drawable/dialog"
android:orientation="vertical">

<TextView
android:id="@+id/dialog_title"
android:layout_weight="4"
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center"
android:textSize="50dp"
android:textColor="#FF0000"
android:textStyle="bold"
android:text="Warnning" />

<TextView
android:layout_weight="4"
android:id="@+id/dialog_text"
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center"
android:textSize="20dp"
android:textColor="#FFFFFF"
android:text="유혁의 Custom Dialog 만들기에 오신것을 환영합니다." />

<Button
android:layout_weight="2"
android:id="@+id/dialog_btn"
android:layout_width="match_parent"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:layout_height="0dp"
android:text="확인" />


</LinearLayout>

 

Warnning! 주의

 

저는 주의 메세지입니다. 음 단어를 바꿔야하나

 

조금 거시기하네요 ..

 

background="@drawable/dialog" 부분이 에러가 나오는게 정상입니다.

 

 

 

 

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">

<Button
android:id="@+id/btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="다이어 로그"
/>

</LinearLayout>

 

 

 

 

한가지 더 추가하자면 CustomDialog의 테두리 보시면 노랑색 라인이 그려져 있습니다.

 

노랑색 라인부분을 추가하고 싶다면

 

경로 res/drawable/dialog.xml 추가 후

 

아래 소스를 복붙합니다.

 

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<stroke android:width="3dp" android:color="#FFE400" />
<solid android:color="#000000" />
</shape>
</item>
</layer-list>

 

 

background="@drawable/dialog" 부분의 에러가 없어집니다.

 

이제 빌드하시면 결과화면과 같이 나오게 될거에요!