Android: Ratingbar not visible, becomes visible only on touching

Question

In my Android app, ratingbars are not visible. It only becomes visible only on touching it and disappears as soon as I take my fingers off.

My code:

<RatingBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/myratingStars"
            android:layout_gravity="center_horizontal|center_vertical|center"
            android:numStars="5"/>

It does not render in Lollipop emulator/real phone/Android Studio design window(in API 23 mode) but gets rendered in KitKat emulator and Android design window(in API 15 mode).

Complete layout file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="24dp"
        android:orientation="vertical">
        <RatingBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/myratingStars"
            android:layout_gravity="center_horizontal|center_vertical|center"
            android:numStars="5"/>
        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <android.support.v7.widget.AppCompatEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textSize="16sp"
                android:maxLines="10"
                android:id="@+id/myratingTxt"
                android:layout_marginTop="12dp"
                android:layout_marginBottom="2dp"
                android:hint="@string/write_review"/>
        </android.support.design.widget.TextInputLayout>

        <android.support.v7.widget.AppCompatButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/submitReview"
            android:text="@string/review_submit"
          android:layout_gravity="center_horizontal|center|center_vertical"
            android:textColor="@color/white"
            android:onClick="submitReview"
            android:layout_marginTop="8dp"
            tools:visibility="visible"/>
    </LinearLayout>

</LinearLayout>

Did you figure out why that was happening? I am having the same issue. — user2520215, Dec 18 '15 at 11:55
I think we need to see all your container layout and what you do on java side for this widget, because nothing in the `RatingBar` attributes should get this strange behaviour. — Blo, Dec 19 '15 at 18:49
hi @RajatSaxena I think your issue is within your style you are using for >=21 . can you please check that and add your style here? — KDeogharkar, Dec 22 '15 at 06:14

score 6 · Answer 1 · answered Apr 13 '16 at 11:37

After a bit of research tried my luck and it worked!!! Finally found a solution!

Adding these attributes to saved my life!!!

android:progressBackgroundTint="@color/colorAccent"
android:progressTint="@color/colorAccent"
android:secondaryProgressTint="@color/colorAccent"

Example:

<android.support.v7.widget.AppCompatRatingBar
        android:id="@+id/ratingBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:progressBackgroundTint="@color/colorAccent"
        android:progressTint="@color/colorAccent"
        android:secondaryProgressTint="@color/colorAccent"
        android:rating="4" />

You can change these colors according to your needs!!

Extra info:

android:progressTint used for actual progress color

android:secondaryProgressTint used for secondary progress that is when a partial rating selected say half the other half colored using this attribute.

android:progressBackgroundTint used for rest of the rating say 3 out of 5 so last 2 colored this one!

Happy coding!! Eat drink Android! ;)

score 5 · Answer 2 · answered Dec 25 '15 at 10:36

According to this issue on google code, try to add that lines to your RatingBar properties:

android:isIndicator="true"
style="?android:attr/ratingBarStyleIndicator"

Or probably some of that styles:

style="?android:attr/ratingBarStyle"

or

style="android:attr/ratingBarStyleSmall"

As you can see there are no answer from google developers, so I don't know why this weird behavior appears, but maybe it helps.

score 1 · Answer 3 · answered Dec 18 '15 at 12:49

1

Without all layout file it's impossible to solve this problem , but if happen only in Lollipop or Marshmallow can be elevation problem. Try set to rating bar "elevation:10dp"

answered Dec 18 '15 at 12:49

an_droid_dev

1,136
14
18

score 1 · Answer 4 · edited May 02 '16 at 15:47

1

yourRatingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
            @Override
            public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
                YourRatingValue = String.valueOf(rating);                 
                Toast.makeText(getActivity(), "Your Rating :" + YourRatingValue, Toast.LENGTH_SHORT).show();
            }
        });

edited May 02 '16 at 15:47

Renjith K N

2,613
2
31
53

answered Dec 25 '15 at 07:26

Krishnan

428
1
4
11

try to setOnRatingBarChangeListener – Krishnan Dec 25 '15 at 07:27

score -1 · Answer 5 · answered Nov 19 '20 at 06:03

-1

What worked for me, was to play around with the height of the widget. When it was too large, the widget wasn't showing visually.

answered Nov 19 '20 at 06:03

niko

100
4

Android: Ratingbar not visible, becomes visible only on touching

5 Answers5

Linked