Android TextView text background color

Question

How can I achieve such an effect with an Android TextView. It looks somehow like selected text and I couldn't find something similar in the API.

This is not a background color for the view, but a background color only for the text. You can see how it stops at line breaks and has a thin white line between text lines.

Screenshot

Hi Ole, have you solved this question? I would also need the same behaviour — alfdev, Nov 12 '15 at 11:16
Possible duplicate of [TextView with background color and line spacing](https://stackoverflow.com/questions/22939862/textview-with-background-color-and-line-spacing) — Evren Ozturk, Jun 06 '17 at 13:16

score 17 · Answer 1 · answered Mar 23 '13 at 03:12

17

<TextView
android:background="#0000FF"
android:textColor="#FFFFFF" />

Would define a TextView with a blue background and white text...is that what you need?

answered Mar 23 '13 at 03:12

Tyler MacDonell

2,609
18
27

ScruffyFox · Accepted Answer · 2016-08-18T08:40:11.537

5

As far as I can see, there's no 'nice' way of doing this without overriding TextView and drawing custom paints on the view which includes the gap colour.

Even setting the lineSpacingExtra property only expands the background colour.

You could also potentially look into creating a custom spannable and use it like

Spannable str = new SpannableStringBuilder("How can I achieve such an effect with an Android TextView. It looks somehow like selected text and I couldn't find something similar in the API.");
str.setSpan(new NewSpannableClass(), 0, str.length() - 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
((TextView)findViewById(R.id.text)).setText(str);

Where NewSpannableClass is the custom spannable.

Seeing as many people are lazy to look up how to make custom spannables, here's an example

public class CustomSpannable extends ClickableSpan
{
    @Override public void updateDrawState(TextPaint ds)
    {
        super.updateDrawState(ds);
        ds.setUnderlineText(true);
    }
}

This example will underline the text. Use TextPaint to change the look of the spanned text.

edited Aug 18 '16 at 08:40

answered Mar 23 '13 at 11:06

ScruffyFox

150
2
9

Ya, you are true. lineSpacingExtra property only expands the background colour. any one got solution for this? – NaiveBz Jul 08 '14 at 10:45
2

I would like to see the complete code, please. The answer is accepted, but I don't get "NewSpannableClass" – Bobbelinio Nov 27 '14 at 14:30
1

I'd be interested in seeing that complete code too. – eoinzy Apr 16 '15 at 14:11
Hi.. i have used same code but it does not give me same result. – Reshma Jul 04 '16 at 12:24
For bacground color I added this code inside updateDrawState: ds.bgColor = argb(120, 0, 0, 0); Note that when I used color format like this: "#FFF5F19E" - the colors were wrong. – Maxim Dec 25 '22 at 16:55

score 5 · Answer 3 · answered May 27 '15 at 09:08

I believe there's an easier, nicer way to go about achieving this: simply create a backgroundColorSpan and add it to a SpannableString. Something along those lines:

public static SpannableString buildBackgroundColorSpan(SpannableString spannableString,
                                                String text, String searchString, int color) {

    int indexOf = text.toUpperCase().indexOf(searchString.toUpperCase());

    try {
        spannableString.setSpan(new BackgroundColorSpan(color), indexOf,
                (indexOf + searchString.length()), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    } catch (Exception e) {

    }


    return spannableString;
}

Where "spannableString" is the SpannableString object created and assumed to be initialised with "text"; "searchString" represents the piece of text you wish to "highlight" in your TextView, and "color" the background colour to which the "highlighted" text should be set.

String text = "The Quick Brown Fox Jumps over the Lazy Dog";
String searchString = "brown";
int color = Color.parseColor("#FFF5F19E");

SpannableString spannableString = new SpannableString(text);
spannableString = StringUtils.buildBackgroundColorSpan(spannableString, text, searchString, color);

I think this should suffice.

Thanks

It works, but instead of this: int color = Color.parseColor("#FFF5F19E"); I use this: int color = argb(120, 0, 0, 0); (to make transparent black color, for example). When I tried to use color format like "#FFF5F19E" - the colors were wrong. — Maxim, Dec 25 '22 at 16:34

score 1 · Answer 4 · answered Mar 23 '13 at 04:18

Use this example

 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#0000FF"
    android:textColor="#FFFFFF" />

for picking color use this link http://html-color-codes.info/

Red:#750A0A

Blue:#002BFF

Green:#33FF00

White:#FFFFFF

Black:#000000

score 1 · Answer 5 · edited Nov 24 '14 at 12:15

If you want to do it from XML try the solution of the other people who just answered like:

 <TextView
            android:id="@+id/TextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textColor="#ffffff"
            android:background="#1bgtbgt"/>

If you want to do it from Activity Code you can change it dynamically like try with:

text.setBackgroundColor( int color);

score 0 · Answer 6 · edited Mar 23 '13 at 11:44

0

Try this below the textview in .xml file:

<TextView android:background="#0000FF">

edited Mar 23 '13 at 11:44

Bohemian

412,405
93
575
722

answered Mar 23 '13 at 11:20

Dileep singh

69
6

score 0 · Answer 7 · answered Sep 13 '15 at 17:07

0

Just set the TextView length as match_parent assuming that it is nested within a parent value that spans the whole length of the screen, and your text will be the same length, but the box will increase to the whole length of the screen.

answered Sep 13 '15 at 17:07

Rafa

3,219
4
38
70

score -1 · Answer 8 · answered Mar 23 '13 at 05:09

Try Using this for text background color

 <TextView
            android:id="@+id/comment_dis"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Stack Overflow
            android:textColor="#ffffff"
            android:background="#3cabdc"/>

score -1 · Answer 9 · answered Oct 02 '13 at 05:58

You could add another layout around the TextView and set its background to the colour you want

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#000000" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textColor="#FFFFFF"
        android:text="@string/text" />

</LinearLayout>

Android TextView text background color

9 Answers9

Linked