Android RatingBar below Lollipop renders incorrectly - ratingbar

Question

I'm using my custom rating bar. The top image with 5 stars is on Lollipop where my ratingbar works fine. However, below Lollipop (Kitat, JellyBean, ICS) versions the rating bar is goofed up (check second image with a single star)
What can be the problem? I tried all possible methods, changing theme, managing height width...nothing seems to work :(
This is the style
<style name="customRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/rating_custom_bar</item>
</style>
This is the 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/star_blank"/>
<item
android:id="#+android:id/secondaryProgress"
android:drawable="#drawable/star_blank"/>
<item
android:id="#+android:id/progress"
android:drawable="#drawable/star_filled"/>
</layer-list>
This is star blank
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/rating_empty" android:state_pressed="true" android:state_window_focused="true"/>
<item android:drawable="#drawable/rating_empty" android:state_focused="true" android:state_window_focused="true"/>
<item android:drawable="#drawable/rating_empty" android:state_selected="true" android:state_window_focused="true"/>
<item android:drawable="#drawable/rating_empty"/>
</selector>
This is star filled
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/rating_full" android:state_pressed="true" android:state_window_focused="true"/>
<item android:drawable="#drawable/rating_full" android:state_focused="true" android:state_window_focused="true"/>
<item android:drawable="#drawable/rating_full" android:state_selected="true" android:state_window_focused="true"/>
<item android:drawable="#drawable/rating_full"/>
</selector>

Answer 1

I have the same problem and spend a lot of time in it, tried setting all parameters at the ratingBar but none work, but there was something weird. I was working with a friend in a project and he compiles the exact same code as I and doesn't have this issue, so I change the IDE to his and all starts working.
I was using "Android Developer Tools", the eclipse you used to download at https://developer.android.com/training/index.html which is an eclipse with the ADT already embedded.
I change to Java EE and download ADT following this instructions http://developer.android.com/sdk/installing/installing-adt.html
I hope this helps you with your problem.

Answer 2

Has been a while but never hurts to answer. Here is my 3 step solution regardless of SDK version.
1- Add this as your RatingBar in your xml layout:
<RatingBar
android:id="#+id/new_ratingbar"
android:progressDrawable="#drawable/custom_drawable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
android:stepSize="0.5"/>
If needed, you can give the RatingBar minHeight and maxHeight or add other attributes as required.
2- Here is the drawable you would refer the above progressDrawable to:
custom_drawable.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_bar_empty" /> <!--this is your .png file-->
<item
android:id="#android:id/secondaryProgress"
android:drawable="#drawable/rating_bar_fill" /> <!--this is your .png file-->
<item
android:id="#android:id/progress"
android:drawable="#drawable/rating_bar_fill" /> <!--this is your .png file-->
</layer-list>
3- The last thing is to provide the .png files in your various drawable folders.