[안드로이드] 프로그래스바(Progress Bar)

※ 저는 안드로이드 프로그래밍 정복(김상형 著, 한빛미디어) 책을 이용해 공부하고 있으며

예제와 코드는 이 책을 통해 공부중임을 밝힙니다.

개인적인 공부를 하면서 정리한 형식이기 때문에 심각한 오류가 있을 수 있습니다. 피드백 주시면 정말 감사하겠습니다.

※ 안드로이드 프로그래밍 정복(607p~619p) 참조

1. 프로그래스바(Progress Bar)

작업의 진행정도를 표시하거나 또는 작업이 진행 중이라는 걸 사용자에게 보여주느 ㄴ위젯

원모양 : 작업의 전체 분량을 미리 알 수 없을 때(디폴트)

막대 모양 : 작업 분량을 미리 아고 있을 때 사용

위 예제를 살펴보면 막대바는 두 가지 진행상태를 나타내고 있음을 알 수 있다.

짙은 색의 막대는 현재 진행상태를 나타내고

옅은 색의 막대는 버퍼링 상태를 나타낸다. ( 동영상 재생할 때를 떠올려보자).

범위는 max 속성, 초기값은 progress 속성으로 지정한다.

작업량이 총 200개이면 max = 200 이며, progress = 0 으로 설정한다.

void setProgress (int progress)

void setSecondaryProgress (int secondaryProgress)

void incrementProgressBy (int diff)

void incrementSecondaryBy (int diff)

코드에서 위치를 변경할 때 위 메서드를 사용한다.x

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
  <ProgressBar
      android:id="@+id/progress"
      style="?android:attr/progressBarStyleHorizontal" // 막대모양 지정시 스타일지정을 한다.
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:max="100"                              // 진행바의 max를 100으로 설정
      android:progress="10"                          // 첫번째 위치를 10으로 설정(짙은 빨강)
      android:secondaryProgress="50"                 // 두번째 위치를 50으로 설정(옅은 빨강)
      />
  <LinearLayout
      android:orientation="horizontal"
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
    <Button android:id="@+id/decfirst"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="mOnClick"
        android:text="Dec First" />
    <Button android:id="@+id/incfirst"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="mOnClick"
        android:text="Inc First" />
  </LinearLayout>
  <LinearLayout
      android:orientation="horizontal"
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
    <Button android:id="@+id/decsecond"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="mOnClick"
        android:text="Dec Second" />
    <Button android:id="@+id/incsecond"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="mOnClick"
        android:text="Inc Second" />
  </LinearLayout>
  <ProgressBar
      android:id="@+id/progcircle"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:visibility="invisible"
      />
  <LinearLayout
      android:orientation="horizontal"
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
    <Button android:id="@+id/start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="mOnClick"
        android:text="Start" />
    <Button android:id="@+id/stop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="mOnClick"
        android:text="Stop" />
  </LinearLayout>
</LinearLayout>

public class ProgressBarTest extends Activity {
   ProgressBar mProgBar;
   ProgressBar mProgCircle;
   public void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.progressbartest); 
      
      mProgBar = (ProgressBar)findViewById(R.id.progress);
      mProgCircle = (ProgressBar)findViewById(R.id.progcircle);
   }

   public void mOnClick(View v) {
      switch (v.getId()) {
      case R.id.decfirst:
         mProgBar.incrementProgressBy(-2);              // 짙은 막대를 -2씩 감소시킴
         break;
      case R.id.incfirst:
         mProgBar.incrementProgressBy(2);               // 옅은 막대를 +2씩 증가시킴
         break;
      case R.id.decsecond:
         mProgBar.incrementSecondaryProgressBy(-2);     // 짙은 막대를 +2씩 감소시킴
         break;
      case R.id.incsecond:
         mProgBar.incrementSecondaryProgressBy(2);      // 옅은 막대를 -2씩 감소시킴
         break;
      case R.id.start:
         mProgCircle.setVisibility(View.VISIBLE);       // 버튼 클릭시 원진행 바가 보이게 함
         break;
      case R.id.stop:
         mProgCircle.setVisibility(View.INVISIBLE);     // 버튼 클릭시 원진행 바가 안보이게 함
         break;
      }
   }
}

그런데 프로그래스바는 작업 중일 때만 보여주면 된다.

이 경우에는 윈도우에 기능을 요청해야 한다.

boolean Activity.requestWindowFeature (int featureId) 막대 모양 프로그래스

void Activity.setProgressBarIndeterminateVisibility (boolean visible) 원 모양 프로그래스

2. 시크바(SeekBar) 

프로그래스바는 현재 위치를 보여주기만 하는 반면에

시크바는 사용자가 값을 직접 조정할 수 있다.

우리가 흔히 핸드폰에서 볼 수 있는 화면 밝기 조정이 시크바가 아닐까?

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
  <SeekBar
      android:id="@+id/seekbar"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:max="100"
      android:progress="50"                        // 범위의 최대값
      android:padding="10dip"
      />
  <TextView
      android:id="@+id/volume"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:text="Now Volume : 50"
      />
</LinearLayout>

3. 레이팅 바(Rating Bar)

별점 표시 위젯이다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:orientation="vertical"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   >
<RatingBar 
   android:id="@+id/ratingbar"
   android:layout_width="wrap_content"               // 별 개수에 따라 위젯 폭이 결정되므로
      반드시 "Wrap_content" 로 설정한다.
   android:layout_height="wrap_content"
   android:stepSize="0.2"                            // 0.2 단위로 점수를 매긴다.
   android:rating="3" 
   />
<TextView  
   android:id="@+id/ratetext"
   android:layout_width="match_parent" 
   android:layout_height="wrap_content" 
   android:text="Now Rate : 3"
   />
<RatingBar 
   android:id="@+id/ratingbar"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:rating="2" 
   android:isIndicator="true"                        // true이면 별점을 보여만 줄 뿐 변경불가
   />
<RatingBar 
   style="?android:attr/ratingBarStyleIndicator"     // 별점을 표시만 할 뿐 변경할 수 없음
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:numStars="4"                              // 별의 개수를 4개로 설정
   android:rating="2.5" 
   />
<RatingBar 
   style="?android:attr/ratingBarStyleSmall"         // 별이 작게 표시되며 변경할 수 없음
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:numStars="10"                             // 별의 개수를 10개로 설정
   android:rating="7"                                // 평점을 7로 지정
   />
</LinearLayout>