[안드로이드] 상태 진행 표시줄 쉽게 만드는 방법

이번 시간에는 현재 상태 진행상황을

알 수 있게 표시하는 방법을 알아보겠습니다.

---

목차

1. 실행 화면

2. 라이브러리 등록

3. 메인 화면 구성 activity_main.xml

4. 메인 코드 구현 MainActivity.java

---

1. 실행 화면

 

2. 라이브러리 등록

build.gradle(Module:프로젝트명:app)

dependencies 괄호 안에 아래 코드를 넣어주시면 됩니다.

implementation 'com.kofigyan.stateprogressbar:stateprogressbar:1.0.0'

참조 문서

https://github.com/kofigyan/StateProgressBar

GitHub - kofigyan/StateProgressBar: Android library to realize the various states and transitions in a ProgressBar.

 

3. 메인 화면 구성 activity_main.xml

 3-1 속성

  spb_animateToCurrentProgressState

  - 현재 상태 애니메이션 효과 유무

  spb_checkStateCompleted

  - 상태 완료 후 체크 유무

  spb_currentStateNumber

  - 현재 상태 위치 값 ( one, two, three, four, five)

  spb_maxStateNumber

  - 상태 최고값

  spb_currentStateDescriptionColor

  - 현재 상태 설명 색깔

  spb_stateDescriptionColor

  - 상태 설명 색깔

  spb_stateBackgroundColor

  - 상태 바탕 색깔

  spb_stateForegroundColor

  - 상태 색깔

  spb_stateNumberBackgroundColor

  - 상태 숫자 바탕색깔

  spb_stateNumberForegroundColor

  - 상태 숫자 색깔

  spb_stateSize

  - 상태 크기

  spb_stateTextSize

  - 상태 텍스트 크기

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical">

    <com.kofigyan.stateprogressbar.StateProgressBar
        android:id="@+id/your_state_progress_bar_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        app:spb_animateToCurrentProgressState="true"
        app:spb_checkStateCompleted="true"
        app:spb_currentStateNumber="one"
        app:spb_maxStateNumber="five"
        app:spb_currentStateDescriptionColor="#D50000"
        app:spb_stateDescriptionColor="#212121"
        app:spb_stateBackgroundColor="#B39DDB"
        app:spb_stateForegroundColor="#9FA8DA"
        app:spb_stateNumberBackgroundColor="#FFCC80"
        app:spb_stateNumberForegroundColor="#FFF59D"
        app:spb_stateSize="30sp"
        app:spb_stateTextSize="30sp" />

    <Button
        android:id="@+id/nextBtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="50dp"
        android:text="Next" />

</LinearLayout>

4. 메인 코드 구현 MainActivity.java

public class MainActivity extends AppCompatActivity {

    String[] descriptionData = {"One\n1", "Two\n2", "Three\n3", "Four\n4", "Five\n5"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        StateProgressBar stateProgressBar = (StateProgressBar) findViewById(R.id.your_state_progress_bar_id);
        stateProgressBar.setStateDescriptionData(descriptionData);


        Button nextBtn = findViewById(R.id.nextBtn);
        nextBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                switch(stateProgressBar.getCurrentStateNumber()){

                    case 1:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.TWO);
                        break;
                    case 2:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.THREE);
                        break;
                    case 3:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.FOUR);
                        break;
                    case 4:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.FIVE);
                        break;
                    case 5:
                        stateProgressBar.setAllStatesCompleted(true);
                }
            }
        });

    }//onCreate

} //MainActivity