Question

I am trying to design a listview with 3 textViews within it. 1 textview is for author, 2nd for date and the last one is for the comment. But I am having some problems with the layout and I am not a monster in XML. So I do need some advice. This is what my list looks like atm: http://tinypic.com/view.php?pic=357khhj&s=6

As you can see, whenever someone types more then a couple of words (like jesper’s comment) everything looks awful. Any tips how I can fix this without the rows gets all f`ked up like in the picture?. Also I only want to be able to display 2 rows of text in the comment eventhough the person actualy types, lets say 10 rows as an example. Thanx!

Here is the xml code:

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ffffff" >

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="1"
    android:weightSum="1.0" >

    <TableRow>

        <TextView
            android:id="@+id/feedback_list_item_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="5dp"
            android:layout_weight="0.8"
            android:gravity="left"
            android:shadowColor="#bdbebd"
            android:shadowDx="1.0"
            android:shadowDy="1.0"
            android:shadowRadius="0.5"
            android:text="Unknown"
            android:textColor="#000000"
            android:textSize="16dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/feedback_list_item_time"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"
            android:layout_marginTop="5dp"
            android:layout_weight="0.2"
            android:gravity="right"
            android:shadowColor="#bdbebd"
            android:shadowDx="1.0"
            android:shadowDy="1.0"
            android:shadowRadius="1.0"
            android:text="00:00"
            android:textColor="#3c6dae"
            android:textSize="16dp" />
    </TableRow>

    <TableRow>

        <TextView
            android:id="@+id/feedback_list_item_comment"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="5dp"
            android:shadowColor="#cccccc"
            android:shadowDx="1.0"
            android:shadowDy="1.0"
            android:shadowRadius="0.5"
            android:text="No comment"
            android:textColor="#222222"
            android:textSize="16dp" />
        >
    </TableRow>
</TableLayout>

</LinearLayout>

Answer 1

Use a RelativeLayout for each row of your table. E.g. try the following code in place of your two TableRows:

<RelativeLayout
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/feedback_list_item_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:gravity="left"
        android:shadowColor="#bdbebd"
        android:shadowDx="1.0"
        android:shadowDy="1.0"
        android:shadowRadius="0.5"
        android:text="Unknown"
        android:textColor="#000000"
        android:textSize="16dp"
        android:textStyle="bold"
        android:lines="1"/>

    <TextView
        android:id="@+id/feedback_list_item_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="5dp"
        android:layout_marginTop="5dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:gravity="right"
        android:shadowColor="#bdbebd"
        android:shadowDx="1.0"
        android:shadowDy="1.0"
        android:shadowRadius="1.0"
        android:text="00:00"
        android:textColor="#3c6dae"
        android:textSize="16dp" />

    <TextView
        android:id="@+id/feedback_list_item_comment"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/feedback_list_item_name"            
        android:shadowColor="#cccccc"
        android:shadowDx="1.0"
        android:shadowDy="1.0"
        android:shadowRadius="0.5"
        android:text="No comment"
        android:textColor="#222222"
        android:textSize="16dp"
        android:maxLines="2" />

</RelativeLayout>

Also, adding maxLines=”2″ to the comment TextView will limit it to two lines.