How to make Android's ellipsizing more "even" with multiple TextViews?

35 views Asked by At

I have two TextViews in a TableLayout. Both have android:ellipsize="end" and are in android:shrinkColumns. The goal is that if there is enough space, both TextViews will be shown in full (without taking up extra space), but if there isn't enough space, they should both ellipsize.

This works for the most part, except when one TextView is significantly longer than the other. In that case, the shorter TextView will be "squished" by the larger TextView, often to the point of just being ....

Is there a way to have Android apply the ellipsize more evenly (with regard to screen space)? I do not know which TextView is longer at runtime since they're loaded from the internet. I also cannot use a minimum width as sometimes the text is just really short.

Example:


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

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

        <TableRow>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:maxLines="1"
                android:text="Short" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:maxLines="1"
                android:text="Long Text" />

        </TableRow>

    </TableLayout>

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

        <TableRow>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:maxLines="1"
                android:text="Short" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:maxLines="1"
                android:text="Long Long Long Long Long Long Long Long Text" />

        </TableRow>

    </TableLayout>

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

        <TableRow>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:maxLines="1"
                android:text="Short" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:maxLines="1"
                android:text="Long Long Long Long Long Long Long Long Long Long Long Long Long Text" />

        </TableRow>

    </TableLayout>

</LinearLayout>

Screenshot Of Example

As can be seen in the example, the more text I add to the "Long Text" TextView, the less of the "Short" TextView is visible. My goal is to have it always be something like row #2, both ellipsized, but at least some content visible in both.

0

There are 0 answers