Android custum listview layout issue

Question

I am struggling to get my custom listview row layout to handle differing image sizes whilst keeping its overall shape correct.

I want to achieve the following Listview row with differing images of differing sizes. Each row should be of identical size by scaling its images to a specific size.

My desired row layout

My code (note i have tried several different methods but all either don't scale correctly (ie one image bigger than the other when it shouldn't be) or they dont' stay in correct position relative to one another.

<ImageView
    android:id="@+id/iv_logo"
    android:layout_width="match_parent"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:src="@drawable/logo1" />

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:layout_alignParentTop="true"
    android:layout_weight="1"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/league_name"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginRight="6dip"
        android:layout_weight="1"
        android:text="Text" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/iv_image1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginRight="6dip"
            android:layout_weight="1"
            android:src="@drawable/image1" />

        <ImageView
            android:id="@+id/iv_image2"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginRight="6dip"
            android:layout_weight="1"
            android:src="@drawable/image2" />

        <ImageView
            android:id="@+id/iv_image3"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginRight="6dip"
            android:layout_weight="1"
            android:src="@drawable/image3" />
    </LinearLayout>
</LinearLayout>

What this yeilds is several prpoblems, spaces around each imagview or textview and not scaling to same size as designed in the xml layout...

Answer 1

try with this:

<ImageView
    android:id="@+id/iv_logo"
    android:layout_width="0px"
    android:layout_height="match_parent"
    android:src="@drawable/logo1" android:layout_weight="3"/>

<LinearLayout
    android:layout_width="0px"
    android:layout_height="match_parent"
    android:orientation="vertical" android:layout_weight="7">

    <TextView
        android:id="@+id/league_name"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginRight="6dip"
        android:layout_weight="1"
        android:text="Text" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal" android:weightSum="3">

        <ImageView
            android:id="@+id/iv_image1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginRight="6dip"
            android:layout_weight="1"
            android:src="@drawable/image1" />

        <ImageView
            android:id="@+id/iv_image2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginRight="6dip"
            android:layout_weight="1"
            android:src="@drawable/image2" />

        <ImageView
            android:id="@+id/iv_image3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginRight="6dip"
            android:layout_weight="1"
            android:src="@drawable/image3" />
    </LinearLayout>
</LinearLayout>

Answer 2

I used RelativeLayout and following is the solution. You will have to edit the xml little bit as I used background colors. Anyways, check whether this works; if not I will start looking into LinearLayout solution:

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="128dp"
    >
<ImageView
android:id="@+id/iv_logo"
android:layout_width="128dp"
android:layout_height="128dp"
android:background="@color/blue" 
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
/>
<LinearLayout
android:layout_toRightOf="@id/iv_logo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@color/red"

>
<TextView
    android:id="@+id/league_name"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:background="@color/orange"
    android:textColor="@color/white"
    android:text="Text" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="3"
    android:orientation="horizontal"
    android:background="@color/black"
     >
   <ImageView
        android:id="@+id/iv_image1"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@color/gray" />

    <ImageView
        android:id="@+id/iv_image2"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@color/yellow" />

    <ImageView
        android:id="@+id/iv_image3"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@color/green" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>

Answer 3

// Try this way,hope this will help you...

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="5dp" >

    <ImageView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:src="@drawable/ic_launcher"
        android:layout_weight="0.25"
        android:scaleType="fitXY"/>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.75"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="TextView"
            android:gravity="center"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <ImageView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/ic_launcher"/>
            <ImageView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/ic_launcher"/>
            <ImageView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:scaleType="fitXY"
                android:src="@drawable/ic_launcher"/>
            </LinearLayout>
        </LinearLayout>
</LinearLayout>