title: Custom rating bar
body: <p>i have three custom images for stars in my rating bar</p>
  
  <p><img src="https://i.stack.imgur.com/szQF1.png" alt="enter image description here"> <img src="https://i.stack.imgur.com/1ztNw.png" alt="enter image description here"> <img src="https://i.stack.imgur.com/SNTW6.png" alt="enter image description here"></p>
  
  <p><strong>Layer list (rating_bar_bronze)</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;layer-list xmlns:android="http://schemas.android.com/apk/res/android" &gt;
  
      &lt;item
          android:id="@android:id/background"
          android:drawable="@drawable/ic_rating_empty"/&gt;
      &lt;item
          android:id="@android:id/secondaryProgress"
          android:drawable="@drawable/ic_rating_half_bronze"/&gt;
      &lt;item
          android:id="@android:id/progress"
          android:drawable="@drawable/ic_rating_full_bronze"/&gt;
  
  &lt;/layer-list&gt;
  </code></pre>
  
  <p><strong>Rating bar in xml</strong></p>
  
  <pre><code>&lt;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" /&gt;
  </code></pre>
  
  <p>But my rating bar always shows only one star that is cropped, as in the picture below
  <img src="https://i.stack.imgur.com/E7KY3.png" alt="enter image description here"></p>