How to change ProgressBar s progress indicator color in Android

Question

I have set Horizontal ProgressBar   I would like to change the progress color to yellow    lt ProgressBar      android id    id progressbar       android layout width  80dip       android layout height  20dip        android focusable  false       style   android attr progressBarStyleHorizontal    gt    The problem is  the progress color is different in different devices  So  I want it to fix the progress color

User · Answer

Just create a style in values styles xml    lt style name  ProgressBarStyle  gt       lt item name  colorAccent  gt  color greenLight lt  item gt   lt  style gt    Then set this style as your ProgressBar theme     lt ProgressBar     android theme   style ProgressBarStyle      android layout width  match parent      android layout height  wrap content   gt    and doesn t matter your progress bar is horizontal or circular  That s all

User · Answer

In xml    lt ProgressBar                     android id    id progressBar                      style   android attr progressBarStyleInverse                      android layout width  60dp                      android layout height  60dp                      android layout margin   dimen dimen 10dp                     android indeterminateTint    viewModel getComplainStatusUpdate position                        android indeterminate  true                      android indeterminateOnly  false                      android max  100                      android clickable  false                      android indeterminateDrawable   drawable round progress                      app layout constraintBottom toBottomOf  parent                      app layout constraintLeft toLeftOf  parent                      app layout constraintTop toTopOf  parent    gt    ViewModel   fun getComplainStatusUpdate position  Int  Int                   val list   myAllComplainList   getValue                   if  list   get position  complainStatus equals  P                            progressBar setProgressTintList ColorStateList valueOf Color RED                          progressBar setBackgroundResource R drawable circle shape                      return Color RED                   else if  list   get position  complainStatus equals  I                           return Color GREEN                   else                        return Color GREEN                     return Color CYAN

User · Answer

There are 3 ways to solve this question   How to adjust the progressbar color declaratively How to adjust the progressbar color programmatically  but choose the color from various predetermined colors declared before compile-time How to adjust the progressbar color programmatically  and also create the color programatically   In particular there is a lot of confusion around  2 and  3  as seen in comments to amfcosta s answer  That answer will yield unpredictable color results anytime you d like to set the progressbar to anything except primary colors  as it only modifies the background color  and the actual progress bar  quot clip quot  area will still be a yellow overlay with reduced opacity  For example  using that method to set the background to dark purple will result in a progress bar  quot clip quot  color of some crazy pinkish color resulting from dark purple and yellow mixing via reduced alpha  So anyhow   1 is answered perfectly by Ryan and   tarke answers most of  3  but for those looking for a complete solution to  2 and  3   How to adjust the progressbar color programmatically  but choose the color from a predetermined color declared in XML res drawable my progressbar xml  Create this file but change the colors in my progress and my secondsProgress   NOTE  This is just a copy of the actual XML file defining the default android SDK ProgressBar  but I ve changed the IDs and Colors  The original is named progress horizontal   lt  xml version  quot 1 0 quot  encoding  quot utf-8 quot   gt   lt layer-list xmlns android  quot http   schemas android com apk res android quot  gt    lt item android id  quot   id my progress background quot  gt       lt shape gt           lt corners android radius  quot 5dip quot    gt           lt gradient             android startColor  quot  ff9d9e9d quot              android centerColor  quot  ff5a5d5a quot              android centerY  quot 0 75 quot              android endColor  quot  ff747674 quot              android angle  quot 270 quot                gt       lt  shape gt   lt  item gt    lt item android id  quot   id my secondaryProgress quot  gt       lt clip gt           lt shape gt               lt corners android radius  quot 5dip quot    gt               lt gradient                 android startColor  quot  80ff171d quot                  android centerColor  quot  80ff1315 quot                  android centerY  quot 0 75 quot                  android endColor  quot  a0ff0208 quot                  android angle  quot 270 quot                    gt           lt  shape gt       lt  clip gt   lt  item gt    lt item android id  quot   id my progress quot  gt       lt clip gt           lt shape gt               lt corners android radius  quot 5dip quot    gt               lt gradient                 android startColor  quot  7d2afdff quot                  android centerColor  quot  ff2afdff quot                  android centerY  quot 0 75 quot                  android endColor  quot  ff22b9ba quot                  android angle  quot 270 quot                    gt           lt  shape gt       lt  clip gt   lt  item gt    In your Java  final Drawable drawable  int sdk   android os Build VERSION SDK INT      if sdk  lt  16            drawable    ctx getResources   getDrawable R drawable my progressbar         else           drawable   ContextCompat getDrawable ctx  R drawable my progressbar         progressBar setProgressDrawable drawable    How to adjust the progressbar color programmatically  and also create the color programatically EDIT  I found the time to solve this properly  My former answer left this a bit ambiguous  A ProgressBar is composed as 3 Drawables in a LayerDrawable   Layer 1 is the background Layer 2 is the secondary progress color Layer 3 is the main progress bar color  In the example below I ll change the color of the main progress bar to cyan    Create new ClipDrawable to replace the old one float pxCornerRadius   viewUtils convertDpToPixel 5   final float   roundedCorners   new float     pxCornerRadius  pxCornerRadius  pxCornerRadius  pxCornerRadius  pxCornerRadius  pxCornerRadius  pxCornerRadius  pxCornerRadius    ShapeDrawable shpDrawable   new ShapeDrawable new RoundRectShape roundedCorners  null  null    shpDrawable getPaint   setColor Color CYAN   final ClipDrawable newProgressClip   new ClipDrawable shpDrawable  Gravity LEFT  ClipDrawable HORIZONTAL      Replace the existing ClipDrawable with this new one final LayerDrawable layers    LayerDrawable  progressBar getProgressDrawable    layers setDrawableByLayerId R id my progress  newProgressClip    That example set it to a solid color  You may set it to a gradient color by replacing shpDrawable getPaint   setColor Color CYAN    with Shader shader   new LinearGradient 0  0  0  progressBar getHeight    Color WHITE  Color BLACK  Shader TileMode CLAMP   shpDrawable getPaint   setShader shader    Cheers  -Lance

