RelativeLayout работает, тогда как ConstraintLayout не работает

Question

Вот код из RelativeLayout,

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:gravity="center">

        <ImageView
            android:id="@+id/imgIcon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/app_name"
            android:minWidth="200dp"
            android:minHeight="200dp"
            android:src="@drawable/ic_baseline_description_24px"
            android:tint="@color/grey" />
    </RelativeLayout>

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/txtInputLayoutCaption"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="@dimen/dp8"
        android:layout_toStartOf="@+id/imgSend"
        android:hint="@string/caption">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/editTextCaption"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fontFamily="@font/trebuchet" />

    </com.google.android.material.textfield.TextInputLayout>

    <ImageView
        android:id="@+id/imgSend"
        android:layout_width="@dimen/dp36"
        android:layout_height="@dimen/dp36"
        android:layout_alignTop="@+id/txtInputLayoutCaption"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:contentDescription="@string/app_name"
        android:src="@drawable/ic_baseline_send_24px"
        android:tint="?attr/colorPrimary" />
</RelativeLayout>

Выход RelativeLayout

И здесьэто код макета ограничения,

<?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">

    <ImageView
        android:id="@+id/imgIcon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/app_name"
        android:minWidth="200dp"
        android:minHeight="200dp"
        android:src="@drawable/ic_baseline_description_24px"
        android:tint="@color/grey"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/txtInputLayout"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="@dimen/dp8"
        android:hint="@string/caption"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/imgSend"
        app:layout_constraintStart_toStartOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/editText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    </com.google.android.material.textfield.TextInputLayout>

    <ImageView
        android:id="@+id/imgSend"
        android:layout_width="@dimen/dp36"
        android:layout_height="@dimen/dp36"
        android:contentDescription="@string/app_name"
        android:src="@drawable/ic_baseline_send_24px"
        android:tint="?attr/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/txtInputLayout"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/txtInputLayout" />
</androidx.constraintlayout.widget.ConstraintLayout>

А вот вывод для кода макета ограничения.

Примечание: I 'м, используя androidx.constraintlayout:constraintlayout:2.0.0-beta2

Answer 1

Назначить начальное ограничение кнопки отправки для txtInputLayoutCaption

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imgIcon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/app_name"
        android:minWidth="200dp"
        android:minHeight="200dp"
        android:src="@drawable/ic_share_active"
        android:tint="@color/gray"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/txtInputLayout"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:hint="caption"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/imgSend"
        app:layout_constraintStart_toStartOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/editText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    </com.google.android.material.textfield.TextInputLayout>

    <ImageView
        android:id="@+id/imgSend"
        android:layout_width="36dp"
        android:layout_height="36dp"
        android:contentDescription="@string/app_name"
        android:src="@drawable/ic_send"
        app:layout_constraintBottom_toBottomOf="@+id/txtInputLayout"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/txtInputLayout"
        app:layout_constraintTop_toTopOf="@+id/txtInputLayout" />
</androidx.constraintlayout.widget.ConstraintLayout>

Answer 2

Намерение ConstraintLayout - оптимизировать и сгладить иерархию представлений ваших макетов, применяя некоторые правила к каждому представлению, чтобы избежать вложения.

Правила напоминают вам о RelativeLayout, например, устанавливая левое в низ некоторыхдругое представление.

app:layout_constraintBottom_toBottomOf="@+id/view1"

В отличие от RelativeLayout, ConstraintLayout предлагает значение смещения, которое используется для позиционирования представления с точки зрения 0% и 100% горизонтального и вертикального смещения относительно маркеров (отмеченных кружком). Эти проценты (и доли) обеспечивают плавное позиционирование вида на экранах с разной плотностью и размерами.

app:layout_constraintHorizontal_bias="0.33" <!-- from 0.0 to 1.0 -->
app:layout_constraintVertical_bias="0.53" <!-- from 0.0 to 1.0 -->