Rating bar stars don't change

Question

In my code I want set my custom stars but it didn't work properly

 <RatingBar
                android:id="@+id/ratingBar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:numStars="5"
                android:stepSize="1"
                android:rating="1"
                android:progressDrawable="@drawable/rating_bar_color"/>

rating_bar_color.xml

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

I use this code and what I got in result

Where the lines is coming from. The stars are the same size as default star size.

Answer 1

These lines comes because you are trying to wrap the Rating Bar image by using android:layout_height="wrap_content". So, as a solution you have to provide the height of the rating bar to the size of the image.

If the size of the rating bar image is 20, then try adding

android:layout_height="20dip"

This will work for you!

Answer 2

Just try android:layout_height="20sp" or whatever star sizes you are using.

One more thing, you need to define styles for your customized rating bar:

For example: my_ratingbar.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="foodRatingBar" parent="@android:style/Widget.RatingBar">
        <item name="android:progressDrawable">@drawable/rating_bar_color</item>
        <item name="android:minHeight">36dip</item> 
        <item name="android:maxHeight">36dip</item>
    </style>
</resources>
<!--Where 36dp is the size of image and include progress drawable here.

Apply this style to the RatingBar by using:

<RatingBar   
  ...
   style="@style/my_ratingbar" />

Answer 3

This problem was due to the scaling of the images not being correct. The solution to this is to follow the scale ratios Like this..

ldpi | mdpi | tvdpi | hdpi | xhdpi | xxhdpi | xxxhdpi

0.75 | 1 | 1.33 | 1.5 | 2 | 3 | 4

Answer 4

Those leaking stars happen when the size of the star asset is different from the size of the rating bar AND the star asset doesn't have a transparent space between the star itself and the bottom border. For some reason android tries to enlarge the image by duplicating the lowest part of the asset so you could add some transparent space at the bottom of your asset as I did in one of my projects.

tl;dr: add some transparent space under the star asset