Rating Bar Fill color android

Question

For filling the color in rating bar for decimal rating is working fine for API below 23 and not working in API 23.

Here is the code:

RatingBar ratingBar = (RatingBar) view.findViewById(R.id.ratingbar);
ratingBar.setNumStars(5);
ratingBar.setMax(5);
ratingBar.setStepSize(0.1f);
ratingBar.setRating(0.5);
Drawable ratingBarColor = ratingBar.getProgressDrawable();
DrawableCompat.setTint(ratingBarColor, ContextCompat.getColor(getActivity(), R.color.red));

which will fill the color for 0.5(half) star with the red color. But for android API 23(MarshMallow) whatever you set the rating it's filling all the star.Can I know what's the change happened in API 23 which is causing this issue or let me know the problem with this code.

Handset used for testing (6.0): HTC One M8, Moto X Play, Nexus 6. 5.1.1: Moto X(First Gen),Nexus 4,Moto G1,G2

Edit: I tested by removing setTint in API23 which is setting white color with decimal rating.So it could be issue with DrawableCompat for setting color for decimal rating star.

I didn't get you. you are creating customized style??? I am telling you to declair it in the xml where ratingbar you placed. — , Feb 22 '16 at 09:30
@Viren for image it shows correctly.It's very difficult to make different color star image(I need to set star color based on some condition). My question is filling color inside the rating bar, which is failing. — Madhukar Hebbar, Feb 22 '16 at 09:40
refer http://stackoverflow.com/questions/2446270/android-ratingbar-change-star-colors — , Feb 22 '16 at 09:42
@Viren.Thanks. But Please recheck my question. Filling color for rating bar is not reflecting in marshmalllow(API 23). — Madhukar Hebbar, Feb 22 '16 at 09:45

Desmond Lua · Answer 1 · 2016-06-08T06:03:39.053

For API 23(MarshMallow), RatingBar does suffer the problem of all stars changed color (regardless it's 1 or 5 stars) which look like it's always 5 stars.

UPDATED ANSWER: The following code works

if (ratingBar.getProgressDrawable() instanceof LayerDrawable) {
    LayerDrawable stars = (LayerDrawable) ratingBar.getProgressDrawable();
    DrawableCompat.setTint(stars.getDrawable(2), color);
}
else {
    // for Android 4.3, ratingBar.getProgressDrawable()=DrawableWrapperHoneycomb
    DrawableCompat.setTint(ratingBar.getProgressDrawable(), color);
}

The following doesn't work for Mashmallow

Drawable ratingBarColor = ratingBar.getProgressDrawable();
DrawableCompat.setTint(ratingBarColor, ContextCompat.getColor(getActivity(), R.color.red));

In the layout file remember to use android.support.v7.widget.AppCompatRatingBar, not RatingBar.

Thanks for the answer @Desmond. I will try it out. – Madhukar Hebbar May 23 '16 at 06:25 — Madhukar Hebbar, May 23 '16 at 06:25

score 2 · Answer 2 · answered Feb 22 '16 at 10:27

you can make the custom rating bar

1 just make the xml file in your drawable folder and name it rating_bar.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" android:drawable="@drawable/rating_empty" />
        <item android:id="@android:id/secondaryProgress" android:drawable="@drawable/rating_empty" />
        <item android:id="@android:id/progress" android:drawable="@drawable/rating_filled" />
    </layer-list>

2 make the another drawable xml file and name it rating_empty.xml

<item android:state_pressed="true"
      android:state_window_focused="true"
      android:drawable="@drawable/ic_unrated_star" />

<item android:state_focused="true"
      android:state_window_focused="true"
      android:drawable="@drawable/ic_unrated_star" />

<item android:state_selected="true"
      android:state_window_focused="true"
      android:drawable="@drawable/ic_unrated_star" />

<item android:drawable="@drawable/ic_unrated_star" />

3 make anothe drawable xml file for filled star and name it rating_filled.xml

<item android:state_pressed="true"
      android:state_window_focused="true"
      android:drawable="@drawable/ic_rated_star" />

<item android:state_focused="true"
      android:state_window_focused="true"
      android:drawable="@drawable/ic_rated_star" />

<item android:state_selected="true"
      android:state_window_focused="true"
      android:drawable="@drawable/ic_rated_star" />

<item android:drawable="@drawable/ic_rated_star" />

4 goto your values folder and open style.xml and add the style

<style name="customRatingBar" parent="@android:style/Widget.RatingBar">
        <item name="android:progressDrawable">@drawable/rating_bar</item>
    </style>

5 just use the custom rating bar, which you have just created

    <RatingBar
    style="@style/customRatingBar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|center"
    android:numStars="5" />

Note: ic_rated_star and ic_unrated_star are the completly filled star and empty star image , which you want to show in your rating bar.

Hope this worked for you... best of luck...

How can you change the color of the rating bar based on conditions?. Please read the question before answering. — Madhukar Hebbar, Feb 22 '16 at 11:47

Rating Bar Fill color android

2 Answers2