CODEWITHSUNDEEP
androidandroid-constraintlayout
Lucas
Lucas

Reputation: 738

Allow TextView to grow until a certain point in constraint layout

There is TextView1 and TextView2. TextView2 should float on the right side of TextView1. TextView1 should grow to the right as long as the total width of both text views do not make TextView2 overlap with the box on the right. When this happens, TextView1 should wrap to a second line.

When there is only one TextView, this is achievable by setting TextView's width to 0dp and constraining the size to the box. But with two text views I don't know how to achieve this.

enter image description here

Upvotes: 9

Views: 1413

Answers (1)

Nicolas
Nicolas

Reputation: 7111

You can achieve this with the use of the following attributes:

  • app:layout_constraintHorizontal_bias="0": makes sure the first text view leaves no space on the left.
  • app:layout_constraintHorizontal_chainStyle="packed": removes spacing between items in the text view chain.
  • app:layout_constrainedWidth="true": allows the use of wrap_content on the text view while still allowing to wrap if text is too long.

Here's the layout:

<TextView
    android:id="@+id/text_view_1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constrainedWidth="true"
    app:layout_constraintEnd_toStartOf="@id/text_view_2"
    app:layout_constraintHorizontal_chainStyle="packed"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="Very long text in this text"
    app:layout_constraintHorizontal_bias="0"
    />

<TextView
    android:id="@+id/text_view_2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constraintEnd_toStartOf="@id/box"
    app:layout_constraintStart_toEndOf="@id/text_view_1"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="Text"
    />

<View
    android:id="@+id/box"
    android:layout_width="100dp"
    android:layout_height="100dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    />

I suggest you try removing each attribute to see what effect they have.

Upvotes: 17

Related Questions