0

I have ratingbar shown in a list.

As people rate the items from 1 to 4 stars - the ratingbar should change either color of the stars or the background or overlay or something to symbolize the change (customer requirement in an organisation that's used to use colors to identify state, e.g. green = good)

I was thinking that changing the color of the stars would saisfy this. However, most of the solutions to this revolve around changing the default graphic used in the raing bar, and not how to ownerdraw after a rating has been changed by the user.

Tom
  • 3,587
  • 9
  • 69
  • 124

1 Answers1

1

I suppose you're looking for color tint:

ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
    @Override
    public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
        final LayerDrawable layerDrawable = (LayerDrawable) ratingBar.getProgressDrawable();
        int color;
        switch ((int) rating) {
            case 1:
                color = Color.RED;
                break;
            case 2:
            case 3:
                color = Color.YELLOW;
                break;
            case 4:
            default:
                color = Color.GREEN;
                break;
        }
        DrawableCompat.setTint(DrawableCompat.wrap(layerDrawable.getDrawable(2)), color);
    }
});

It works not very smooth, but it should be a point to start.

enter image description here

Also, you can set the color tint in touch listener - that way will be better for you, I guess:

ratingBar.setOnTouchListener(new View.OnTouchListener() {
    private int lastColoredProgress = 0;

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        int progress = ratingBar.getProgress();
        if (progress != lastColoredProgress) {
            lastColoredProgress = progress;
            final LayerDrawable layerDrawable = (LayerDrawable) ratingBar.getProgressDrawable();
            int color;
            switch (lastColoredProgress) {
                case 0:
                case 1:
                    color = Color.RED;
                    break;
                case 2:
                case 3:
                    color = Color.YELLOW;
                    break;
                case 4:
                default:
                    color = Color.GREEN;
                    break;
            }
            DrawableCompat.setTint(DrawableCompat.wrap(layerDrawable.getDrawable(2)), color);
        }
        return false;
    }
});

enter image description here

Mikalai Daronin
  • 8,590
  • 2
  • 35
  • 47
  • this looks very promising - will test later today/tonight and accept as answer – Tom Apr 20 '16 at 16:42
  • I think after updating to newest version this code no longer works. I will ry continue work on the problem which is very odd. I am hoping to find it is a problem I caused myself somehow that the tint no longer takes affect. – Tom May 16 '16 at 10:29
  • As I can see, this issue appears in appcompat in 23.3 and newer. I'll try to find out why.... – Mikalai Daronin May 25 '16 at 16:45
  • Probably `DrawableCompat.wrap` works a little bit strange since 23.3... Anyway, [here](https://gist.github.com/lassana/2a0775373572d1b0ca255ecc2d3f1449) is working code: https://i.imgur.com/aQ5doHa.gif (tested on KitKat and Lollipop). – Mikalai Daronin May 25 '16 at 17:17