Вид выталкивается за пределы горизонтального макета ограничения

Question

Как поставить длинную Textview и иконку по горизонтали без Textview, чтобы переместить иконку за пределы вида.

Играли с constrained_width и т. Д., Но без радости.

<android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"">

                    <TextView
                        android:id="@+id/name"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        app:layout_constrainedWidth="true"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent"
                        tools:text="Text in the middle pushes the edit icon out of view oh noh!" />

                    <ImageButton
                        android:id="@+id/edit"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:src="@drawable/edit_icon"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintStart_toEndOf="@id/name"
                        app:layout_constraintTop_toTopOf="parent" />

                </android.support.constraint.ConstraintLayout>

Я хочу, чтобы Textview и значок были выровнены по центру (по горизонтали). Но по мере роста текста Textview выдвигает значок редактирования за пределы представления. Как мы можем поместить Textview (переменную ширину) с чем-либо еще горизонтально, без Textview выталкивания других за пределы экрана.

Значок перемещен за пределы

Нужно, чтобы это было что-то вроде этого, с видами, занимающими всю ширину

Answer 1

Вам нужен 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"
    xmlns:tools="http://schemas.android.com/tools">

    <TextView
        android:id="@+id/name"
        tools:text="Text in the middle pushes icon out of view oh noh! But we Resolved issue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constrainedWidth="true"
        android:maxWidth="200dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@id/edit"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageButton
        android:id="@+id/edit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:background="@color/colorPrimary"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toEndOf="@id/name"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@id/name" />

</android.support.constraint.ConstraintLayout>

Answer 2

В основном, если у вашего TextView есть начальные и конечные ограничения, указывающие на родителя, он будет полностью растянут.А затем, установив ImageButton start ограничение на конечное ограничение TextView, вытолкнет ImageButton из макета.

Что вам нужно сделать, это установить TextView так, чтобы оно помещалось между родителем иImageBotton путем установки соответствующих ограничений влево / вправо:

app:layout_constraintEnd_toStartOf="@+id/edit"
app:layout_constraintStart_toStartOf="parent"

Пример:

<?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/name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/edit"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="Text in the middle pushes the edit icon out of view oh noh!"/>

    <ImageButton
        android:id="@+id/edit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/edit_icon"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>