Apply different size string/text to TextView

Question

enter image description here

I have a text '$170.00' and I want to apply this text to TextView as shown in image. How could be it possible.?? Any suggestion would be appreciated. Thanks in advance.

If you just want to put that there, why not try a imageview instead? — SoulRayder, Mar 27 '14 at 08:59
Look at http://vnamashko.blogspot.in/2012/04/rich-textview.html — user370305, Mar 27 '14 at 09:01
@Gautham this is price which is dynamically calculted according to product quantity.So i cant use ImageView.Thanx — Vicky, Mar 27 '14 at 09:02
@Vicky, try my below solution and let me know whether it is working or not. — InnocentKiller, Mar 27 '14 at 09:04

David Corsalini · Accepted Answer · 2014-03-27T10:18:43.967

5

1) Create a SpannableString from your original text

SpannableString string = new SpannableString(originalText)

2) Set a SuperscriptSpan and a RelativeSizeSpan for the $ symbol

string.setSpan(new SuperscriptSpan(), 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
string.setSpan(new RelativeSizeSpan((0.5f), 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);

3) Leave the integer part alone.

4) Get the index for the decimal part and apply a SuperscriptSpan and a RelativeSizeSpan to it.

string.setSpan(new SuperscriptSpan(), originalText.lenght - 2, originalText.lenght - 1, Spannable.SPAN_INCLUSIVE_INCLUSIVE);
string.setSpan(new RelativeSizeSpan((0.5f),  originalText.lenght - 2, originalText.lenght - 1, Spannable.SPAN_INCLUSIVE_INCLUSIVE);

5) Apply the SpannableString to the TextView

textView.setText(string);

edited Mar 27 '14 at 10:18

answered Mar 27 '14 at 09:11

David Corsalini

7,958
8
41
66

Nop it looks like SuperScript for 170. – Vicky Mar 27 '14 at 09:35
What? Can you elaborate? – David Corsalini Mar 27 '14 at 10:11
1

I've updated the answer with a RelativeSizeSpan. Try different values for the RelativeSizeSpan constructor to accomodate your needs. – David Corsalini Mar 27 '14 at 10:19
Yup i got the output close to what I looking for using your snippet. Still '$' sign looks like Superscript. Thanks for help buddy. Please let me know if u get the correct solution. – Vicky Mar 27 '14 at 12:58
Is $ not supposed to be superscript? If this answer solved your problem, please accept it. – David Corsalini Mar 27 '14 at 18:42

InnocentKiller · Answer 2 · 2014-03-27T09:21:00.583

3

Try it something like below.

((TextView)findViewById(R.id.text)).setText(Html.fromHtml("<sup>$</sup>170<sup>00</sup>"));

with sup the text is going UP and with sub the text is going down.

edited Mar 27 '14 at 09:21

answered Mar 27 '14 at 09:04

InnocentKiller

5,234
7
36
84

Nop it looks like SuperScript for 170. – Vicky Mar 27 '14 at 09:32
@Vicky, obviously it will look like that only, what else you want then. – InnocentKiller Mar 27 '14 at 09:33
They should look on same lavel. – Vicky Mar 27 '14 at 09:34
Hi I know it can be done using HTML Style. and I have written code for it but don't know how to use it. If u know then can u tell me how to use it? I will post the html code. – Vicky Mar 27 '14 at 09:37
/* Untitled Document
^$ 170 ⁰⁰
*/ – Vicky Mar 27 '14 at 09:38

score 1 · Answer 3 · answered Mar 27 '14 at 09:00

1

You can use SpannableString to format content of TextView:

SpannableString

Or you could use three different TextView in horizontal LinearLayout.

answered Mar 27 '14 at 09:00

Ondřej Z

5,094
3
24
30

score 0 · Answer 4 · edited May 23 '17 at 12:20

0

it will be done by spannable text what you want to do. but i dont know much about spannable text.

see here spannable on android for textView

may be this may give you some idea.

edited May 23 '17 at 12:20

Community

1
1

answered Mar 27 '14 at 09:00

Waqar Ahmed

5,005
2
23
45

score 0 · Answer 5 · answered Mar 27 '14 at 09:36

You can through layout XML as follows...

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/first_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/second_text"
        android:text="$"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/second_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/first_text"
        android:text="170"
        android:includeFontPadding="false"
        android:textSize="30sp" />

    <TextView
        android:id="@+id/third_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/second_text"
        android:layout_toRightOf="@+id/second_text"
        android:text="OO"
        android:textSize="20sp" />

</RelativeLayout>

Apply different size string/text to TextView

5 Answers5

$ 170 00

^$ 170 ⁰⁰