Xamarin - change the background color of the progress bar element

Question

How can I properly change the progress bar background color? I can see that using "colorControlNormal" has an effect on it, but the color appears to be a lot brighter than the color I've set it to be. The color also doesn't change in some cases that appear to be related to an insufficient amount of contrast between the progress bar and the background.

note that I'm only looking for a solution that would work on android.

Thanks in advance

Answer 1

Hello @Tupý Šimon ,

You can define the the background and progress properties under Resources /drawable folder in the Android project, and set the ProgressDrawable for progressBar via Custom Renderers:
First, you could right-click drawable folder , click Add->New Item->Android->Android Layout to add a new xml file named custom_progressbar(or any other name you prefer to ), then define the color.
custom_progressbar.xml

<?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>  
            <solid android:color ="#FF0000"></solid>  
            </shape>  
      </item>  
      <item android:id="@android:id/progress">  
            <clip>  
            <shape>  
                  <solid android:color ="#a973ff"></solid>  
            </shape>  
            </clip>  
      </item>  
</layer-list>  

After that, you can custom the progressbar via Custom Renderer:

[assembly: ExportRenderer(typeof(Xamarin.Forms.ProgressBar), typeof(CustomProgressbarRender))]  
namespace ProgressBarColorSample.Droid  
{  
    public class CustomProgressbarRender : ProgressBarRenderer  
    {  
        public CustomProgressbarRender(Context context) : base(context)  
        {  
        }  
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ProgressBar> e)  
        {  
            base.OnElementChanged(e);  
            if (Control != null)  
            {  
                Android.Widget.ProgressBar progressBar = Control as Android.Widget.ProgressBar;  
              Drawable customDrawable = Context.GetDrawable(Resource.Drawable.custom_progressbar);  
              progressBar.ProgressDrawable = customDrawable;  
             
            }  
        }  
    }  
}  

Best Regards,
Wenyan Zhang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.