안드로이드 이미지가 변화하는 프로그레스바(ProgressBar) 커스텀

이미지가 변화하며 로딩을 알리는 프로그레스바를 제작 해보려고 합니다.

 

우선

 

res - values - strings에 아래 한줄 추가해주세요.

나중에 이 수치를 올리시면 느려지고 줄일수록 빨라집니다. (프로그레스바의 속도)

<string name="progressbar_speed">400</string>

 

그리고

 

CustomProgress 클래스를 하나 만들겠습니다.

 

import android.app.Dialog;
import android.content.Context;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.ColorDrawable;
import android.view.Window;
import android.widget.ImageView;

public class CustomProgress extends Dialog {

    Context mContext;
    ImageView imageView;
    AnimationDrawable animationDrawable;

    public CustomProgress(Context activity) {
        super(activity);
        mContext = activity;
        InitProgress();
    }

    public void InitProgress(){
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
        setContentView(R.layout.custom_image);
        imageView = findViewById(R.id.progresss);
        imageView.setBackgroundResource(R.drawable.progressbar_image);
        animationDrawable = (AnimationDrawable)imageView.getBackground();
        animationDrawable.start();
    }
}

 

그다음에 custom_image.xml을 만들겠습니다.

레이아웃 입니당.

 

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/progresss"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

그후에 drawable 폴더 안에

 

progressbar_image.xml를 생성할게여.

 

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:drawable="@drawable/ic_launcher_background"
        android:duration="@string/progressbar_speed" />
    <item
        android:drawable="@drawable/abc_vector_test"
        android:duration="@string/progressbar_speed" />
    <item
        android:drawable="@drawable/ic_launcher_foreground"
        android:duration="@string/progressbar_speed" />

</animation-list>

저는 기본 주어지는 이미지로 테스트를 진행했습니다.

 

그리고 메인소스를 볼게요.

 

import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

    CustomProgress customProgress;
    Button start;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        start = findViewById(R.id.start);
        customProgress = new CustomProgress(MainActivity.this);

        start.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                // CustomProgress Start
                customProgress.show();

                //서브화면으로 이동
//                Intent intent = new Intent(getApplicationContext(),SubActivity.class);
//                startActivity(intent);

                start.postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        //CustomProgress Close
                        customProgress.dismiss();
                    }
                }, 5000);
            }
        });
    }

    @Override
    protected void onResume() {
        super.onResume();
        /**
         * CustomProgress Close
         * 다시 화면에 들어오면 프로그레스바를 종료.
        **/
        customProgress.dismiss();
    }
}

5초동안 프로그레스바를 보여줍니다.

 

여기서 엑티비티 전환하는 과정에서 보고싶으시면

 

위에 인텐트 주석을 풀어서 SubActivity 화면을 하나 생성하셔서 테스트 해보시면 될것같습니다.

 

화면이 넘어가면 프로그레스바는 자동으로 없어지지만, 다시 메인으로 돌아오면 프로그레스바가 돌고있기 때문에

 

onResume 생명주기에서 프로그레스바 종료를 했습니다.