76

I would like to know how I can change indeterminate ProgressBar color from basis white/grey color to black ? When I change the indeterminateDrawable, I get a static image instead of a moving animated progressBar. Is there any way to do it simply in XML?

Vadim Kotov
  • 7,103
  • 8
  • 44
  • 57
mwa
  • 769
  • 1
  • 6
  • 3

9 Answers9

83
progressBar.getIndeterminateDrawable().setColorFilter(
            getResources().getColor(Your_Color),
            android.graphics.PorterDuff.Mode.SRC_IN);

and replace Your_Color with the desired color like: R.color.your_color_code

Zeyad Assem
  • 1,185
  • 8
  • 6
64

To get a ProgressBar in the default theme that is to be used on white/light back ground, use one of the inverse styles:

<ProgressBar style="@android:style/Widget.ProgressBar.Inverse"/>
<ProgressBar style="@android:style/Widget.ProgressBar.Large.Inverse"/>
<ProgressBar style="@android:style/Widget.ProgressBar.Small.Inverse"/>

This will usually give you a black on transparent ProgressBar, but some OS installs use custom assets. If you're looking for a specific color, you'll have to roll your own drawables by following the instructions provided by CommonsWare.

Anm
  • 3,091
  • 2
  • 25
  • 37
  • This doesn't appear to be a device-agnostic solution. On my LG Optimus 2X Speed, an indeterminate ProgressBar is still always black, while on a HTC Desire HD with CyanogenMod for 2.3.3, it is always red. – Paul Lammertsma Apr 06 '11 at 15:47
  • @Paul - Yes, you are correct. Many device manufactures customize the themes, and the default theme can change between Android versions. I'll correct the text above – Anm Apr 20 '11 at 15:26
34

I see other answers are quite old, in order to change the indeterminate ProgressBar color you have just to set android:indeterminateTint and android:indeterminateTintMode attributes in your ProgressBar item directly in XML:

<ProgressBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:indeterminateTint="@color/colorPrimary"
    android:indeterminateTintMode="src_in"
    android:indeterminate="true" />

android:indeterminateTint - Tint to apply to the indeterminate progress indicator.

Must be a color value, in the form of "#rgb", "#argb", "#rrggbb", "#aarrggbb", or a reference to a resource @color/colorPrimary.

android:indeterminateTintMode - Blending mode used to apply the progress indicator tint.

Must be one of the following constant values:
add, multiply, screen, src_atop, src_in or src_over

Getter and Setter methods for these attributes are:

All of them were added in API level 21

Cliff Burton
  • 2,529
  • 20
  • 30
  • 39
  • 1
    So frustrating! In android studio you have to use the View All Attributes option to access indeterminateTintMode and then change it to src_in...I was NOT going to figure this out on my own. Thanks! – Scooter Jul 01 '18 at 15:22
11

I make sample project and post in in my blog. Please, look at. http://www.hrupin.com/2011/09/21/how-to-make-custom-indeterminate-progressbar-in-android-or-how-to-change-progressbar-style-or-color

Hope, it help you

ihrupin
  • 6,852
  • 2
  • 28
  • 47
6
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background" android:drawable="@drawable/bg" />
    <item android:id="@android:id/secondaryProgress" android:drawable="@drawable/secondary" />
    <item android:id="@android:id/progress" android:drawable="@drawable/progress" />
</layer-list>
Franci Penov
  • 71,783
  • 15
  • 124
  • 160
3

For API less than 23 use

progressBar.getIndeterminateDrawable().setColorFilter(
       getResources().getColor(Your_Color),
        android.graphics.PorterDuff.Mode.SRC_IN);

else use

progressBar.getIndeterminateDrawable().setColorFilter(
        ContextCompat.getColor(context, Your_Color),
        android.graphics.PorterDuff.Mode.SRC_IN);
1

Override android:colorControlActivated in your AppTheme which should be in your styles.xml:

<style name="AppTheme" parent="...">
    ...
    <item name="android:colorControlActivated">@color/beautiful_color</item>
    ...
</style>

Works on API 21+

janosch
  • 1,848
  • 14
  • 25
0

With the Material Component Library you can use the CircularProgressIndicator with these attributes:

  • indicatorColor
  • trackColor

Something like:

<com.google.android.material.progressindicator.CircularProgressIndicator
       android:indeterminate="true"
       app:trackColor="@color/red600Light"
       app:indicatorColor="@color/red600Dark"
       app:indicatorSize="50dp"
       .../>

enter image description here

You can also use a Multi-color indeterminate indicator.

<com.google.android.material.progressindicator.CircularProgressIndicator
            android:indeterminate="true"
            app:trackColor="@color/red600Light"
            app:indicatorColor="@array/progress_colors"
            app:indeterminateAnimationType="contiguous"/>

with array/progress_colors:

  <integer-array name="progress_colors">
    <item>@color/...</item>
    <item>@color/...</item>
    <item>@color/...</item>
  </integer-array>
Gabriele Mariotti
  • 192,671
  • 57
  • 469
  • 489
-5

actually all u need to do (for both cirle and bar) is create an xml file in drawable as shown below...... progress_spinner_001 points to whatever image u want to animate and duration ... how long u want to display each frame for....... and set ur android:indeterminateDrawable= filename_in_drawable....

<?xml version="1.0" encoding="utf-8"?>
<animation-list
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
<item android:drawable="@drawable/progress_spinner_001" android:duration="300" />
<item android:drawable="@drawable/progress_spinner_002" android:duration="300" />
<item android:drawable="@drawable/progress_spinner_003" android:duration="300" />
  <item android:drawable="@drawable/progress_spinner_004" android:duration="300" />
    <item android:drawable="@drawable/progress_spinner_005" android:duration="300" />
      <item android:drawable="@drawable/progress_spinner_006" android:duration="300" />
     <item android:drawable="@drawable/progress_spinner_007" android:duration="300" />
    <item android:drawable="@drawable/progress_spinner_008" android:duration="300" />
</animation-list>

ps u may need to resize the progressbar to show as desired

Franci Penov
  • 71,783
  • 15
  • 124
  • 160
lawnile
  • 15