How to set constraint to two views?

Question

So I have a constraintLayout like this

<ConstraintLayout>
    <TextView
    android:id="@+id/text_view"
    app:layout_constraintEnd_toStartOf="@+id/view1" />

    <View
    android:id="@+id/view1"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent"/>

    <View
    android:id="@+id/view2"
    aapp:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
</ConstraintLayout>

Currently the textview's end is at the start of view1, however, when view1's visibility is gone, I want the end of textview to the start of view2, otherwise the long string may cover view2. Is there any way to set the constraint to two views or is there any better solution for this?

Possible duplicate of [ConstraintLayout, when constraint dependent view is gone, the layout view behave weirdly](https://stackoverflow.com/questions/45080835/constraintlayout-when-constraint-dependent-view-is-gone-the-layout-view-behave) — Ankur_009, Apr 26 '18 at 16:35

score 43 · Answer 1 · answered Dec 10 '19 at 10:34

You can use a Barrier to constraint to multiple views.

<ConstraintLayout>

    <androidx.constraintlayout.widget.Barrier
        android:id="@+id/barrier"
        app:barrierDirection="left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:constraint_referenced_ids="view1,view2"/>    

    <TextView
        android:id="@+id/text_view"
        app:layout_constraintEnd_toStartOf="@id/barrier" />

    <View
        android:id="@+id/view1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <View
        android:id="@+id/view2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</ConstraintLayout>

The textview will be constraint to the view that is more to the left

Thanks, this was very helpful. – King Of The Jungle Nov 09 '21 at 16:03 — King Of The Jungle, Nov 09 '21 at 16:03

score 0 · Answer 2 · answered Apr 26 '18 at 16:41

You can set a GlobalLayoutListener to your view to handle visibility changes like explained in this answer and then change constraints in relation to its visibility state :

ConstraintSet constraintSet = new ConstraintSet();
constraintSet.clone(constraintLayout);
constraintSet.connect(R.id.text_view,ConstraintSet.RIGHT,R.id.view2,ConstraintSet.LEFT,0);
constraintSet.applyTo(constraintLayout);

score 0 · Answer 3 · edited Apr 27 '18 at 12:56

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:layout_editor_absoluteY="25dp">

    <android.support.v7.widget.AppCompatTextView
        android:id="@+id/autoCompleteTextView"
        android:layout_width="0dp"
        android:layout_height="84dp"
        android:layout_marginEnd="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="8dp"
        android:text="HELLO WORLD"
        android:textSize="18dp"
        android:gravity="center_horizontal"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <View
        android:id="@+id/view2"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginTop="8dp"
        android:visibility="gone"
        app:layout_constraintEnd_toEndOf="@+id/autoCompleteTextView"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="@+id/autoCompleteTextView"
        app:layout_constraintTop_toBottomOf="@+id/autoCompleteTextView" />

    <View
        android:id="@+id/view1"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:layout_marginBottom="16dp"
        android:layout_marginTop="8dp"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="@+id/autoCompleteTextView"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="@+id/autoCompleteTextView"
        app:layout_constraintTop_toBottomOf="@+id/view2" />
</android.support.constraint.ConstraintLayout>

try this...hope it helps you..

score 0 · Answer 4 · answered Apr 27 '18 at 12:47

0

In the end, I found that I can make the visibility of the view1 to be INVISIBLE instead of GONE to make it work, since it still occupies the space, the textview would not expand.

answered Apr 27 '18 at 12:47

litaoshen

1,762
1
20
36

How to set constraint to two views?

4 Answers4