Высота ConstraintLayout с `wrap_content`

Question

У меня есть следующий xml:

<ImageView
    android:id="@+id/iv1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@color/gray"
    android:layout_margin="8dp"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@id/iv2"
    app:layout_constraintDimensionRatio="1:1"
    />

<ImageView
    android:id="@+id/iv2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@color/red"
    android:layout_margin="8dp"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toRightOf="@id/iv1"
    app:layout_constraintRight_toLeftOf="@id/iv3"
    app:layout_constraintDimensionRatio="1:1"
    />

<ImageView
    android:id="@+id/iv3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_margin="8dp"
    android:background="@color/yellow"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toRightOf="@id/iv2"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintDimensionRatio="1:1"
    />

, что дает мне следующее в предпросмотре макета:

Однако я намерен, чтобы ConstraintLayout был потомком RelativeLayout с высотой ConstraintLayout, установленной в wrap_content. Но установка wrap_content приводит к уменьшению всего ConstraintLayout до 0 по высоте. Как заставить wrap_content работать?

Answer 1

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

Ниже приведен один такой образец,

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:weightSum="3">

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="1" />

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="2" />

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="3" />

</LinearLayout>

Answer 2

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

Кстати, в соответствии с вашими потребностями, которые вы описали в разделе комментариев, вы можете создать макет с помощью GuideLine, как показано ниже:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sunriseContainerRL"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

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

        <!-- first box end guide-line -->
        <android.support.constraint.Guideline
            android:id="@+id/firstBoxEndGL"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.33" />

        <!-- second box end guide-line -->
        <android.support.constraint.Guideline
            android:id="@+id/secondBoxEndGL"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.66" />

        <!-- third box end guide-line -->
        <android.support.constraint.Guideline
            android:id="@+id/thirdBoxEndGL"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="0.99" />

        <ImageView
            android:id="@+id/iv1"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_margin="8dp"
            android:background="@color/colorTimeText"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/firstBoxEndGL"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <ImageView
            android:id="@+id/iv2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_margin="8dp"
            android:background="@color/colorTimeText"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/secondBoxEndGL"
            app:layout_constraintLeft_toRightOf="@+id/iv1"
            app:layout_constraintRight_toLeftOf="@+id/iv3"
            app:layout_constraintStart_toEndOf="@+id/firstBoxEndGL"
            app:layout_constraintTop_toTopOf="parent" />

        <ImageView
            android:id="@+id/iv3"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_margin="8dp"
            android:background="@color/colorTimeText"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="@+id/thirdBoxEndGL"
            app:layout_constraintStart_toEndOf="@+id/secondBoxEndGL"
            app:layout_constraintTop_toTopOf="parent" />

    </android.support.constraint.ConstraintLayout>

</RelativeLayout>

Answer 3

Хорошо, во-первых, вам, вероятно, не следует помещать ConstraintLayout внутри RelativeLayout.

Во-вторых, вы не можете "заставить wrap_content работать", если у вашего Constraintlayout нет определенного размера, а у его детей также нет определенного размера

, чтобы сделать эту работу, вы можете A: установить высоту и ширину Constraintlayout равными 100dp или match_parent, или B: установить высоту и ширину детей Constraintlayout равными 100dp

100dp является примером