Custom rating bar

Question

i have three custom images for stars in my rating bar

Layer list (rating_bar_bronze)

<?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/ic_rating_empty"/>
    <item
        android:id="@android:id/secondaryProgress"
        android:drawable="@drawable/ic_rating_half_bronze"/>
    <item
        android:id="@android:id/progress"
        android:drawable="@drawable/ic_rating_full_bronze"/>

</layer-list>

Rating bar in xml

<RatingBar
    android:id="@+id/ratingBarNearby"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/tvProfileSkill"
    android:layout_toRightOf="@+id/ivProfilePhoto"
    android:clickable="false"
    android:isIndicator="true"
    android:numStars="5"
    android:progressDrawable="@drawable/rating_bar_bronze" />

But my rating bar always shows only one star that is cropped, as in the picture below

Answer 1

I don't know if it will be useful for you at this point, but I made a custom ratingbar which might help you: SimpleRatingBar.

It features:

• Fully working android:layout_width: it can be set to wrap_content, match_parent or abritary dp.
• Arbitrary number of stars.
• Arbitrary step size.
• Size of stars can be controlled exactly or by setting a maximum size.
• Customizable colors in normal state (border, fill and background of stars and rating bar).
• Customizable colors in pressed state (border, fill and background of stars and rating bar).
• Customizable size separation between stars.
• Customizable border width of stars.
• Customizable stars corner radius.
• Allows to set OnRatingBarChangeListener
• Stars fill can be set to start from left to right or from right to left (RTL language support).
• AnimationBuilder integrated in the view to set rating programatically with animation.

Here is a preview of it.

You can find it either in jcenter or in Maven Central. So in your build.gradle file just add to your dependencies:

compile 'com.iarcuschin:simpleratingbar:0.1.+'

In your example, you can use it as:

<com.iarcuschin.simpleratingbar.SimpleRatingBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tvProfileSkill"
        android:layout_toRightOf="@+id/ivProfilePhoto"
        android:clickable="false"
        android:isIndicator="true"
        app:srb_numberOfStars="5"
        app:srb_stepSize="0.01"
        app:srb_borderColor="@color/your_bronze_color"
        app:srb_fillColor="@color/your_bronze_color"
        />

No extra xml files needed :)

I hope it's useful.