Custom RatingBar not showing more than 1 star

Question

I have implemented a custom rating bar from this stackoverflow thread which isn't showing more than one star even if I set numStars to 5 or any other number

Here is the Code.

I'm using vector drawables for images.

RatingBar in main_activity.xml

<RatingBar
        android:id="@+id/ratingBarValue"
        style="@style/Fuel_Indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:numStars="5"
        android:stepSize="1.0"
        android:max="5" />

Fuel_Indicator style in styles.

<style name="Fuel_Indicator" parent="@android:style/Widget.RatingBar">
    <item name="android:progressDrawable">@drawable/fuel_bar_full</item>
    <item name="android:indeterminateDrawable">@drawable/fuel_bar_full</item>
    <item name="android:minHeight">23dip</item>
    <item name="android:maxHeight">25dip</item>
</style>

The fuel_bar_full.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background"
    android:drawable="@drawable/fuel_bar_empty" />
<item android:id="@android:id/secondaryProgress"
    android:drawable="@drawable/fuel_bar_empty" />
<item android:id="@android:id/progress"
    android:drawable="@drawable/fuel_bar_filled" />

fuel_bar_empty.xml

<selector
xmlns:android="http://schemas.android.com/apk/res/android">`
<item android:state_pressed="true"
    android:state_window_focused="true"
    android:drawable="@drawable/ic_fuel_empty" />

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

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

<item android:drawable="@drawable/ic_fuel_empty" />
</selector>

fuel_bar_filled.xml

<selector
xmlns:android="http://schemas.android.com/apk/res/android">`

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

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

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

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

</selector>

Answer 1

Your implementation is perfect But you are using Vector Drawable which is causing this issue. So to work with it try to replace Vector Drawable with png image in the drawable folder and see the magic it work.

you are using Vector Drawable with layer-list so your Vector Drawable image is fit to the whole layout try to replace it with png which will solve your problem.