Ограничение верстки по центру, если место

Question

Я размещаю по вертикали два моих макета ввода, используя цепочку. У меня также есть представление изображения и текстовое представление в верхней части этих двух макетов ввода. Я хотел бы иметь этот центр ввода Layout только , если вид достаточно места.

Прямо сейчас макет ввода всегда в центре, а текст идет поверх изображения.

В ios я бы использовал приоритет ограничения для этого, но похоже, что это еще не доступно для макета ограничения?

Что у меня есть сейчас

То, что я хочу иметь, это

Редактировать

Извините, я должен был добавить текст:)

<android.support.constraint.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:id="@+id/registration_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/transparent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_marginEnd="32dp"
        android:layout_marginStart="32dp"
        android:layout_marginTop="32dp"
        android:adjustViewBounds="true"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/logo" />

    <!--To get the focus when page appear-->
    <include layout="@layout/layout_focus_interceptor" />

    <TextView
        android:id="@+id/tv_extra_info"
        style="@style/TextContent"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:gravity="center"
        app:layout_constraintBottom_toTopOf="@+id/input_layout_email"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView" />

    <android.support.design.widget.TextInputLayout
        android:id="@+id/input_layout_email"
        style="@style/TextInputLayout"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/margin_bottom_text_input_layout"
        android:layout_marginTop="8dp"
        android:theme="@style/PreAuthorizationTextTheme"
        app:layout_constraintBottom_toTopOf="@id/input_layout_email_confirmation"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="packed">

        <android.support.design.widget.TextInputEditText
            android:id="@+id/etxt_email"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textEmailAddress"
            android:nextFocusLeft="@id/etxt_email"
            android:nextFocusUp="@id/etxt_email"
            tools:hint="@string/general_email" />
    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:id="@+id/input_layout_email_confirmation"
        style="@style/TextInputLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/margin_bottom_text_input_layout"
        android:layout_marginTop="@dimen/margin_top_text_input_layout"
        android:theme="@style/PreAuthorizationTextTheme"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/input_layout_email">

        <android.support.design.widget.TextInputEditText
            android:id="@+id/et_email_confirmation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textEmailAddress"
            android:nextFocusLeft="@id/etxt_email"
            android:nextFocusUp="@id/etxt_email"
            tools:hint="@string/registration_email_confirmation" />

    </android.support.design.widget.TextInputLayout>

</android.support.constraint.ConstraintLayout>

Answer 1

Я тоже не знаю, как это сделать! Но я смог придумать что-то, что близко к тому, что вы ищете.

Я создал элемент Guideline, зафиксированный на определенной высоте, из-за которого мои виды казались вертикально центрированными, когда они располагались под ним. Для телефонов разных размеров это, вероятно, будет отключено на пиксель или десять, но это никогда не должно быть слишком плохо.

Затем я создаю Barrier, который ссылается на руководство, а другой вид, который я хочу "уклониться". И я позиционирую свои другие элементы относительно этого барьера.

Мой XML:

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

    <View
        android:id="@+id/rect"
        android:layout_width="300dp"
        android:layout_height="100dp"
        android:layout_marginTop="16dp"
        android:background="#fac"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.34"/>

    <android.support.constraint.Barrier
        android:id="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:barrierDirection="bottom"
        app:constraint_referenced_ids="rect,guideline"/>

    <View
        android:id="@+id/first"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_marginTop="16dp"
        android:background="#caf"
        app:layout_constraintTop_toBottomOf="@id/barrier"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

    <View
        android:id="@+id/second"
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_marginTop="16dp"
        android:background="#caf"
        app:layout_constraintTop_toBottomOf="@+id/first"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

</android.support.constraint.ConstraintLayout>

При коротком виде rect два средних вида отображаются вертикально по центру, а при высоком rect виде два средних вида сбиваются: