Niestandardowy pasek oceny Androida

Chcę zaimplementować niestandardowy pasek oceny w mojej aplikacji treningowej. Pasek powinien mieć 4 gwiazdki i 1 stopień. Układ wygląda tak:

<com.example.workouttest.MyBar
    android:id="@+id/rating"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:max="4"
    android:numStars="4"
    android:stepSize="1"
    android:scaleX="0.6"
    android:scaleY="0.6"
    android:layout_gravity="right" />

Chcę zastąpić domyślne gwiazdki niestandardowymi obrazami. Ale każda z 4 gwiazd powinna mieć inny obraz:

Gwiazda 1 = „X” oznacza, że ​​„ten element jest wyłączony”

Gwiazda 2 = Kciuk w dół

Gwiazda 3 = coś, co reprezentuje „neutralną ocenę”

Gwiazda 4 = Kciuk w górę

Dodatkowo, gdy na przykład przedmiot jest oceniany z 3 (ocena neutralna), wszystkie inne gwiazdy (1,2 i 4) powinny wyświetlać szarą wersję swojego obrazu.

Próbowałem rozszerzyć z RatingBar i wymyśliłem następujący kod:

public class MyBar extends RatingBar {

    private int[] starArrayColor = {
            R.drawable.star_1_color,
            R.drawable.star_2_color,
            R.drawable.star_3_color,
            R.drawable.star_4_color
    };

    private int[] starArrayGrey = {
            R.drawable.star_1_grey,
            R.drawable.star_2_grey,
            R.drawable.star_3_grey,
            R.drawable.star_4_grey
    };

    public MyBar(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public MyBar(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyBar(Context context) {
        super(context);
    }

    @Override
    protected synchronized void onDraw(Canvas canvas) {
        int stars = getNumStars();
        float rating = getRating();

        for (int i=0;i<stars;i++) {
            Bitmap bitmap;
            Resources res = getResources();
            Paint paint = new Paint();

            if ((int) rating == i) {
                bitmap = BitmapFactory.decodeResource(res, starArrayColor[i]);
            } else {
                bitmap = BitmapFactory.decodeResource(res, starArrayGrey[i]);
            }
            canvas.drawBitmap(bitmap, 0, 0, paint);
            canvas.save();
        }

        super.onDraw(canvas);
    }
}

Niestety nie zadziałało. Rysuje zwykłe gwiazdy z moimi niestandardowymi obrazami jako tło.

Czy jest ktoś, kto wie, jak mi pomóc rozwiązać ten problem?

AKTUALIZACJA

Dzięki Gabe moja działająca metoda onDraw wygląda teraz tak:

@Override
protected synchronized void onDraw(Canvas canvas) {
    int stars = getNumStars();
    float rating = getRating();
    float x = 0;

    for (int i=0;i<stars;i++) {
        Bitmap bitmap;
        Resources res = getResources();
        Paint paint = new Paint();
        x += 50;

        if ((int) rating-1 == i) {
            bitmap = BitmapFactory.decodeResource(res, starArrayColor[i]);
        } else {
            bitmap = BitmapFactory.decodeResource(res, starArrayGrey[i]);
        }
        Bitmap scaled = Bitmap.createScaledBitmap(bitmap, 48, 48, true);
        canvas.drawBitmap(scaled, x, 0, paint);
        canvas.save();
    }
}

questionAnswers(1)

yourAnswerToTheQuestion