Place A Textview Next To Another Textview For Longer Text On Android

My goal is to have 2 TextViews (textLeft, textRight) next to each other. textLeft should be aligned to the left side of parent. textRight should always be an immediate right of tex

Solution 1:

Edit:

This layout is a kind of "chatting" layout. You can use two LinearLayout, one is parent of all with match_parent, and the other is holder of two TextViews. Note that latter one has wrap_content width.

layout_weight attribute of LinearLayout means... roughly speaking, smaller number is important.

See also: https://developer.android.com/reference/android/widget/LinearLayout

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="test test test test test test test test test test test test test test test"android:layout_weight="1"/><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Hello world"android:layout_weight="0"/></LinearLayout><Spaceandroid:layout_width="wrap_content"android:layout_height="20dp"/><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="test test test test test test test test "android:layout_weight="1"/><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Hello world"android:layout_weight="0"/></LinearLayout></LinearLayout>

---

Outdated answer

Note that textLeft has 0dp width.

If you set width (or height) to 0 in constraint layout, it means it will fill rest of the empty space.

Or, you can use app:layout_constraintHorizontal_weight with 0dp width, you can set percentage of width of layout.

<android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="match_parent"><TextViewandroid:id="@+id/textLeft"android:layout_width="0dp"android:layout_height="wrap_content"android:text="Long Long Long Long Long Long Long Long Long Long Long Long Long"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintRight_toLeftOf="@id/textRight"app:layout_constraintTop_toTopOf="parent"/><TextViewandroid:id="@+id/textRight"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Hello World!  "app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@id/textLeft"app:layout_constraintRight_toRightOf="parent"app:layout_constraintTop_toTopOf="parent"/></android.support.constraint.ConstraintLayout>

Solution 2:

<?xml version="1.0" encoding="utf-8"?><android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"xmlns:app="http://schemas.android.com/apk/res-auto"><TextViewandroid:id="@+id/text1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="text1ldksjdaskldjadlkjdaslkdjsl"android:textSize="20sp"app:layout_constraintEnd_toStartOf="@id/text2"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><TextViewandroid:id="@+id/text2"android:layout_width="0dp"android:layout_height="wrap_content"android:text="text2dsjdakldjlkajdlskdjasldkjdlskdjasdlaskdjasldkj"android:textSize="20sp"android:gravity="right"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toEndOf="@id/text1"app:layout_constraintTop_toTopOf="parent" /></android.support.constraint.ConstraintLayout>

I'm not sure if this is what you were asking for, in any case I just checked a few scenarios where the texts are longer in both textviews. I also suggest you to convert your layouts to constraint layout, eventually you will benefit from it, you could easily flatten your tree view hierarchy without using too many inner layouts.

Solution 3:

you can implement this code in this way

<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent">

<TextView
    android:id="@+id/textLeft"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="10sp"
    android:maxLines="3"
    android:ellipsize="end"
    android:text="Text On the Left - long random text to follow"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"/>

<TextView
    android:id="@+id/textRight"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toEndOf="@+id/textLeft"
    android:layout_alignParentRight="true"
    android:textSize="10sp"
    android:maxLines="1"
    android:text="Text on the Right"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toEndOf="parent"  />

or that one

<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent">

<TextView
    android:id="@+id/textLeft"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="10sp"
    android:maxLines="3"
    android:ellipsize="end"
    android:text="Text On the Left - long random text to follow"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    android:layout_margin="10dp"/>

<TextView
    android:id="@+id/textRight"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toEndOf="@+id/textLeft"
    android:layout_alignParentRight="true"
    android:textSize="10sp"
    android:maxLines="1"
    android:text="Text on the Right"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toEndOf="@id/textLeft"
    android:layout_margin="10dp"/>