How to end TextView with 3 dots by using maxLength

Question

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" />

see : http://stackoverflow.com/questions/1666736/android-textview-automatically-truncate-and-replace-last-3-char-of-string — HelmiB, Oct 02 '12 at 08:04
@Yaniv : you have try `android:ellipsize="marquee"` instead of `android:ellipsize="end"` ? — ρяσѕρєя K, Oct 02 '12 at 08:05
@HelmiB: It is not the same problem since there is no use there with maxLength. Anyway, I tried and it didn't solve it. Thanks — Yaniv, Oct 02 '12 at 08:12
how about setting the layout_width in sp? (15 x width of letter with font size 16sp) — Tamir Scherzer, Oct 02 '12 at 08:15
It's the same for me as giving it a dp width, can't do that. Thanks. — Yaniv, Oct 02 '12 at 11:02
@Ravi I didn't find any good solution for that, I've cut the string by code and not by XML. It is something that I didn't want to do, but no other choice. — Yaniv, Apr 18 '13 at 05:22
@Yaniv I had a similar requirement - posted my solution as an answer just incase. — Ravi, Apr 18 '13 at 17:49

score 86 · Answer 1 · edited Jul 27 '16 at 11:12

86

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.

edited Jul 27 '16 at 11:12

Ali Bdeir

4,151
10
57
117

answered Jan 01 '14 at 12:19

Kirk

4,957
2
32
59

1

I noticed today that `singleLine="true"` and `maxlines="1"` behave differently when used with `maxWidth` and `ellipsize` - for some reason it truncates more with `maxlines` - don't know why though. – NemoOudeis Nov 30 '16 at 06:14
9

@Kirk maxEms is not working for restricting the number of digits, whereas, using maxLength, doesn't show dots. – Narendra Singh Feb 04 '17 at 11:14
2

@king possibly deprecated. At the time of answering this question, It was a working solution. If anybody knows the latest patch to this, Kindly update my answer. – Kirk Feb 04 '17 at 11:23
Ems != number of characters – AlexAndro May 02 '18 at 13:50
@AlexAndro what's that dude? – Kirk May 02 '18 at 19:23
@Kirk Just an info! It seems to me that some people think is the same thing. – AlexAndro May 03 '18 at 08:44
1

This doesn't solve the problem, as `maxEms` limit the width to fixed value. It will work only if you are developin app for certain resolution, which is usually never. – Firzen May 01 '19 at 15:41
@Firzen Answer is targetted for the OP's question, not for you. In my answer, I didn't state what EMS does or how it behaves. Also, it's called EMS, not pixel limiter. You might be expecting a different answer to your question. Hope you understand the difference as well before you downvote. – Kirk May 06 '19 at 07:58

score 24 · Answer 2 · answered Jan 07 '15 at 09:52

24

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

answered Jan 07 '15 at 09:52

AZ_

21,688
25
143
191

This is working in spite that maxLines="1" is specified because maxEms is limiting the length of string put in TextView. This kind of limitation is also specified by maxLength if it goes beyond the width of the TextView if it is specified say 150dp (then it shows the ellipsis). – Abhinav Saxena Dec 05 '21 at 15:33

Ravi · Answer 3 · 2014-01-10T15:47:17.137

18

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>

edited Jan 10 '14 at 15:47

answered Apr 18 '13 at 17:47

Ravi

3,719
6
28
40

I only had to use `toLeftOf`. – theblang Jan 22 '14 at 18:56
It will not work until and unless layout_width is match_parent. It will also not work if there are three or more text views in a row (for example) and layout_width is set to wrap_content. Therefore you should limit the size of the text view's width by weight, max_length, lines, or ems. – Abhinav Saxena Dec 05 '21 at 15:37

score 14 · Answer 4 · answered Oct 20 '16 at 07:43

14

You can use

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

Only this works for me.

answered Oct 20 '16 at 07:43

Zhou Hongbo

1,297
13
25

score 8 · Answer 5 · answered Aug 22 '15 at 12:38

8

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.

answered Aug 22 '15 at 12:38

Enzokie

7,365
6
33
39

When i am using android:maxLines="3" then how it is possible in end line of text see "..." ? – Praveen Kumar Verma Apr 30 '16 at 14:49
@PraveenKumarVerma sorry I dont get your question, can you add more details. Thankyou – Enzokie Apr 30 '16 at 14:51
I mean, I have TextView in set 3 lines of text and last 3rd line set "..." dotted. – Praveen Kumar Verma Apr 30 '16 at 21:12
@PraveenKumarVerma I believe it will work, the 3 dots only appears if the text overflow otherwise it will not. In my example I have only 1 line and my text seems too long for it, so a 3 dots appears. – Enzokie May 01 '16 at 01:37
yes I am trying solved my problem. Thanks neferpitou. – Praveen Kumar Verma May 01 '16 at 12:58
You should probably use paddingEnd instead of paddingRight to account for right-to-left languages. But otherwise great suggestion, this is what I wanted. :) – Tony Wickham Aug 10 '17 at 17:24

score 7 · Answer 6 · answered Jan 01 '14 at 11:47

7

use this android:ellipsize="end"

answered Jan 01 '14 at 11:47

Mahmoud Hashim

550
5
13

score 3 · Answer 7 · answered Jan 25 '20 at 00:18

3

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

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

answered Jan 25 '20 at 00:18

John T

814
10
17

Benjamin Livinus · Answer 8 · 2018-12-20T09:48:43.747

2

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).

edited Dec 20 '18 at 09:48

answered Aug 23 '17 at 13:42

Benjamin Livinus

39
3

score 0 · Answer 9 · answered Feb 24 '14 at 12:03

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.

score 0 · Answer 10 · answered Apr 06 '17 at 21:39

0

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

answered Apr 06 '17 at 21:39

Horatio

1,695
1
18
27

score -1 · Answer 11 · answered Apr 23 '13 at 13:52

-1

remove the line from xml

android:lines="1"
        android:maxLines="1"

answered Apr 23 '13 at 13:52

Muhammad Aamir Ali

20,419
10
66
57

How to end TextView with 3 dots by using maxLength

11 Answers11

Linked