CODEWITHSUNDEEP
androidandroid-layout
Alezis
Alezis

Reputation: 1212

Textview overlapping on LinearLayout

I have a RecyclerView and that code is the item layout for the recycler.

It's a text message and the time on the right.

If the text is small it works ok. enter image description here But when the text is large the time TextView is not shown enter image description here

I can set maxWidth but I dont want to do it like that. I want to know how to fix the time always in the layout

<LinearLayout
    android:id="@+id/layout_message"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="left">
    <TextView
        android:id="@+id/tv_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/TextAppearance.AppCompat.Body1"
        android:text="Hello Mike bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla "
        android:layout_margin="10dp"
        />

    <TextView
        android:id="@+id/tv_msg_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="10sp"
        android:text="10:20"
        android:layout_marginRight="10dp"
        android:layout_marginTop="15dp"
        android:layout_marginBottom="5dp"
        />

</LinearLayout>

EDIT: First answer comment: enter image description here I want to wrap the content is the text is small

EDIT: The solution that works for me is only using android:maxWidth

<LinearLayout
    android:id="@+id/layout_message"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="left">
    <TextView
        android:id="@+id/tv_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxWidth="320dp"
        style="@style/TextAppearance.AppCompat.Body1"
        android:text="la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala la lalala @string/prompt_message"
        android:layout_marginTop="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginBottom="15dp"
        />

    <TextView
        android:id="@+id/tv_msg_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="10sp"
        android:text="10:20"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="2dp"
        android:layout_gravity="bottom"

        />

</LinearLayout>

Upvotes: 2

Views: 1959

Answers (4)

Sharath kumar
Sharath kumar

Reputation: 4132

Use this layout instead.This will solve your problem.

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

    <TextView
        android:id="@+id/tv_message"
        style="@style/TextAppearance.AppCompat.Body1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingRight="30dp"
        android:text="Hello Mike bla bla bla  bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla " />

    <TextView
        android:id="@+id/tv_msg_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@+id/tv_message"
        android:layout_marginBottom="5dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="15dp"
        android:text="10:20"
        android:textColor="@android:color/black"
        android:textSize="10sp" />

</RelativeLayout>

Upvotes: 2

Vidhi Dave
Vidhi Dave

Reputation: 5684

Try this : Add weight to your message textview.

enter image description here

<LinearLayout
    android:id="@+id/layout_message"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="left">
    <TextView
        android:id="@+id/tv_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/TextAppearance.AppCompat.Body1"
        android:text="Hello Mike bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla "
        android:layout_margin="10dp"
        android:layout_weight="1"/>

    <TextView
        android:id="@+id/tv_msg_time"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:textSize="10sp"
        android:text="10:20"
        android:layout_marginRight="10dp"
        android:layout_marginTop="15dp"
        android:layout_marginBottom="5dp"
        android:gravity="bottom"/>

</LinearLayout>

Upvotes: 4

Natan Felipe
Natan Felipe

Reputation: 173

As said by @AbhayBohra, use the weight property on the textviews and set the width as 0dp, like this:

<LinearLayout
    android:id="@+id/layout_message"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="left">
<TextView
    android:id="@+id/tv_message"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
android:layout_weight="7"
    style="@style/TextAppearance.AppCompat.Body1"
    android:text="Hello Mike bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla "
    android:layout_margin="10dp"
    />
<TextView
    android:id="@+id/tv_msg_time"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
android:layout_weight="2"

    android:textSize="10sp"
    android:text="10:20"
    android:layout_marginRight="10dp"
    android:layout_marginTop="15dp"
    android:layout_marginBottom="5dp"
    />

</LinearLayout>

Upvotes: 0

Akhilesh Awasthi
Akhilesh Awasthi

Reputation: 2708

Change your layout a bit like this:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android:id="@+id/layout_message"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:weightSum="1"
    android:gravity="start">
    <TextView
        android:id="@+id/tv_message"
        android:layout_width="0dp"
        android:layout_weight=".85"
        android:layout_height="wrap_content"
        style="@style/TextAppearance.AppCompat.Body1"
        android:text="Hello Mike bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla "
        android:layout_margin="10dp"
        />

    <TextView
        android:id="@+id/tv_msg_time"
        android:layout_width="0dp"
        android:layout_weight=".15"
        android:layout_height="wrap_content"
        android:textSize="10sp"
        android:text="10:20"
        android:layout_marginRight="10dp"
        android:layout_marginEnd="10dp"
        android:layout_marginTop="15dp"
        android:layout_marginBottom="5dp"
        />

</LinearLayout>

Upvotes: 0

Related Questions