Изменить вертикальное пространство между элементами, используя направляющие в макете ограничений, Android

Question

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

При поиске я столкнулся с этим:

Как заставить ConstraintLayout работать с процентными значениями?

Теперь я знаю, как добавить рекомендации с процентами, но я до сих пор не совсем ясно.

• Должен ли я размещать горизонтальную направляющую после каждого вида?И закрепить вид с его верхней и нижней направляющей?Но разве это не большая часть работы?Для 4 просмотров мне нужно поставить 8 рекомендаций?
• Если я размещу горизонтальную направляющую на 50% экрана и захочу использовать ее как якорь , какие ограничения я наложу на другие виды сверху?

Если кто-нибудь сможет очистить мое понимание, это будет высоко оценено.

Answer 1

Подход с Guidelines, который вы описываете, вероятно, будет способом сделать это с использованием более старой версии ConstraintLayout, как обсуждалось в теме, которую вы связали. Теперь, когда ConstraintLayout-1.1.0 отсутствует, можно установить процентные измерения для представлений, используя app:layout_constraintHeight_percent и app:layout_constraintWidth_percent.

В вашем случае лучшим подходом, на мой взгляд, было бы создание вертикальной цепочки видов и установка желаемой высоты в процентах от родительского для каждого вида. Предполагая, что общий процент высоты всех видов будет меньше 100%, оставшееся пространство будет поровну разделено между видами с использованием атрибута chain_spread_inside или chain_spread (по умолчанию).

Пример XML:

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <View
        android:id="@+id/view1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/holo_orange_dark"
        app:layout_constraintVertical_chainStyle="spread_inside"
        app:layout_constraintHeight_percent="0.2"
        app:layout_constraintBottom_toTopOf="@id/view2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <View
        android:id="@+id/view2"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/holo_red_dark"
        app:layout_constraintHeight_percent="0.3"
        app:layout_constraintBottom_toTopOf="@id/view3"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/view1" />

    <View
        android:id="@+id/view3"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/holo_blue_dark"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintBottom_toTopOf="@id/view4"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/view2" />

    <View
        android:id="@+id/view4"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/holo_green_dark"
        app:layout_constraintHeight_percent="0.2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/view3" />

</android.support.constraint.ConstraintLayout>

Результат с spread_inside стиль цепочки:

и по умолчанию spread стиль цепочки:

Answer 2

Вы можете реализовать через вертикальную цепь и горизонтальную цепь.

read ConstraintLayout Chain .