RatingBar is getting semi-transparent

Question

I'm using RecyclerView with RatingBar in each row. Now, sometimes part of RatingBars are drawn incorrectly. After leaving a screen and going back it's all back to normal. I have no idea why this is happening, I even removed any styles from RatingBar so it should have default appearance.

This is how it looks:

Tested on Nexus 6P (Android 7.1.1). Also tested on Samsung Galaxy J3 (2016) (Android 5.1.1) and there's no problem here.

I've also added

holder.rbRating.requestLayout();

in onBindViewHolder(). It reduces the problem a bit, but it's still present. When I scroll a "bad" row out of a screen when it's reused it looks fine.

Here's row layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:paddingTop="@dimen/main_margin_top"
    android:paddingBottom="@dimen/main_margin_top"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/tvRatingTitle"
        android:text="Czystość wody"
        android:textSize="16sp"
        android:textStyle="bold"
        android:layout_centerHorizontal="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <RatingBar
        android:id="@+id/rbRating"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:isIndicator="true"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/tvRatingTitle"
        android:numStars="5"
        android:rating="2.5"
        android:stepSize="0.1" />

    <CheckBox
        android:id="@+id/chkMissing"
        android:text="Zaznacz jeśli nie ma"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/rbRating"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</RelativeLayout>

I've also tried switching to android.support.v7.widget.AppCompatRatingBar, but it doesn't make any difference.

EDIT:

@Muhib Pirani solution seems to be working, but I have 2 small issues:

1) on Nexus 6P the first layer of star is offsetted by few pixels (zoom in to see):

2) On Samsung Galaxy J3 (2016) it looks like this:

I'm fine with borders, but I'd like them to be green (not gray, the background should be gray) in the empty stars as well.

Capture the view hierarchy via `Tools -> Android -> Layout Inspector`, and see what's the key difference between those `RatingBar`s. Once you find the attribute that results in this behavior, it would be easier to find the actual cause. It seems like it's the alpha channel that is changed, or somehow a tint is applied. — azizbekian, Jun 05 '17 at 07:59

score 5 · Answer 1 · edited Jun 12 '17 at 05:31

5

I also faced the same problem. I had to programmatically set colors to RatingBar like this and it worked:

LayerDrawable layerDrawable = (LayerDrawable) ratingBar.getProgressDrawable();
layerDrawable.getDrawable(2).setColorFilter(ContextCompat.getColor(context, R.color.colorPrimaryDark), PorterDuff.Mode.SRC_ATOP);
layerDrawable.getDrawable(1).setColorFilter(ContextCompat.getColor(context, R.color.colorPrimaryDark), PorterDuff.Mode.SRC_ATOP);
layerDrawable.getDrawable(0).setColorFilter(ContextCompat.getColor(context, R.color.editTextBor), PorterDuff.Mode.SRC_ATOP);//when not selected color.

Keep layerDrawable.getDrawable(2) and layerDrawable.getDrawable(1) same color.

edited Jun 12 '17 at 05:31

azizbekian

60,783
13
169
249

answered Jun 05 '17 at 07:02

Muhib Pirani

765
1
6
15

try setting layerDrawable.getDrawable(0).setColorFilter(ContextCompat.getColor(context, android.R.color.transparent), PorterDuff.Mode.SRC_ATOP); – Muhib Pirani Jun 05 '17 at 08:49
Then it looks like this: http://imgur.com/a/czcJC (Nexus 6P) and http://imgur.com/a/wUvgH (Samsung Galaxy J3) - not what I expect. – Makalele Jun 05 '17 at 10:41
i'm checking it on Oneplus x device , its working fine, i guess rating bar needs some improvement. – Muhib Pirani Jun 05 '17 at 12:06
also check this https://stackoverflow.com/questions/35378098/how-can-i-set-the-color-of-android-rating-bars-stroke-not-the-color-of-the-st/37158074 – Muhib Pirani Jun 06 '17 at 12:35

score 1 · Answer 2 · answered Jun 12 '17 at 02:23

1

I also had problems with the native RatingBar, so I decided to use MaterialRatingBar. It resolved all my problems.

Hope it helps

answered Jun 12 '17 at 02:23

fdelafuente

1,114
1
13
24

RatingBar is getting semi-transparent

2 Answers2