Сделать верхнюю часть представления до конца другого представления ConstraintLayout

Question

Я хочу получить пользовательский интерфейс, в котором у меня есть два вида VIEW1 , VIEW2 с этими ограничениями

1. VIEW1 имеет высоту из wrap_content
2. VIEW2 должен it's top быть до конца VIEW1 с 10dp, например.

Окончательный интерфейс, который я хочу с кодом

Answer 1

Другое решение с использованием

вида с фиксированной высотой, равной количеству dp VIEW2, которое должно начаться до конца VIEW1.

полный код (также имеет одинаковые конечные углы снизу) ::

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


    <TextView
        android:id="@+id/mainContent"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="@color/faded_orange"
        android:text="TextView"
        android:translationY="0dp"
        android:textAlignment="center"
        app:layout_constraintTop_toTopOf="@id/space"
        app:layout_constraintBottom_toBottomOf="@id/space2"
        app:layout_constraintStart_toStartOf="@id/space" />

    <Space
        android:id="@+id/space"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="@id/topLayout"
        />

    <Space
        android:id="@+id/space2"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@id/bottomLayout"
        />

    <TextView
        android:id="@+id/topLayout"
        android:layout_width="0dp"
        android:layout_height="@dimen/_100sdp"
        android:background="@drawable/header_bg"
        android:text="TextView"
        android:textAlignment="center"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/bottomLayout"
        android:layout_width="0dp"
        android:layout_height="@dimen/_100sdp"
        android:background="@drawable/bg_bottom_view"
        android:text="TextView"
        android:textAlignment="center"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent" />


</androidx.constraintlayout.widget.ConstraintLayout>

Answer 2

Как вы знаете, настройка layout_marginTop="-10dp" также не будет работать.

Вы можете попробовать установить translationY="-10dp" на VIEW2, тогда она будет работать.

Answer 3

Как я понимаю, вы хотите, чтобы вы смотрели так же, как вы добавили UI Image. Этот интерфейс может быть достигнут с помощью Guideline.

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

    <TextView
        android:id="@+id/textview9"
        android:layout_width="0dp"
        android:layout_height="@dimen/_100sdp"
        android:background="@color/bg_counter"
        android:text="textview"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.13" />

    <TextView
        android:id="@+id/textview10"
        android:layout_width="@dimen/_80sdp"
        android:layout_height="0dp"
        android:background="@color/colorAccent"
        android:text="textview"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/guideline" />

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 4

Вы можете сделать что-то вроде этого.

• Вид сверху (вид 1) с ограничениями на начало, конец и конец parent.
• A Bottom (View 2) с ограничениями topToBottomOf = View 1.
• Добавьте скругленный прямоугольник (View 3) с topToBottomOf = View 1 и height = 10dp или любой другой высотой перекрытия, которую вы хочу иметь.