CODEWITHSUNDEEP
androidandroid-viewratingbar
Makalele
Makalele

Reputation: 7531

RatingBar is getting semi-transparent

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:

enter image description here

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):

enter image description here

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

enter image description here

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.

Upvotes: 13

Views: 1158

Answers (2)

Muhib Pirani
Muhib Pirani

Reputation: 775

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.

Upvotes: 5

fdelafuente
fdelafuente

Reputation: 1122

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

Hope it helps

Upvotes: 1

Related Questions