How to remove Irregularity in layout of items in listview in android?

Question

This is how the cart screen looks like. The layout changes as per the length of item name. I want to keep a fixed ratio for all columns in the listview and at the same time, keep the size of button fixed. How to achieve this ?

Below is the Screenshoot and layout code:

]1

Layout file:

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*"
android:background="#ffffff">
<TableRow>
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/cartlist_layout"
android:orientation="horizontal">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/t1"
    android:textStyle="normal|bold"
    android:padding="5dip"
    android:layout_alignParentLeft="true"
    android:layout_toLeftOf="@+id/t2"
    />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/t2"
    android:padding="5dip"
    android:textStyle="normal|bold"
    android:layout_centerHorizontal="true"
    />

    <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_toRightOf="@+id/t2"
    android:id="@+id/t3"
    android:textStyle="normal|bold" />

    <Button
        android:layout_width="5dp"
        android:layout_height="50dp"
        android:id="@+id/button6"
        android:background="@drawable/delete1" />
</TableRow>>
</TableLayout>

Edit1: The Listview layout code:

<?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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fragment_mycart">
    <ListView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/listView1" />

   <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_margin="16dp"

        android:clickable="true"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:background="@color/colorPrimary"
        app:backgroundTint="@android:color/holo_orange_light"
        app:borderWidth="0dp"
        app:elevation="6dp"
        app:fabSize="normal"
        app:srcCompat="@drawable/cart" />
  </RelativeLayout>

Answer 1

You can use a LinearLayout as root view of the item instead of TableLayout. You can add weights to the views inside the LinearLayout.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:background="#ffffff">

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="3"
        android:id="@+id/t1"
        android:textStyle="normal|bold"
        android:padding="5dip"
        android:maxLines="1"
        android:ellipsize="end" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:id="@+id/t2"
        android:padding="5dip"
        android:textStyle="normal|bold" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_weight="1"
        android:id="@+id/t3"
        android:textStyle="normal|bold" />

    <LinearLayout
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="wrap_content" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button6"
            android:background="@drawable/delete1" />

    </LinearLayout>

</LinearLayout>

Note : You may want to adjust the weights a bit.

Answer 2

Use LinearLayout instead

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

        <TextView
            android:id="@+id/t1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:padding="5dip"
            android:text="text1"
            android:textStyle="normal|bold" />

        <TextView
            android:id="@+id/t2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:padding="5dip"
            android:text="text2"
            android:textStyle="normal|bold" />

        <TextView
            android:id="@+id/t3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:padding="5dip"
            android:text="text3"
            android:textStyle="normal|bold" />

        <Button
            android:id="@+id/button6"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@android:drawable/ic_input_add" />

    </LinearLayout>