Android two Textview with "wrapcontent" in single line

Question

I am unable to get a seemingly easy layout configuration right !!

I have two textview in a Relative (tried Linear with orientation horizontal) both "wrapcontent" - I want them one beside other. Something like:

First Text || Second Text [this is of smaller text size]

(For Small Title works good)

When the first text is long - longer than what can be displayed in one line then the first text goes to second line and the second Textview disappears (goes to deep right). Something like below:

2.For long Title - observe the count disappears to right

          <RelativeLayout
                android:orientation="horizontal"
                android:id="@+id/feedHeader"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical">

                <TextView
                    android:id="@+id/textView1"
                    style="@style/BoldTitle"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="0dp"
                    android:layout_alignParentLeft="true"
                    android:layout_marginTop="5dp"
                    android:paddingBottom="0dp"
                    android:text="Title Loooooooggggggg Title Looong"
                    android:textAppearance="?android:attr/textAppearanceMedium" />

                <TextView
                    android:id="@+id/pageCounts"
                    style="@style/WayBoardCount"
                    android:layout_width="wrap_content"
                    android:minWidth="50dp"
                    android:layout_height="wrap_content"
                    android:layout_alignBaseline="@id/textView1"
                    android:layout_toRightOf="@id/textView1"
                    android:checked="false"
                    android:gravity="left|center_vertical"
                    android:text="3/5"
                    android:textAppearance="?android:attr/textAppearanceSmall" />
            </RelativeLayout>

I want small text (count) to be beside "Looong" and not disappear on the right

Tried "Min Size for the second textview"

Linear Layout with Horizontal Orientation

EDIT: Some Solutions/Answers given in this thread that still doesn't address my problem (For the benefit of someone else I have my output below):

Alexander :

If you don't find any solution for this, then you can use a single textview for showing both the title as well as count and change the size of later part to be smaller than the starting part using SpannableStrings. — Ankit Aggarwal, May 06 '16 at 12:21

IntelliJ Amiya · Answer 1 · 2016-05-06T12:23:19.213

You can try with

    <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="horizontal"
   android:weightSum="1" >
<TextView
     android:id="@+id/textView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.5"
    android:gravity="center"
    android:text="Title Loooooooggggggg Title Looong"
    android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
    android:id="@+id/pageCounts"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="0.5"
    android:gravity="center"
    android:text="3/5"
    android:textAppearance="?android:attr/textAppearanceSmall"" />
 </LinearLayout>

Note

You cant showing in single line if Text is too Large . On that time you can use android:ellipsize

android:ellipsize="end"

I don't want to ellipsize - Want the first text to be fully shown after which the second text (which is count) to be displayed - the count is of "smaller text size" hence using two textviews - else I could have simply appended my count the the only textview — takrishna, May 06 '16 at 12:35
@takrishna problem for large text . you can follow #ankitaggarwal's tips — IntelliJ Amiya, May 06 '16 at 12:36

Alexander · Accepted Answer · 2016-05-06T13:25:02.063

0

I understood your problem. So you can use spannable. Useful link about metrics. Hope it helps tutorial

Simple cod:

private void updateText(TextView textView, String bigText, String smallText) {
    SpannableString spannableString = new SpannableString(bigText + smallText);
    spannableString.setSpan(new RelativeSizeSpan(1.4f), 0, bigText.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    spannableString.setSpan(new RelativeSizeSpan(1.0f), bigText.length(), spannableString.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    textView.setText(spannableString);
}

edited May 06 '16 at 13:25

answered May 06 '16 at 12:13

Alexander

857
6
10

This wouldn't help - coz For "Small Title" - giving weight makes the "small text" go to the extreme right – takrishna May 06 '16 at 12:24
@takrishna do you use **wrap_content** for **width** in LinearLayout? – Alexander May 06 '16 at 12:42
yes.. the "small text" doesn't start right after "G" of "Looong" (see the image I have uploaded) - I am thinking may be this is Android platform's limitation – takrishna May 06 '16 at 12:47
can you share your full layout? I see that you attached not full source code. – Alexander May 06 '16 at 12:54
I have put what I got as output - Hope I am clear now - I mean as an edit to the question itself - some screen grabs – takrishna May 06 '16 at 13:12
Yes Alex, I found that Friday - forgot to update this thread !! – takrishna May 09 '16 at 05:23

score 0 · Answer 3 · answered May 06 '16 at 12:18

Just do like this

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <TextView
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:text="VeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLongText"
      android:layout_weight="1"/>

  <TextView
      android:layout_width="match_parent"
      android:gravity="start|bottom"
      android:layout_height="5dp"
      android:textSize="5sp"
      android:textAppearance="?android:attr/textAppearanceSmall"
      android:text="SmallText"
      android:layout_weight="1"/>

</LinearLayout>

weight is same and "1" doesn't work Mahesh ! - same result – takrishna May 06 '16 at 12:40 — takrishna, May 06 '16 at 12:40

score 0 · Answer 4 · answered May 06 '16 at 12:25

You can also do the same with RelativeLayout, following is a dummy code

         <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/feedHeader"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:orientation="horizontal" >

            <TextView
                 android:id="@+id/pageCounts"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_alignParentRight="true"
                 android:layout_centerInParent="true"
                 android:checked="false"
                 android:text="3/5"
                 android:textAppearance="?android:attr/textAppearanceSmall" />

            <TextView
                 android:id="@+id/textView1"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_alignParentLeft="true"
                 android:layout_marginBottom="0dp"
                 android:layout_marginTop="5dp"
                 android:layout_toLeftOf="@+id/textView2"
                 android:paddingBottom="0dp"
                 android:text="Title Loooooooggggggg Title Looong Loong"
                 android:textAppearance="?android:attr/textAppearanceMedium" />

         </RelativeLayout>

I don't want to alignparentRight dude - I want it to align rightof "First Text" - but when the first text is long I want the second text to be displayed after the first text is done displaying — takrishna, May 06 '16 at 12:38

score 0 · Answer 5 · edited May 23 '17 at 12:22

0

Apparently I was looking for "Span-able String" !!

Details here: Different font size of strings in the same TextView

edited May 23 '17 at 12:22

Community

1
1

answered May 09 '16 at 05:19

takrishna

4,884
3
18
35

Android two Textview with "wrapcontent" in single line

5 Answers5

Note