Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android RatingBar - a complete mess

I know this is going to sound ranty, but it just feels like Android's UI components and behaviours are off the wall sometimes.

Consider the following XML:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >

    <RatingBar
    android:id="@+id/ratingBar1"
    android:style="@android:style/Widget.Holo.Light.RatingBar.Small"
    android:progress="3"
    android:max="5"
    android:numStars = "5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />


</LinearLayout>

Screenshots of how that would look on different device sizes:

Nexus S rating bar Nexus S rating bar

Tablet rating bar Tablet rating bar

Small Device rating bar Small Device rating bar

Even though it's only in the preview tool, I can confirm that's actually how it looks on the devices.

The small device behaviour is maddening. How does a RatingBar that specifies 5 stars only get 3 displayed, why not scale down the stars to fit in the window?

Thinking the wrap_content width was the issue, I switched to layout_width="fill_parent" and that didn't change the look on a small device, but it completely messed up on Tablets (so much for "numStars" of 5):

Tablet with fill_parent for width

My question is, is there a way to get proper behaviour for the RatingBar in terms of sizing? You would think the numStars or max would be sufficient but it's completely arbitrary. When the RatingBar is stretched so that it draws more stars, it adds stars and see how with a progress of 3, it draws it according to the number of stars displayed? It doesn't make sense not to adhere to numStars!

If there is no way to get logical performance from the RatingBar, are there any alternatives including 3rd party widgets? If not, I guess I could always draw 5 ImageViews and just rig it to perform accordingly.

(Keep in mind all this behaviour was exhibited with just one RatingBar in the layout - forget trying to size with other widgets/components, or utilizing your own styles. I know it's been done, but why is this the default behavior?)

like image 959
StackOverflowed Avatar asked Sep 17 '12 07:09

StackOverflowed


1 Answers

I felt the same way as you when using the stock RatingBar, so I made my own: SimpleRatingBar.

It features:

  • Fully working android:layout_width: it can be set to wrap_content, match_parent or abritary dp.
  • Arbitrary number of stars.
  • Arbitrary step size.
  • Size of stars can be controlled exactly or by setting a maximum size.
  • Customizable colors (border, fill and background of stars).
  • Customizable size separation between stars.
  • Customizable border width of stars.
  • Allows to set OnRatingBarChangeListener
  • Stars fill can be set to start from left to right or from right to left (RTL language support).
  • AnimationBuilder integrated in the view to set rating programatically with animation.

Here is a preview of it.

You can find it either in jcenter or in Maven Central. So in your build.gradle file just add to your dependencies:

compile 'com.iarcuschin:simpleratingbar:0.1.+'

I hope it's useful.

like image 87
FlyingPumba Avatar answered Nov 16 '22 23:11

FlyingPumba