constraintlayout icon indicating copy to clipboard operation
constraintlayout copied to clipboard

constrained width expands the view

Open WildOrangutan opened this issue 1 year ago • 5 comments

Issue

When layout_constrainedWidth is set to true, it can expand parent layout.

Use case

I'm trying to achieve following layout. I want text_view to expand until it's limitied by size of view_2. image

But when layout_constrainedWidth is set, it expands whole parent: image

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="@android:color/darker_gray">

    <View
        android:id="@+id/view_1"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:background="@android:color/holo_blue_dark"
        app:layout_constraintEnd_toStartOf="@id/text_view"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="@id/view_2"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/text_view"
        android:layout_width="wrap_content"
        android:layout_height="20dp"
        android:background="@android:color/holo_purple"
        android:ellipsize="end"
        android:maxLines="1"
        app:layout_constrainedWidth="true"
        app:layout_constraintEnd_toEndOf="@id/view_2"
        app:layout_constraintStart_toEndOf="@id/view_1"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="@tools:sample/lorem/random" />

    <View
        android:id="@+id/view_2"
        android:layout_width="200dp"
        android:layout_height="20dp"
        android:background="@android:color/holo_red_dark"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/view_1" />

</androidx.constraintlayout.widget.ConstraintLayout>

Versions

androidx.constraintlayout:constraintlayout:2.1.4

WildOrangutan avatar Sep 09 '22 08:09 WildOrangutan

wrap_content In text_view means the size of the text wins. Why are you not using 0dp ?

jafu888 avatar Sep 10 '22 07:09 jafu888

If I use 0dp, text_view will fill all the available space, which I don't want.

I want view_1 and text_view to be packed together and centered (1st image), but be also be able to expand like in 2nd image. The only undesired effect is that parent layout expands for some reason (grey area).

WildOrangutan avatar Sep 10 '22 12:09 WildOrangutan

Try this: android:layout_width="0dp" and app:layout_constraintWidth_max="wrap"

        <TextView
            android:id="@+id/text_view"
            android:layout_width="0dp"
            android:layout_height="20dp"
            android:background="@android:color/holo_purple"
            android:ellipsize="end"
            android:maxLines="1"
            android:textColor="@color/white"
            app:layout_constraintWidth_max="wrap"
            app:layout_constraintEnd_toEndOf="@id/view_2"
            app:layout_constraintStart_toEndOf="@id/view_1"
            app:layout_constraintTop_toTopOf="parent"
            tools:text="@tools:sample/lorem/random" />
            

It should give you want you want

jafu888 avatar Sep 12 '22 16:09 jafu888

Yeah, that has the desired effect.

I'm confused tough, shouldn't my initial code also work? At least I gathered from documentation, that this should be possible.

WildOrangutan avatar Sep 12 '22 17:09 WildOrangutan