https://kotlinlang.org logo
#compose
Title
# compose
m

Marcin Środa

07/17/2020, 7:48 AM
Hi! How can I translate xml constraint into compose?
Copy code
<?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="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Text goes here and it is reeeeeeeeeeeeeeeally long "
        android:singleLine="true"
        android:ellipsize="end"
        app:layout_constrainedWidth="true"
        app:layout_constraintEnd_toStartOf="@id/image"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constrainedWidth="true"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@id/textView"
        app:layout_constraintTop_toTopOf="parent"
        tools:src="@tools:sample/avatars" />

</androidx.constraintlayout.widget.ConstraintLayout>
The idea is simple - don't let TextView to push ImageView out of screen. I've set a ConstraintSet but cannot found an equivalent of constrainedWidth. Any ideas?
t

Timo Drick

07/17/2020, 4:29 PM
I do not use ContraintLayout but it is really simple with LinearLayout -> Column
Copy code
Column {
    Text("Very long text", Modifier.weight(1f))
    Image(asset = vectorResource(id = R.id.avatar))
}
g

gildor

07/18/2020, 1:30 PM
Have you tried to use constrained layout dsl for compose and convert it directly
j

Jorge Castillo

07/18/2020, 1:48 PM
Did you try the width constraint?
m

Marcin Środa

07/20/2020, 5:30 AM
You're right @Jorge Castillo, I tried it before but on preview text wasn't ellipsized (but the layout size is correct). Thanks!
Right now the view on right side is not pushed outside (spread on left view, wrap on right) but it's sticked to the parent right. I'd like to have a solution like: minWidth = wrap maxWidth = spread to accept both:
PS: the second one is fine, like I said before ellipsize doesn't work on preview.
2 Views