Search code examples
androidlistviewratingandroid-relativelayout

Repeating RatingBar wonkiness in a ListView using RelativeLayout


Here is some xml for a row in a ListView:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:padding="6dip">
<ImageView android:id="@+id/cover" android:layout_width="64dip"
    android:layout_height="64dip" android:layout_alignParentTop="true"
    android:layout_alignParentBottom="true" android:layout_marginRight="6dip" />
<TextView android:id="@+id/loan" style="@style/DetailsLabel.Small"
    android:layout_width="fill_parent" android:layout_height="wrap_content"
    android:layout_toRightOf="@id/cover" android:layout_alignParentRight="true" />
<TextView android:id="@+id/title" style="@style/DetailsLabel.Small"
    android:layout_width="fill_parent" android:layout_height="wrap_content"
    android:layout_toRightOf="@id/cover" android:layout_alignParentRight="true"
    android:layout_alignParentTop="true" android:layout_above="@id/loan"
    android:layout_alignWithParentIfMissing="true" android:gravity="center_vertical"
    android:singleLine="true" android:ellipsize="end" />
<RatingBar android:id="@+id/ratingBarIndicator" style="?android:attr/ratingBarStyleSmall"
    android:layout_width="fill_parent" android:layout_height="wrap_content"
    android:layout_toRightOf="@id/cover" android:layout_below="@id/title"
    android:layout_alignParentRight="true" android:gravity="center_vertical" />

And here is the result: alt text

(That's a plain Donut 1.6).

What I'm trying to achieve is a cover on the left, followed by a title, rating bar, and optional loan status on the right. As you can see the RatingBar is repeating endlessly (it should only have five stars); and whenever there IS a loan status set, the title disappears. How can I fix my XML to achieve the effect I want?


Solution

  • I'd start with fixing rating bar as following:

     <RatingBar
                android:id="@+id/ratingBarIndicator"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                style="?android:attr/ratingBarStyleSmall"
                android:numStars="5"
                android:isIndicator="true" />
    

    Then align it to the right of its parent ( optionally with android:layout_centerVertical="true" ). After that position your title to the right of cover and to the left of rating bar ) And then you can have you Loaned label to be, for example, below title and to the right of cover.