User · Answer

For anyone looking for how to do it programmatically       Drawable bckgrndDr   new ColorDrawable Color RED       Drawable secProgressDr   new ColorDrawable Color GRAY       Drawable progressDr   new ScaleDrawable new ColorDrawable Color BLUE   Gravity LEFT  1  -1       LayerDrawable resultDr   new LayerDrawable new Drawable     bckgrndDr  secProgressDr  progressDr           setting ids is important     resultDr setId 0  android R id background       resultDr setId 1  android R id secondaryProgress       resultDr setId 2  android R id progress     Setting ids to drawables is crucial  and takes care of preserving bounds and actual state of progress bar

User · Answer

You can use custom drawable to make your Progressbar stylable  Create a drawable file progress user badge xml  lt  xml version  quot 1 0 quot  encoding  quot utf-8 quot   gt    lt layer-list xmlns android  quot http   schemas android com apk res android quot  gt        lt item android id  quot  android id background quot  gt           lt shape android shape  quot rectangle quot  gt               lt corners android radius  quot  dimen  5sdp quot   gt               lt solid android color  quot  color your default color quot    gt           lt  shape gt       lt  item gt        lt item android id  quot  android id progress quot  gt           lt clip gt               lt shape android shape  quot rectangle quot  gt                   lt corners android radius  quot  dimen  5sdp quot   gt                   lt solid android color  quot  color your exact color quot    gt               lt  shape gt           lt  clip gt       lt  item gt    lt  layer-list gt   now use this drawable file in your widget  lt ProgressBar     android id  quot   id badge progress bar quot      style  quot  android attr progressBarStyleHorizontal quot      android layout width  quot  dimen  200sdp quot      android layout height  quot  dimen  7sdp quot      android layout gravity  quot center quot      android layout marginTop  quot  dimen  15sdp quot      android indeterminate  quot false quot      android max  quot 100 quot      android progress  quot 70 quot      android progressDrawable  quot  drawable progress user badge quot   gt   You can use the bellow line to change the progress color of Progressbar programmatically badge progress bar progressTintList   ColorStateList valueOf ContextCompat getColor this  R color your color

User · Answer

