TextView objects and truncation on Android screens (designing for multiple screens)

Question

Here is a short question about how best to handle text truncation. Do you know a good way to show the full string to the user when it gets cut off by a TextView?

Any size screen might chop the text of a long string set in a TextView. The problem becomes more noticeable when an app is supporting multiple sizes, specifically normal and large size screens.

One good suggestion is to make the text view scrollable. My problem with that suggestion is that I have planned swipe navigation interactions in all four directions and that complicates the text view scroll. I raised this question in Android Office hours today. Any suggestions, especially those based on existing solutions, would be welcome. Thanks in advance...

I'm a little confused. Why not just make the appear on multiple lines? — mtmurdock, May 23 '12 at 22:12
Another suggestion could be to do an auto scale TextView: http://stackoverflow.com/questions/5033012/auto-scale-textview-text-to-fit-within-bounds — Pablo, May 23 '12 at 23:12

Gökhan Barış Aker · Answer 1 · 2012-05-23T22:53:06.923

0

There is a perfect guideline for you, that suggest adjusting text size to corresponding screen size. Here you can find it.

Also there are attributes you might use with text view;

small

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />

medium

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />

large

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />

edited May 23 '12 at 22:53

answered May 23 '12 at 22:40

Gökhan Barış Aker

4,445
5
25
35

Thanks but sizing the textview or the text will not do the trick - the length of the strings is a variable, as is the screen size. There are two textview objects on the same screen. They are displayed in a fixed size view group. If both happen to be long strings at the same time they get cut. In the case when there is too much text and truncation occurs, how can I display it to the user? – Beth Mezias May 24 '12 at 05:08
@Beth . (Bad solution ^^) --> Assuming that you know the variable length and you know the screen resolution via DisplayMetrics. Then you may write something that finds the optimal text size. (Better solution) --> Use TextView with multiple lines. Good Luck! – Gökhan Barış Aker May 24 '12 at 08:02
Also Pablo mentioned the same thing with my bad solution in your questions comment, i guess. – Gökhan Barış Aker May 24 '12 at 08:04
I am using multiple lines. However, the size of the data can and will exceed the number of lines that can fit on a single screen. Even the smallest font size in the largest screen might be cut off. Thanks for allowing me to clarify. I am looking for a solution beyond dynamic sizing since I know ahead of time that the text will be cut. – Beth Mezias May 24 '12 at 16:35

score 0 · Answer 2 · answered May 23 '12 at 23:08

0

You could use this to truncate your text:

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is your text"
android:ellipsize="marquee" android:lines="1 />

answered May 23 '12 at 23:08

Pablo

1,368
12
18

Yes, thanks, that's right. Two textviews that will truncate in my layout are the reason for this post. I want to create a good user interaction to show the full text when the ellipsize tag truncates one or both of my textviews). The scrolling textview solution has 2 problems (scrollview has side effects and scrolling will probably break my swipe/fling navigation. Any other ideas? – Beth Mezias May 24 '12 at 05:19

Beth Mezias · Accepted Answer · 2012-05-31T03:44:38.763

One way to hande the problem was to add a property to the textview that will make it scrollable without adding code:

android:lines="3"
android:textIsSelectable="true" 
android:fadeScrollbars="false"

This was suggested by a member of the Android Dev Relations team during office hours. However, when tested, scroll was not working on Android version 2.2.2. My new solution is to declare the textview clickable and use the onClick callback to open a dialog.

So now I ellipsize the text (no more scroll tags) to give the user a clear indication that the text got cut off. Here is the xml:

android:lines="3"
android:clickable="true"
android:onClick="showDef"
android:ellipsize="start"
android:isScrollContainer="false"

and here is the showDef method:

public void showDef(View v) {
    AlertDialog.Builder builder = new AlertDialog.Builder(this);
    builder.setMessage("same text as was set in the text view")
        .setCancelable(false)
        .setNegativeButton("Clear", new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int id) {
                dialog.cancel();
           }
        });

AlertDialog alert = builder.create();
alert.show()

I like this solution better than simple scrolling in the case where the view group containing the textview has a fixed size. I hope it works for you, too,.

TextView objects and truncation on Android screens (designing for multiple screens)

3 Answers3