[안드로이드] 프로그래스바(ProgressBar) 사용하기

안녕하세요 ! 초보개발자 입니다. 

이 블로그는 개인 공부 정리용 블로그 입니다. 

혹 잘못된 내용이 있다면 지적 부탁드리겠습니다.

그리고 질문주신다면 최대한 아는선에서 답변드리도록 하겠습니다.

그럼 시작하도록 하겠습니다.

---

프로그래스바(ProgressBar)

프로그래스바는 작업의 진행정도를 표시하거나 작업이 진행중임을 알려주는 역활을 합니다. 안드로이드에서는 막대와 원 형태의 프로그래스바가 있습니다.

프로그래스바의 기본은 원모양이며 프로그래스바의 스타일을 style="?android:attr/progressBarStyleHorizontal"로 해줄 경우 막대 모양으로 바뀌게 됩니다.

예제를 통하여 막대 모양의 프로그래스 바를 구현해보도록 하겠습니다.

XML은 다음과 같습니다.

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

    >
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ProgressBar 예제"
        />
<LinearLayout
    android:layout_marginTop="20dp"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
 
 
    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleHorizontal"
        android:max="100"
        android:minWidth="400dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />
</LinearLayout>
    <LinearLayout
        android:layout_marginTop="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
 
        <TextView
            android:padding="10dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="진행율 :"
            />
        <TextView
            android:id="@+id/percent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
 
    </LinearLayout>
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
 
        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="프로그래스바 실행"
            android:layout_weight="1"
            />
 
    </LinearLayout>
 
</LinearLayout>
 

<ProgressBar> 태그를 보시면 android:max=100 라는 속성이 있습니다. 이는 값의 최대 범위가 100이라는 뜻입니다. 만약 진행 정도가 50%라면 progress의 값을 50으로 바꿔주면 될 것입니다. 

위의 그림은 XML 의 실행 결과 입니다. 프로그래스바 실행이란 버튼을 클릭시 프로그래스 바가 움직이면서 진행율이 표시가 됩니다. 프로그래스 바의 동작을 확인하기 위해 소스코드를 알아 보겠습니다. 소스코드는 다음과 같습니다.

package com.example.donghyun.progressbar;
 
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Handler;
import android.os.Message;
 
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ProgressBar;
import android.widget.TextView;
 
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    ProgressBar progressBar;
    TextView percent;
    Button startProgressBar;
    int i;
    Handler handler;
    AlertDialog.Builder dialog ;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        progressBar = (ProgressBar)findViewById(R.id.progressBar);
        percent = (TextView)findViewById(R.id.percent);
 
        startProgressBar = (Button)findViewById(R.id.button1);
        startProgressBar.setOnClickListener(this);
 
        dialog=  new AlertDialog.Builder(this);
 
        handler = new Handler(){
            @Override
            public void handleMessage(Message msg) {
                percent.setText(msg.arg1+"%");
                if(msg.arg1==100){
                    dialog.setCancelable(false);
                    dialog.setMessage("완료되었습니다.");
                    dialog.setPositiveButton("확인", new DialogInterface.OnClickListener() {
                        @Override
                        public void onClick(DialogInterface dialogInterface, int i) {
                            progressBar.setProgress(0);
                            percent.setText("0%");
                            dialogInterface.dismiss();
                        }
                    });
                    dialog.show();
                }
            }
        };
 
    }
 
    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.button1:
            Thread t = new Thread(new Runnable() {
                @Override
                public void run() {
                    for (i = 0; i <= 100; i++) {
                        progressBar.setProgress(i);
                        Message msg = handler.obtainMessage();
                        msg.arg1 = i;
                        handler.sendMessage(msg);
                        try {
                            Thread.sleep(100);
                        } catch (InterruptedException e) {
                            e.printStackTrace();
                        }
                    }
                }
            });
            t.start();
            break;
 
 
 
        }
    }
}
 

버튼을 클릭시에 스레드가 실행이 됩니다. 스레드에 대해서는 나중에 알아보기로 하고 일단은 스레드가 실행된다는 것만 알고 계시면 될 거 같습니다. for문 한번 돌아갈때마다  progressBar.setProgress(i) 으로 프로그래스바가 점점 증가하는 것을 볼 수 있을 것입니다. for문의 i의 값을 핸들러로 전달해주어 진행율을 표시하는데 핸들러도 나중에 자세히 알아보겠습니다. 진행율이 100%가 되면 완료되었다는 알림창이 나오도록 코딩을 하였습니다. 

실행결과는 다음과 같습니다.

위의 코드를 조금 변형하면 원 형태의 프로그래스 바를 확인 할 수 있습니다.

원 형태의 프로그래스 바 실행 결과 입니다.

원 형태의 프로그래스바는 직접 소스를 고쳐서 확인 하여 보세요 

소스코드가 필요하시다면 댓글달아 주시면 드리겠습니다. 

이상으로 프로그래스바에 대해서 알아 보았습니다.