How to prevent "wrap_content" text view from pushing another view out of sight?

Question

I have two text views in a layout. I would like to display them next to each other like so:

|[TextView1][TextView2]                          |

Width of the first text view can vary dramatically. From several symbols up to a 100 symbols, but I would like to ellipsize it if it is too long and TextView2 should always be visible. Like so:

|[TextView1TextView1Tex...][TextView2]|

I have tried the following layout, but it displays TextView2 always at the end of the screen:

[TextView1]                          [TextView2]|

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

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:singleLine="true"
            android:maxLines="1"
            android:ellipsize="end"/>

        <TextView
            android:layout_marginLeft="5dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
    </LinearLayout>

I have tried to change the width of TextView1 from 0 to wrap_content, but then it pushes the TextView2 out of the sight like so:

|[TextView1TextView1TextView1Text...]|

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:singleLine="true"
            android:maxLines="1"
            android:ellipsize="end"/>

        <TextView
            android:layout_marginLeft="5dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
    </LinearLayout>

Any help would be much appreciated.

Answer 1

It may be a overkill, but TableLayout does the trick.

<TableLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:shrinkColumns="0">

        <TableRow
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            <TextView
                    android:id="@+id/firstTextView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:maxLines="1"
                    android:ellipsize="end"/>

            <TextView
                    android:id="@+id/secondTextView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:maxLines="1"/>

        </TableRow>
    </TableLayout>

android:shrinkColumns="0" is the catch here. It tells the table to only shrink the first column while keeping the others untouched. The result is that the system will only resize the first column, i.e. your first TextView.

Answer 2

Not very proud of this solution, but it does the trick, I have set width of both TextView1 and TextView2 to "wrap_content"

Then in the code I have set maxWidth of TextView1 to 80% of it's parent like so:

view.setMaxWidth((int)(((View)view.getParent()).getWidth() * 0.8));