Интервал между представлениями одинаково в ConstraintLayout - PullRequest
0 голосов
/ 22 декабря 2018

Я пытаюсь сделать 5 ImageButton на ConstraintLayout с равным интервалом между ними, но у меня возникает некоторая проблема с их привязкой и упрощением, например:

enter image description here

Мой код xml:

    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="@drawable/sheet_shadow"
    android:padding="5dp">

    <ImageButton
        android:id="@+id/btn1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="18dp"
        android:layout_marginBottom="8dp"
        android:background="?attr/selectableItemBackgroundBorderless"
        android:tint="@color/grey_40"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more_vert" />

    <ImageButton
        android:id="@+id/btn2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="18dp"
        android:layout_marginBottom="8dp"
        android:background="?attr/selectableItemBackgroundBorderless"
        android:tint="@color/grey_40"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@+id/btn1"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more_vert" />

    <ImageButton
        android:id="@+id/btn3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="18dp"
        android:layout_marginBottom="8dp"
        android:background="?attr/selectableItemBackgroundBorderless"
        android:tint="@color/grey_40"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@+id/btn2"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more_vert" />

    <ImageButton
        android:id="@+id/btn4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="18dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        android:background="?attr/selectableItemBackgroundBorderless"
        android:tint="@color/grey_40"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/btn5"
        app:layout_constraintStart_toEndOf="@+id/btn3"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more_vert" />

    <ImageButton
        android:id="@+id/btn5"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="18dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        android:background="?attr/selectableItemBackgroundBorderless"
        android:tint="@color/grey_40"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more_vert" />

</android.support.constraint.ConstraintLayout>

Ответы [ 3 ]

0 голосов
/ 22 декабря 2018

Вы должны создать цепочку и установить:

app:layout_constraintHorizontal_chainStyle=”spread”

Здесь у вас есть некоторый ресурс о создании цепочек с ConstraintLayout: https://constraintlayout.com/basics/create_chains.html

Обновление:

Пример

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

<ImageButton
    android:id="@+id/imageView1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toStartOf="@id/imageView2"
    app:layout_constraintHorizontal_chainStyle="spread"
    android:src="@mipmap/ic_launcher"/>

<ImageButton
    android:id="@+id/imageView2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constraintStart_toEndOf="@id/imageView1"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toStartOf="@id/imageView3"
    android:src="@mipmap/ic_launcher"/>

<ImageButton
    android:id="@+id/imageView3"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constraintStart_toEndOf="@id/imageView2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toStartOf="@id/imageView4"
    android:src="@mipmap/ic_launcher"/>

<ImageButton
    android:id="@+id/imageView4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constraintStart_toEndOf="@id/imageView3"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toStartOf="@id/imageView5"
    android:src="@mipmap/ic_launcher"/>

<ImageButton
    android:id="@+id/imageView5"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:layout_constraintStart_toEndOf="@id/imageView4"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    android:src="@mipmap/ic_launcher"/>

result

0 голосов
/ 22 декабря 2018

пожалуйста, попробуйте этот код.В этом коде я использую макет ограничения и три кнопки.и я выровняю эти кнопки на одинаковом расстоянии, используя: , выполните следующие действия: 1.drag и drop views.2. выберите вид, который вы хотите интервал между ними.3. щелкните правой кнопкой мыши и выберите упорядочить -> упаковать горизонтально.4. после этого снова выберите и -> центр -> по горизонтали.

и, наконец, просмотры задаются с одинаковым пространством.вот так ..

снимок экрана третьего шага снимок экрана второго шага

Я надеюсь, что это сработает для вас.Благодарю. код

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

<Button
    android:id="@+id/button4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button"
    tools:layout_editor_absoluteX="129dp"
    tools:layout_editor_absoluteY="245dp" />

<Button
    android:id="@+id/button9"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button"
    tools:layout_editor_absoluteX="33dp"
    tools:layout_editor_absoluteY="245dp" />

<Button
    android:id="@+id/button10"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button"
    tools:layout_editor_absoluteX="225dp"
    tools:layout_editor_absoluteY="245dp" />

0 голосов
/ 22 декабря 2018

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

В настоящий момент не может дать правильный код, но псевдокод будет выглядеть следующим образом

constraint layout
    linear layout - orientation:horizontal
        button1
        button2
        button3
        button4
        button5
    \linear layout
\constraint layout
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...