[Android] Custom Progress Dialog 만들기 예제

운영체제 : Windows 8.1 64bit Android Studio : 1.5 작성날짜 : 2016-04-27

출처 : 누더기 - 안드로이드 Custom Progress Dialog 만들기 예제

[src/CustomProgressDialog.java]

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); // 다이얼 로그 제목을 없앰
  getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);     // dialog 자체 배경 투명
  getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));    // dialog 배경 투명
  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(); // 없애기

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