Put 2 views side by side with ConstraintLayout

user_2303799 0
Viewed 3707

I'm trying to put 2 textViews side by side in ConstraintLayout while the left view has a dynamic text (can be either short text or a very long text that should be ellipsis if it's overlapping the second view). I want that the 2 textviews will be side by side, so the second view will start at the end of the first view.

Please help :-)

android-constraintlayout android
3 Answers

Though this is the simplest one , if you want them to occupy the same space then you can use layout_constraintVertical_chainStyle. 

 <?xml version="1.0" encoding="utf-8"?>
 <android.support.constraint.ConstraintLayout 
  xmlns: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">

 <TextView
    android:id="@+id/text_view1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Random 1"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:id="@+id/text_view2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Random 1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/text_view1"
    app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

Have a look to this https://medium.com/@loutry/guide-to-constraintlayout-407cd87bc013 .ChainStyle is generally used when you want them to spread equally either horizontal or vertical .Chains are controlled by attributes set on the first element of the chain (the “head” of the chain) which is the left-most widget for horizontal chains, and the top-most widget for vertical chains.

user_91307590

Try this... Just adjust to top and bottom of the views according to your layout.

<TextView
    android:id="@+id/leftView"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginEnd="5dp"
    android:text="Left View"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@id/rightView"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:id="@+id/rightView"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="5dp"
    android:text="Right View"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@id/leftView"
    app:layout_constraintTop_toTopOf="parent" />
user_41568410

Try something like this:

    <androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
       android:id="@+id/txt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"/>

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@id/txt1"
        app:layout_constraintRight_toRightOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>
user_16568130
Related