Different Border Color?

[JuanCarniglia]

Is it possible to have a different border color? I see some styles for RatingBar that have many different colors and styles, but the border seems to be something very much bound to the Progress Drawable or the Indeterminate Drawable.

It would be great, for me, being able to control the border color at runtime.

[zhanghai]

Maybe you mean app:mrb_progressTint, app:mrb_secondaryProgressTint and app:mrb_progressBackgroundTint - they are backword-compatible versions of their framework counterparts.

[RobertoAlvarezCeballos]

I had the same question. Fixed using these two attributes:

app:mrb_progressBackgroundTint="#FFF"
app:mrb_indeterminateTint="#FFF"

[kelalaka153]

I've found that the border's thickness becomes smaller when the progress touched the star. I've used this style to test

<style name="RatingBar" parent="Theme.AppCompat">
        <item name="mrb_progressTint">@color/White</item>
        <item name="mrb_secondaryProgressTint">@color/Black</item>
        <item name="mrb_progressBackgroundTint">@color/Black</item>
        <item name="mrb_fillBackgroundStars">false</item>
        <item name="mrb_indeterminateTint">@color/Red</item>
</style>

The result is

I can see that we don't have a true border that has the same thickness all the time.

Also, I've found out that the mrb_indeterminateTint has not effect.

[zhanghai]

Can you reproduce this with the sample app? Meanwhile what AndroidX AppCompat version are you using?

[kelalaka153]

At first the sample app is working as expected. When I put the white color, it showed the same result. mrb_secondaryProgressTint defines the thin border color.

I've tried to migrate the sample app into Android X libraries, since I'm using it under Android X. I've found out that it is not an easy task, and give up after this error.

The project 'MaterialRatingBar-master' may be using a version of the Android Gradle plug-in that does not contain the method (e.g. 'testCompile' was added in 1.1.0).

My original application (the above post) was using the below dependencies;

dependencies {
    api fileTree(dir: 'libs', include: ['*.jar'])
    api 'androidx.appcompat:appcompat:1.1.0-beta01'
    api 'androidx.constraintlayout:constraintlayout:1.1.3'
    api 'com.google.android.material:material:1.1.0-alpha07'
    api 'androidx.legacy:legacy-support-v4:1.0.0'
    api 'junit:junit:4.12'

    androidTestImplementation 'androidx.test:runner:1.2.0'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.3.0-alpha01'
    api 'me.zhanghai.android.materialratingbar:library:1.3.2'
    implementation 'com.heinrichreimersoftware:material-intro:1.6'
}

[zhanghai]

When I put the white color, it showed the same result.

Thanks for the context, this reminded me of why it isn't working properly in your case.

Basically the narrow border you saw is caused by antialiasing, and the fact that RatingBar (or just, AbsProgressBar) draws the progress drawable (in this case a white star) over the progress background drawable (in this case a hollow star with black border). Due to antialiasing, the pixels sitting on the border of both stars are semi-transparent, and when the semi-transparent white is blended over the semi-transparent black pixels, it cannot cover them entirely. Thus the 1px black (actually grey) border.

This is just how graphics works and cannot be "properly" fixed, and applies to either this library or the framework RatingBar. This library mainly just replaced the default drawables for framework RatingBar, along with some nice add-ons.

A workaround for this could be, replacing the progress drawable (in your case a white star) to be slightly bigger. This way it can cover the star on progress background entirely. To do so, include a copy of (mrb_star_icon_black_36dp.xml)[https://github.com/zhanghai/MaterialRatingBar/blob/master/library/src/main/res/drawable/mrb_star_icon_black_36dp.xml] in your project app/src/main/res/drawable/ to override it, and scale up a bit the SVG path for the star in that file. SVG editors like like Inkscape or Illustrator can achieve this easily, and you just need to copy back the path data. But since this is unrelated to this library (you'll need to do the same thing even if you use framwork RatingBar), I'm not going to go into the details.

This is an entirely different issue than the original one, so please consider opening a new issue the next time :) This way we don't have to bother people who subscribed to the original issue.