2014年8月14日木曜日

【アプリ開発】ProgressBarの色

今回プログレスバーの色の設定で少し戸惑ったため処理方法を書き留めておきます。


ProgressBarの色の設定方法

プログレスバーの色を変更して表示するための方法です。

 <!-- 読込中表示プログレスバー -->
 <ProgressBar
         android:id="@+id/loadingProgress"
         style="?android:attr/progressBarStyleHorizontal"
         android:progressDrawable="@drawable/ic_progress_green"
         android:layout_width="match_parent"
         android:layout_height="3dp"/>


<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
 <item android:id="@android:id/background">
     <shape>
  <corners android:radius="5dip" />
  <gradient
   android:startColor="#000000"
   android:centerColor="#000000"
   android:centerY="0.5"
   android:endColor="#000000"
   android:angle="270"
  />
  </shape>
 </item>
 <item android:id="@android:id/progress">
  <clip>
  <shape>
  <corners android:radius="5dip" />
  <gradient
   android:startColor="@color/holo_green_dark"
   android:centerColor="@color/holo_green_light"
   android:centerY="0.5"
   android:endColor="@color/holo_green_dark"
   android:angle="270"
  />
  </shape>
  </clip>
 </item>
</layer-list>




ProgressBarのアニメーション表示

プログレスバーを読み込み中のようにアニメーション表示するための方法です。


     <!-- 読込中表示プログレスバー -->
     <ProgressBar
         android:id="@+id/loadingProgress"
         android:layout_width="match_parent"
         android:layout_height="3dp"
         android:indeterminateDrawable="@drawable/ic_progress_indeterminate_green" />




<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false" >
    <item android:duration="200">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="1.0"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_light"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="50">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.8"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_light"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="50">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.6"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_light"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="50">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.4"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_light"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="50">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.2"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_light"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="70">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.0"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_normal"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>

    <item android:duration="100">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.2"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_normal"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="100">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.4"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_normal"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="100">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.6"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_normal"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="100">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="0.8"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_normal"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>
    <item android:duration="100">
        <shape android:shape="rectangle" >
            <gradient
                android:angle="180"
                android:centerY="1.0"
                android:endColor="@color/holo_green_dark"
                android:centerColor="@color/holo_green_normal"
                android:startColor="@color/holo_green_dark"
                android:type="linear" />
        </shape>
    </item>

</animation-list>

0 件のコメント:

コメントを投稿