Custom Rating Bar in Android

Hello World, Today we are going to see how to customize rating bar in android for example:

how to make small rating bar or how to change the color of rating bar or how to completely change rating bar appearance and set rating change listener etc.

How to change rating bar size or make rating bar small

Making a small rating bar is simple but before making a small rating bar, let’s look at how the default rating bar looks if we add it in our layout?

The default rating bar is big and looks ugly, to make it look small and make stars color golden or yellow we use below code:

<RatingBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:rating="3"
        style="?android:attr/ratingBarStyleIndicator"
        android:progressTint="#FFCC01"
        android:id="@+id/smallRating"
        />

Now, this looks perfect, right? But wait what if I tell you that you can use any image instead of stars in the rating bar? excited! Stay with this article and you will catch it later.

Now let’s see how we can add a listener to the rating bar do that whenever a user give rating we can at accordingly.

Set Listener for Rating bar

To add a rating change listener we need to add the below code in our activity java file.

....

  RatingBar ratingBar = findViewById(R.id.normalRating);

        ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
            @Override
            public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
                Toast.makeText(MainActivity.this, String.valueOf(rating), Toast.LENGTH_SHORT).show();
            }
        });

....

in the first line, we are getting our rating bar widget by using the findViewById method then we are setting the **setOnRatingBarChangeListener **and passing interface in the parameter and implement **onRatingChanged **method and in the parameters, we are getting our rating in float value as the second parameter.

After getting the rating value by the user we are displaying it in the toast. Of course, you can use this rating according to your need.

See also: CardView in Android

Custom Rating Bar in Android

By default rating bar shows stars as a rating but there are some cases we need to add our own graphics. Let’s say you want a rating bar instead of stars we need hearts. something like below:

To make a custom rating bar like above. We need to perform certain steps as follows:

Step 1. Copy your images in the drawable folder and remember image size should be according to the size you want.

#android-app-development #android-development #android-studio #rating-bar #android-rating-bar #custom-rating-bar-android #android-app