If you only want to change the progress bar color  you can simply use a color filter in your Activity s onCreate   method   ProgressBar progressbar    ProgressBar  findViewById R id progressbar   int color   0xFF00FF00  progressbar getIndeterminateDrawable   setColorFilter color  PorterDuff Mode SRC IN   progressbar getProgressDrawable   setColorFilter color  PorterDuff Mode SRC IN     Idea from here   You only need to do this for pre-lollipop versions  On Lollipop you can use the colorAccent style attribute

User · Answer

A simpler solution   progess drawable blue   lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt   lt item android id   android id background  gt       lt shape gt           lt solid                 android color   color disabled    gt       lt  shape gt   lt  item gt    lt item     android id   android id progress  gt       lt clip gt           lt shape gt               lt solid                 android color   color blue    gt           lt  shape gt       lt  clip gt   lt  item gt    lt  layer-list gt

User · Answer

simply add android indeterminateTint  quot  color colorPrimary quot  to your progressBar Example   lt ProgressBar     android id  quot   id progressBar quot      style  quot  android attr progressBarStyle quot      android layout width  quot wrap content quot      android layout height  quot wrap content quot      android indeterminateTint  quot  color colorPrimary quot   gt   in case of progressBarStyleHorizontal change android progressTint  quot  color colorPrimary quot  Example    lt ProgressBar     android id  quot   id progressBar quot      style  quot  android attr progressBarStyleHorizontal quot      android layout width  quot wrap content quot      android layout height  quot wrap content quot      android progress  quot 50 quot      android progressTint  quot  color colorPrimary quot    gt

User · Answer

If you want to set primary and secondary progress color to horizontal progress bar programmatically in android then use below snippet  int     states   new int                               new int    -android R attr state checked                           new int    android R attr state checked                                       int   secondaryColor   new int                             context getResources   getColor R color graph line one                           Color RED                                      int   primaryColor   new int                             context getResources   getColor R color middle progress                           Color BLUE                                     progressbar setProgressTintList new ColorStateList states  primaryColor                    progressbar setSecondaryProgressTintList new ColorStateList states  secondaryColor

User · Answer

ProgressBar color can be changed as follows    res values colors xml   lt  xml version  1 0  encoding  utf-8   gt   lt resources gt       lt color name  colorAccent  gt  FF4081 lt  color gt   lt  resources gt     res values styles xml   lt style name  AppTheme  parent  Theme AppCompat Light DarkActionBar  gt       lt item name  colorAccent  gt  color colorAccent lt  item gt   lt  style gt     onCreate   progressBar    ProgressBar  findViewById R id progressBar   if  Build VERSION SDK INT  lt  Build VERSION CODES LOLLIPOP        Drawable drawable   progressBar getIndeterminateDrawable   mutate        drawable setColorFilter ContextCompat getColor this  R color colorAccent   PorterDuff Mode SRC IN       progressBar setIndeterminateDrawable drawable

User · Answer

If you are in API level 21 or above you can use these XML attributes    lt  -- For indeterminate progress bar -- gt  android indeterminateTint   color white   lt  -- For normal progress bar -- gt  android progressTint   color white

User · Answer

Create a drawable resource what background you need  in my case I named it bg custom progressbar xml    lt  xml version  1 0  encoding  utf-8   gt       lt item gt       lt shape android shape  rectangle   gt           lt corners android radius  5dp   gt            lt gradient             android angle  180              android endColor   DADFD6              android startColor   AEB9A3    gt       lt  shape gt   lt  item gt   lt item gt       lt clip gt           lt shape android shape  rectangle   gt               lt corners android radius  5dp    gt                lt gradient                 android angle  180                  android endColor   44CF4A                  android startColor   2BB930    gt           lt  shape gt       lt  clip gt   lt  item gt   lt item gt       lt clip gt           lt shape android shape  rectangle   gt               lt corners android radius  5dp    gt                lt gradient                 android angle  180                  android endColor   44CF4A                  android startColor   2BB930    gt           lt  shape gt       lt  clip gt   lt  item gt      Then use this custom background like     lt ProgressBar                 android id    id progressBarBarMenuHome                  style   android attr progressBarStyleHorizontal                  android layout width  match parent                  android layout height  20dp                  android layout marginStart  10dp                  android layout marginEnd  10dp                  android layout marginBottom  6dp                  android indeterminate  false                  android max  100                  android minWidth  200dp                  android minHeight  50dp                  android progress  10                  android progressDrawable   drawable bg custom progressbar    gt    Its works fine for me

