How to end TextView with 3 dots by using maxLength

65.4k Views Asked by At

I have a TextView in my layout which is wrap_content in layout_width. It is limited to maximum of 15 characters so I'm using maxLength.

I need to end this TextView with 3 dots (...) and it happens only when I give the layout_width a fixed size in dp, something that I don't want to do.

I know it is possible programmatically by trimming the string after the 15th character and then adding the 3 dots, but I prefer to do that by XML.

Any idea how to end the text with 3 dots and leave it wrap_content?

<TextView
    android:id="@+id/inbox_contactName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:lines="1"
    android:maxLines="1"
    android:ellipsize="end"
    android:singleLine="true"
    android:maxLength="15"
    android:textColor="#0670b4"
    android:textSize="16sp" />
11

There are 11 best solutions below

0
On

use this android:ellipsize="end"

8
On

This will solve your problem, Use ellipsize Property in your XML Code

android:ellipsize="end" <!-- This makes the magic ... thing -->
android:maxEms="15" <!-- Limit of the Text -->
android:singleLine="true" <!-- In case if you want everything in one line -->

Edit: singleLine is deprecated. Use maxlines="1" instead.

6
On

One of the easiest way is to add Right Padding + Ellipsize

<TextView
            android:id="@+id/txtvw_contentcell_subhead"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Polem sampler, Lorem Ipsum golep tolem burop yemit noski"
            android:ellipsize="end"
            android:maxLines="1"
            android:textColor="@color/caption_black_color"
            android:textSize="@dimen/caption_size"
            android:paddingRight="40dp"/>

Here is an example Subtitle Text with char limit. enter image description here

1
On

You cannot use both maxLength and Ellipsize although you can define Maximum EMS see the example below

<TextView
        android:id="@+id/tv_hist_source_lang"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:maxEms="8"
        android:maxLines="1"
        android:text="TextView"
        android:textAppearance="?android:attr/textAppearanceMedium" />

It looks like this

0
On

remove the line from xml

android:lines="1"
        android:maxLines="1"
0
On

I needed to do this with Radio Button and I wanted to limit the size to one line. When I used Android:singleline="true", radio button's check circle disappeared. Here's the code that finally worked:

android:ellipsize="end"
android:maxLines="1"

There's no need to set ems. This will probably work also in TextView and other UI components. Hope this helps to someone.

2
On

I gather (from comment) that @Yaniv already solved it using code - but this is the right way to do it (with xml). May help other users who land here. Trick is to use both toleftof and torightof.

<RelativeLayout>
...
 <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:singleLine="true"
        android:layout_toRightOf="@id/some_element1"
        android:layout_toLeftOf="@id/some_element2"/>
...
<RelativeLayout>
0
On

You can use

android:maxWidth="100dp"
android:maxLines="1"
android:ellipsize="end"

Only this works for me.

0
On

Very Important: ellipsize = "end" only works when maxLength is set to a value that is more than the number of characters on one line. You can use wrap_content if you align the TextView's end and start to any other view(s).

0
On

Tried most of the solutions above. Using maxWidth was the key for me:

android:maxWidth="100dp"
android:maxLines="1"
android:ellipsize="end"
0
On

You can just modify the String when it's length is above 20 to add the ellipsize.