안드로이드 Custom Progress Dialog 만들기 예제

안드로이드 Custom Progress Dialog를 만들어 보겠습니다.

여타 Custom View 생성과 당연히 유사합니다.

 

ProgressDialog를 상속 받아서 작성을 해도 되겠지만 전 그냥 Dialog를 상속 받아봅니다. 이유는 그냥...

 

[src/CustomProgressDialog.java]

package com.tistory.noota;

import android.app.Dialog;
import android.content.Context;
import android.view.Window;

public class CustomProgressDialog extends Dialog{
	public CustomProgressDialog(Context context) {
		super(context);
		requestWindowFeature(Window.FEATURE_NO_TITLE); // 지저분한(?) 다이얼 로그 제목을 날림
		setContentView(R.layout.custom_dialog); // 다이얼로그에 박을 레이아웃
	}
}

이제 다이얼로그에 박을... 넣을 레이아웃을 구성해 봅시다.

 

[res/layout/custom_dialog.xml]

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="6dp"
    android:background="@drawable/progress_bg" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:text="In progress..."
        android:textSize="20sp" />

    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView1"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:indeterminateDrawable="@drawable/progress_image" />

</RelativeLayout>

전체 레이아웃을 RelativeLayout으로 만들고 안에 진행중이라는 메시지를 넣을 TextView와 진행중임을 표시할 ProgressBar를 넣었습니다.

RelativeLayout의 배경은 테두리가 둥글고 외곽선이 있는 배경을 주기 위해 별도의 progress_bg drawable을 주었고 ProgressBar의 경우 기존의 애니메이션 대신 다른 이미지가 뱅글뱅글 돌도록 하기위해 progress_image drawable을 주었습니다.

각각의 내용은 아래와 같습니다.

 

[res/drawable/progress_bg.xml]

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#ccffffff"/>
    <corners android:radius="12dp"/>
    <stroke android:color="#1da9da" android:width="1dp"/>
</shape>

shape를 이용하여 반투명 흰색 모서리 둥글고 테두리 파란선 도형(?)을 만들었습니다. ㅎㄷㄷ

 

[res/drawable/progress_image.xml]

<?xml version="1.0" encoding="utf-8"?>
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/icon"
    android:pivotX="50%"
    android:pivotY="50%">
</animated-rotate>

animated-rotate를 이용하여 뱅글뱅글 도는 이미지를 만들었습니다.

돌리고 싶은 이미지를 프로젝트에 추가하고 위의 @drawable/icon을 교체하시면 됩니다.

 

이제 CustomProgressDialog 커스텀뷰가 완성되었습니다.

코드에서 사용은 아래와 같은 방법으로 사용합니다.

 

[사용방법]

private CustomProgressDialog customProgressDialog;
customProgressDialog = new CustomProgressDialog(클래스명.this);

// 위에서 테두리를 둥글게 했지만 다이얼로그 자체가 네모라 사각형 여백이 보입니다. 아래 코드로 다이얼로그 배경을 투명처리합니다.
customProgressDialog .getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));

mProgressDialog.show(); // 보여주기
mProgressDialog.dismiss(); // 없애기

이제 원하는 이미지가 뱅글뱅글 돌게 됩니다. ^^;;