[안드로이드] 수직 progressbar 만들기

일반적으로는 progressbar를 만들 때 원형 또는 가로로 사용하는데요.

 

아~~~주 가끔씩 세로로 보여줘야 할 때도 생기는것 같습니다.

 

안드로이드에서 제공하는 progressbar가 기본적으로는 가로만 지원하네요.

 

찾아보니까 거의 대부분의 글들이 커스텀 해서 사용하는것 같아서 조금 더 쉽게 적용할 수 있는 방법은 없을까 하다가

 

쉽게 적용할 수  있는 방법이 있는것 같아서 글을 남겨봅니다.

 

세로로 progressbar를 놓고 버튼을 눌렀을 때 0.1초에 한 번씩 1씩 증가하도록 만들었습니다.

<activity_main.xml>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">
 
    <ProgressBar
        android:id="@+id/progressbar"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        style="@android:style/Widget.ProgressBar.Horizontal"
        android:progress="0"
        android:max="100"/>
 
    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="test"
        android:textSize="30sp"
        android:textColor="#000"/>
 
    <Button
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="start!"/>
 
</LinearLayout>

progressbar 속성중에 빨간색으로 나타낸 rotation 속성에 값을 270으로 넣어줍니다. 이건 돌려줄 각도를 나타냅니다.

marginTop을 넣지않으면 progressbar 상단이 잘려나오게 되어서 marginTop을 넣어주었습니다.

<MainActivity.java>

package com.example.verticalprogressbarpractice;
 
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.widget.Button;
import android.widget.ProgressBar;
import android.widget.TextView;
 
public class MainActivity extends AppCompatActivity {
    ProgressBar pgb;
    TextView tv;
    Button btn;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        btn = findViewById(R.id.btn);
        tv = findViewById(R.id.tv);
        pgb = findViewById(R.id.progressbar);
 
        pgb.setProgress(0);
        pgb.setMax(100);
 
        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                progress();
            }
        });
 
    }
 
    public void progress() {
        new Thread(new Runnable() {
            @Override
            public void run() {
                for (int i = 0; i <= 100; i++) {
                    try {
                        Thread.sleep(100);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
 
                    final int percent = i;
                    tv.post(new Runnable() {
                        @Override
                        public void run() {
                            pgb.setProgress(percent);
                            tv.setText(percent+"%");
                            if (percent == 100) {
                                tv.setText("완료!!");
                            }
                        }
                    });
 
                }
            }
        }).start();
    }
}
 

 

간단한 예제입니다. 이렇게 입력하시고 안드로이드 에뮬레이터를 실행하시면 아래 영상처럼 동작됨을 보실 수 있습니다.

 

간단한거지만 도움이 되었으면 좋겠습니다.

 

<결과 화면>