10

I want to use this type of Progress bar in android. I have tried with many horizontal progress bars. They are all looking like default progress bars with different colors. Dont know how to use this type: enter image description here

Seshu Vinay
  • 13,560
  • 9
  • 60
  • 109

2 Answers2

11

You will need to create your own custom progress bar. It's not as simple as using many horizontal bars.

Bhargav Rao
  • 50,140
  • 28
  • 121
  • 140
Kumar Bibek
  • 9,016
  • 2
  • 39
  • 68
5

Customizing a progress bar requires defining the attribute or properties for background and and progress of your progress bar.

create a.xml file named customprogressbar.xml in your res-> drawable folder

customprogressbar.xml

   <layer-list xmlns:android="http://schemas.android.com/apk/res/android">

        <!-- Define the background properties like color etc -->
    <item android:id="@android:id/background">
    <shape>
        <gradient
                android:startColor="#000001"
                android:centerColor="#0b131e"
                android:centerY="1.0"
                android:endColor="#0d1522"
                android:angle="270"
        />
    </shape>
   </item>

  <!-- Define the progress properties like start color, end color etc -->
  <item android:id="@android:id/progress">
    <clip>
        <shape>
            <gradient
                android:startColor="#007A00"
                android:centerColor="#007A00"
                android:centerY="1.0"
                android:endColor="#06101d"
                android:angle="270"
            />
        </shape>
    </clip>
</item>

Now you need to set the to set the progressDrawable property to customprogressbar.xml(drawable)

you can do it in xml file or in Activity(at run time)

In your xml do like following

   <ProgressBar
    android:id="@+id/progressBar1"
    style="?android:attr/progressBarStyleHorizontal"
    android:progressDrawable="@drawable/custom_progressbar"         
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

at runtime do the following

      // Get the Drawable custom_progressbar                     
                              Drawable draw= res.getDrawable(R.drawable.custom_progressbar);
                              // set the drawable as progress drawavle

                              progressBar.setProgressDrawable(draw);
Martijn Pieters
  • 1,048,767
  • 296
  • 4,058
  • 3,343