TextView doesn't split line correctly

Question

I have a problem with something that "should" work but it simply doesn't.

TextView inside TableRow does not provide line break where it should, instead this same TextView is the same width as TableRow, ignoring that one TextView is already there and taking some space.

Here is example:

<?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:background="@color/white" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        android:orientation="vertical"
        android:weightSum="1" >

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="0px"
            android:layout_weight="0.4"
            android:scrollbars="vertical" >

            <TableLayout
                android:id="@+id/tableAtTest"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >

                <TableRow
                    android:id="@+id/firstContainer"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:padding="2dp" >

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:gravity="center_vertical"
                        android:text="first description"
                        android:textColor="#000000"
                        android:textSize="@dimen/smallSize"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/firstText"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:text="test test test test test test test test test test test test test test test test test test test test test test "
                        android:textColor="#000000"
                        android:textSize="@dimen/smallSize" />
                </TableRow>

                <TableRow
                    android:id="@+id/secondContainer"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:padding="2dp" >

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:gravity="center_vertical"
                        android:text="second description"
                        android:textColor="#000000"
                        android:textSize="@dimen/smallSize"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/secondText"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:text="test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 test2 "
                        android:textColor="#000000"
                        android:textSize="@dimen/smallSize" />
                </TableRow>
            </TableLayout>
        </ScrollView>

        <android.support.v4.view.ViewPager
            xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/pagerOnTest"
            android:layout_width="match_parent"
            android:layout_height="0px"
            android:layout_weight="0.6"
            tools:context=".TestActivity" >
        </android.support.v4.view.ViewPager>
    </LinearLayout>
</RelativeLayout>

If you look at width taken by fields @id/firstText and @id/secondText you'll see that right side of TextView is outside screen.

Any help would be appreciated around this. Thanks!

Answer 1

This should work for you, using weight sum and layout weight and setting the table width to match parent and the textview width to 0dp, so it will dynamically render:

<TableLayout
    android:id="@+id/tableAtTest"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:weightSum="2">

    <TableRow
        android:id="@+id/firstContainer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="2dp">

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3dp"
            android:gravity="center_vertical"
            android:text="first description"
            android:textColor="#000000"
            android:textStyle="bold"
            android:layout_weight="1"/>

        <TextView
            android:id="@+id/firstText"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_margin="3dp"
            android:text="test test test test test test test test test test test test test test test test test test test test test test "
            android:textColor="#000000"
            android:layout_weight="1" />

    </TableRow>

</TableLayout>