Android - ListView Changes View Attribute

Question

I have a ListView and I wanted to place a small rectangle on the side of each item. To do so I made the following rendered layout:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="3dp">

    <View
        android:layout_width="5dp"
        android:layout_height="fill_parent"
        android:id="@+id/item_color_image"
        android:background="@color/wallet_holo_blue_light"
        android:layout_marginRight="3dp"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:layout_marginTop="3dp"
        android:layout_marginBottom="3dp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/item_icon_image"
        android:src="@drawable/m"
        android:layout_toRightOf="@+id/item_color_image"
        android:layout_centerVertical="true" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Business Name"
        android:id="@+id/item_title_text"
        android:layout_toRightOf="@+id/item_icon_image"
        android:layout_marginLeft="3dp"
        android:textStyle="bold"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:layout_alignTop="@+id/item_icon_image" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:text="Distance"
        android:id="@+id/item_distance_text"
        android:layout_alignLeft="@+id/item_title_text"
        android:layout_alignBottom="@+id/item_icon_image"
        android:layout_marginBottom="-10dp" />
</RelativeLayout>

When I inflate this layout in a frame, it works just fine.....BUT when I inflate it inside a ListView I get this:

The rectangle's height is being ignored to match the container's height.

I inflate it using this code:

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        View itemView = convertView;

        if (itemView == null) {
            itemView = inflater.inflate(R.layout.business_item_view, parent, false);
        }

        Business currentBusiness = businesses.get(position);

        ImageView icon = (ImageView) itemView.findViewById(R.id.item_icon_image);
        icon.setImageBitmap(currentBusiness.getIcon());
        TextView name = (TextView) itemView.findViewById(R.id.item_title_text);
        name.setText(currentBusiness.getName());
        TextView distance = (TextView) itemView.findViewById(R.id.item_distance_text);
        distance.setText("2 Km");  // TODO: Calculate distance

        return itemView;
    }

How can I fix this? Thanks!!

Answer 1

Having your root item for a ListView row be match_parent for height doesn't make sense; each item would fill the ListView. I expect that's automatically being changed to wrap_content somewhere.

And RelativeLayouts don't support children with match_parent for height if the RelativeLayout's height is wrap_content. It works with LinearLayouts, so you should look into switching to that. Source: combining wrap_content on parent and fill_parent on child