Android layout confusing

Question

Here is my capture picture:
enter image description here

And here is my code:

<RelativeLayout
    android:id="@+id/wrapper"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:gravity="left">

    <TextView
        android:id="@+id/timeIn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"  
        android:layout_toRightOf="@+id/messageIn"          
        android:layout_gravity="center"
        android:layout_marginTop="15dip"
        android:text="23:23"/>

    <TextView
        android:id="@+id/messageIn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"       
        android:layout_gravity="center"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_yellow"
        android:paddingLeft="10dip"
        android:text="HIHIHIHIHIHI" />



</RelativeLayout>

However, if the text "HIHIHIHIHIHI" changes to "HIHIHIHIHIHIHIHIHIHIHIHIHIHIHIHIHIHI": the time will missing and the bubble will fill parent
enter image description here

How can I do so that the time will still to the right of the bubble even the text is mult-line?

user936414 · Answer 1 · 2012-10-25T06:51:33.960

Try this

<RelativeLayout
    android:id="@+id/wrapper"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:gravity="left">

    <TextView
        android:id="@+id/timeIn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"           
        android:layout_gravity="center"
        android:layout_marginTop="15dip"
        android:layout_alignParentRight="true"
        android:text="23:23"/>

    <TextView
        android:id="@+id/messageIn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"       
        android:layout_gravity="center"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_yellow"
        android:layout_toLeftOf="@+id/timeIn" 
        android:layout_alignParentLeft="true" 
        android:paddingLeft="10dip"
        android:text="HIHIHIHIHIHI" />

</RelativeLayout>

To work for small texts also (To resize the width of messageIn according to message) and time to appear right of message (not right aligned)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/wrapper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="1.0" >

<LinearLayout
    android:id="@+id/lin_lay1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1.0" >

    <TextView
        android:id="@+id/messageIn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_yellow"
        android:paddingLeft="10dip"
        android:text="HIHIHI" />
</LinearLayout>

<LinearLayout
    android:id="@+id/lin_lay2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="0.1" >

    <TextView
        android:id="@+id/timeIn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="15dip"
        android:padding="5dp"
        android:text="23:23" />
</LinearLayout>

</LinearLayout>

work for long text , but for short text, the bubble will many blank area — jjLin, Oct 25 '12 at 04:49
not a solution, there will be a gap between the two text views — ılǝ, Oct 25 '12 at 05:08
sorry, in your version, the time is the rightmost, but I want the time just right to the bubble — jjLin, Oct 25 '12 at 06:21
I tried searching for more information on setting weightSum lower that the actual sum of layout weight, but couldn`t find anything. Can you reference us/ elaborate on how/why this works? According to the Android documentation, I assumed weightSum should reset to the actual sum of layout weights, but then... it obviously doesn`t. — ılǝ, Oct 25 '12 at 07:19
@ile Refer http://ugiagonzalez.com/2012/01/19/android-linearlayout-distribution-explained-weight-and-sizes/ to have a clear idea on weights and width — user936414, Oct 25 '12 at 08:45

score 1 · Answer 2 · answered Oct 25 '12 at 04:41

1

Use android:maxwidth in your textview.

answered Oct 25 '12 at 04:41

Lokesh Mehra

545
6
16

it is the only and best solution until you provide another one :) – ılǝ Oct 25 '12 at 04:48
It is the only solution so far, mine answer is like yours, only more exhaustful – ılǝ Oct 25 '12 at 04:53

score 1 · Answer 3 · edited May 23 '17 at 12:21

1

A solution is to set the android:maxWidth="" property of your "messageIn" TextView. On runtime - get the width of the device screen, the width of the "timeIn" TextView and set the difference (screen width - timeIn width) with setMaxWidth(int maxpixels) method of TextView.

See how to get screen size here

See how to get GUI object size here

edited May 23 '17 at 12:21

Community

1
1

answered Oct 25 '12 at 04:48

ılǝ

3,440
2
33
47

In runtime, I can get the timeIn textView? Since my timeIn is set in runtime – jjLin Oct 25 '12 at 06:24
Sorry, I don`t think I understood the question. I meant you should do: TextView messageIn = (TextView) findViewById(R.id.messageIn); TextView timeIn = (TextView) findViewById(R.id.timeIn); int timeInW = timeIn.getMeasuredHeight(); Display display = getWindowManager().getDefaultDisplay(); Point size = new Point(); display.getSize(size); int screenWidth = size.x; messageIn.setMaxWidth(screenWidth - timeInW); – ılǝ Oct 25 '12 at 06:57
or if you`re developing for API<=13 replace the line with "int screenWidth = display.getWidth();" – ılǝ Oct 25 '12 at 06:59

score 0 · Answer 4 · edited Oct 25 '12 at 04:49

0

make use of layout_weight it will take only assigned space and will not cover time textview.

<LinearLayout
    android:id="@+id/wrapper"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:orientation="horizontal"
    android:weightsum="1">

    <TextView
        android:id="@+id/timeIn"
        android:layout_width="0dip"
        android:layout_height="wrap_content"  
        android:layout_weight="0.7"
        android:layout_gravity="center"
        android:layout_marginTop="15dip"
        android:text="23:23"/>

    <TextView
        android:id="@+id/messageIn"
        android:layout_width="0dip"
        android:layout_height="wrap_content"       
        android:layout_weight="0.3"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_yellow"
        android:paddingLeft="10dip"
        android:text="HIHIHIHIHIHI" />

</LinearLayout>

edited Oct 25 '12 at 04:49

Dipak Keshariya

22,193
18
76
128

answered Oct 25 '12 at 04:37

Deepika Lalra

1,035
1
10
24

This is not really a solution, it will keep the width of both TextView fixed and jjLin seems to need a resizable TextView for the message – ılǝ Oct 25 '12 at 04:42
oh! then answer of user936414 is correct just try his answer. – Deepika Lalra Oct 25 '12 at 04:50
okay then one thing can do it. make the textview(HIHIHIHIHI) in a linearlayout and give 0.7 weight to that linearlayout. it will fix the width of linearlayout and if textview in it will expand, can expand to the width of linearlayout in which it is. – Deepika Lalra Oct 25 '12 at 04:52
No, it`s not correct - it leaves a gap between the two objects – ılǝ Oct 25 '12 at 04:52
then you should specify max width for Edittext. according to the width of time textview. – Deepika Lalra Oct 25 '12 at 05:06
if you change your messageIn layout weight to 1 and removed timeIn layout weight - it would work, as in user936414`s answer. Or you can change the layout weightSum to 0.7 and remove the weight of messageIn – ılǝ Oct 26 '12 at 00:35

score 0 · Answer 5 · answered Oct 25 '12 at 04:47

You can do it in two ways:-

You can use Linear Layout and set its android:orientation="horizontal" and you need to fix the layout_width for a Textview.

Concatinate time with TextView in the code.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content" 
android:orientation="horizontal">
 <TextView
 android:id="@+id/messageIn"
 android:layout_width="200dp"
 android:layout_height="wrap_content"      
 android:text="HIHIHIHIdsfffffffffffffffffffffffffffffffffffffffffffffHIHI" />
<TextView
 android:id="@+id/timeIn"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"  
 android:layout_marginTop="5dp"
 android:text="23:23"/>


 </LinearLayout>

the width of the TextView is fixed, so concatenation will not resize it — ılǝ, Oct 25 '12 at 04:55

Android layout confusing

5 Answers5

Linked