Search code examples
androidtextviewellipsisnexus-5

How to fix text overflowing TextView with padding android:ellipsize="marquee"


On some Android devices (LG Google Nexus 5 with Android L and M) a TextView with android:ellipsize="marquee" and padding results in the text overflowing the textview. It occurs on the right side but not on the left side of the TextView, though, while the padding is applied to both the left and the right side.

screenshot

It does not occur on Samsung Galaxy S3 and S6 with Android K and L, respectively.

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:paddingTop="2dp"
android:paddingBottom="2dp"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:singleLine="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:scrollHorizontally="true"
android:freezesText="true"
android:alpha="0.85"
android:background="@color/by433_gray_darker"
android:textColor="@color/white"
android:textSize="11sp" />

What can I do to fix or work around this?


Solution

  • Your issue is a bug of Android and already reported and assigned on Android Open Source Project:

    Your workaround may look like this:

    <FrameLayout android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:paddingTop="2dp"
                 android:paddingBottom="2dp"
                 android:paddingLeft="4dp"
                 android:paddingRight="4dp"
                 android:layout_marginBottom="1dp"
                 android:background="@color/by433_gray_darker">
        <TextView
            android:id="@+id/textId"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:singleLine="true"
            android:ellipsize="marquee"
            android:marqueeRepeatLimit="marquee_forever"
            android:scrollHorizontally="true"
            android:freezesText="false"
            android:alpha="0.85"
            android:text="super nice text text text text text text text text text text text text text text text text text"
            android:textColor="@color/white"
            android:textSize="11sp" />
    </FrameLayout>
    

    So, the idea is to have a wrapper container with paddings, margins and background. (It shouldn't be much of performance overhead, if you have only couple of such views)


    Original incorrect answer (Though there were two TextViews) The issue might be due to combination of so many attributes on your TextView. Here are some suggestions:

    1. First try to remove attribute one by one checking the result
    2. You can try to specify paddings on your container instead of text views
    3. From your layout it seems that you can try something like this instead of "match_parent" on your text views:

      <LinearLayout android:orientation="horizontal" ...>
          <TextView android:layout_width="0dp" android:layout_weight="1" ... />
          <TextView android:layout_width="0dp" android:layout_weight="1" ... />
      </LinearLayout>