User · Answer

final LayerDrawable layers    LayerDrawable  progressBar getProgressDrawable    layers getDrawable 2  setColorFilter color PorterDuff Mode SRC IN

User · Answer

I copied this from one of my apps  so there s prob a few extra attributes  but should give you the idea   This is from the layout that has the progress bar    lt ProgressBar     android id    id ProgressBar      style   android attr progressBarStyleHorizontal      android layout width  fill parent      android layout height  wrap content      android indeterminate  false      android maxHeight  10dip      android minHeight  10dip      android progress  50      android progressDrawable   drawable greenprogress    gt    Then create a new drawable with something similar to the following  In this case greenprogress xml     lt  xml version  1 0  encoding  utf-8   gt   lt layer-list xmlns android  http   schemas android com apk res android  gt       lt item android id   android id background  gt           lt shape gt               lt corners android radius  5dip    gt               lt gradient                 android angle  270                  android centerColor   ff5a5d5a                  android centerY  0 75                  android endColor   ff747674                  android startColor   ff9d9e9d    gt           lt  shape gt       lt  item gt        lt item android id   android id secondaryProgress  gt           lt clip gt               lt shape gt                   lt corners android radius  5dip    gt                   lt gradient                     android angle  270                      android centerColor   80ffb600                      android centerY  0 75                      android endColor   a0ffcb00                      android startColor   80ffd300    gt               lt  shape gt           lt  clip gt       lt  item gt       lt item android id   android id progress  gt           lt clip gt               lt shape gt                   lt corners android radius  5dip    gt                   lt gradient                     android angle  270                      android endColor   008000                      android startColor   33FF33    gt               lt  shape gt           lt  clip gt       lt  item gt    lt  layer-list gt    You can change up the colors as needed  this will give you a green progress bar

User · Answer

for API level 21 or higher just use  android progressBackgroundTint   color yourBackgroundColor  android progressTint   color yourColor

User · Answer

You guys are really giving me a headache   What you can do is make your layer-list drawable via xml first  meaning a background as the first layer  a drawable that represents secondary progress as the second layer  and another drawable that represents the primary progress as the last layer   then change the color on the code by doing the following   public void setPrimaryProgressColor int colorInstance          if  progressBar getProgressDrawable   instanceof LayerDrawable            Log d mLogTag   Drawable is a layer drawable            LayerDrawable layered    LayerDrawable  progressBar getProgressDrawable            Drawable circleDrawableExample   layered getDrawable  lt whichever is your index of android R id progress gt            circleDrawableExample setColorFilter colorInstance  PorterDuff Mode SRC IN           progressBar setProgressDrawable layered         else           Log d mLogTag   Fallback in case it s not a LayerDrawable            progressBar getProgressDrawable   setColorFilter color  PorterDuff Mode SRC IN             This method will give you the best flexibility of having the measurement of your original drawable declared on the xml  WITH NO MODIFICATION ON ITS STRUCTURE AFTERWARDS  especially if you need to have the xml file screen folder specific  then just modifying ONLY THE COLOR via the code  No re-instantiating a new ShapeDrawable from scratch whatsoever

User · Answer

The simplest solution I found out is something like this    lt item name  colorAccent  gt  color white or any color lt  item gt    Put the above in styles xml file under res  gt  values folder   NOTE  If you use any other accent color  then the previous solutions should be good to go with   API 21 or HIGHER

User · Answer

With the Material Components Library you can use the LinearProgressIndicator with the app indicatorColor attribute to change the color     lt com google android material progressindicator LinearProgressIndicator       app indicatorColor  quot  color     quot        app trackThickness  quot     quot        app trackColor  quot  color     quot          gt    Note  it requires at least the version 1 3 0-alpha04  With the ProgressBar you can override the color using   lt ProgressBar     android theme  quot  style CustomProgressBarTheme quot         gt   with   lt style name  quot CustomProgressBarTheme quot  gt       lt item name  quot colorAccent quot  gt  color primaryDarkColor lt  item gt   lt  style gt

[android] How to change ProgressBar's progress indicator color in Android

Examples related to android

Examples related to android-progressbar