Выровнять по левому краю наибольшего вида с макетом ограничения

Question

Выровнять по левому краю наибольшего вида с макетом ограничения

1

Привет, я пытаюсь посмотреть расписание. Если пользователь как-то настраивается на дисплей 24 часа или нет, формат часов работы меняется. И когда-нибудь магазин будет закрыт. Строка Closed является динамической, она может происходить каждый день из VM.days.get(X).time

Итак, вот что я получил на данный момент:

Я хочу выровнять закрытое слева от часа.

Здесь мой ConstraintLayout

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="@dimen/base_space">

    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/small_space"
        android:text="@{VM.title}"
        android:textStyle="bold"
        tools:text="Heures de la semaine" />

    <android.support.constraint.Barrier
        android:id="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:barrierDirection="start"
        app:constraint_referenced_ids="first_time,second_time,third_time,fourth_time,fifth_time,sixth_time" />

    <TextView
        android:id="@+id/first_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(0).day}"
        android:textColor="@{VM.days.get(0).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(0).isBold}"
        app:layout_constraintTop_toBottomOf="@id/title"
        tools:text="Sunday" />

    <TextView
        android:id="@+id/first_time"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(0).time}"
        android:textColor="@{VM.days.get(0).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(0).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/first_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/first_day"
        tools:text="8:30 AM - 9:00 PM" />

    <TextView
        android:id="@+id/second_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(1).day}"
        android:textColor="@{VM.days.get(1).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(1).isBold}"
        app:layout_constraintTop_toBottomOf="@id/first_day"
        tools:text="Monday" />

    <TextView
        android:id="@+id/second_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(1).time}"
        android:textColor="@{VM.days.get(1).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(1).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/second_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/second_day"
        tools:text="Closed" />

    <TextView
        android:id="@+id/third_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(2).day}"
        android:textColor="@{VM.days.get(2).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(2).isBold}"
        app:layout_constraintTop_toBottomOf="@id/second_day"
        tools:text="Tuesday" />

    <TextView
        android:id="@+id/third_time"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(2).time}"
        android:textColor="@{VM.days.get(2).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(2).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/third_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/third_day"
        tools:text="8:00 - 21:00" />

    <TextView
        android:id="@+id/fourth_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(3).day}"
        android:textColor="@{VM.days.get(3).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(3).isBold}"
        app:layout_constraintTop_toBottomOf="@id/third_day"
        tools:text="Wednesday" />

    <TextView
        android:id="@+id/fourth_time"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(3).time}"
        android:textColor="@{VM.days.get(3).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(3).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/fourth_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/fourth_day"
        tools:text="8:00 - 21:00" />

    <TextView
        android:id="@+id/fifth_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(4).day}"
        android:textColor="@{VM.days.get(4).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(4).isBold}"
        app:layout_constraintTop_toBottomOf="@id/fourth_day"
        tools:text="Thursday" />

    <TextView
        android:id="@+id/fifth_time"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(4).time}"
        android:textColor="@{VM.days.get(4).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(4).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/fifth_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/fifth_day"
        tools:text="8:00 - 21:00" />

    <TextView
        android:id="@+id/sixth_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(5).day}"
        android:textColor="@{VM.days.get(5).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(5).isBold}"
        app:layout_constraintTop_toBottomOf="@id/fifth_day"
        tools:text="Friday" />

    <TextView
        android:id="@+id/sixth_time"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(5).time}"
        android:textColor="@{VM.days.get(5).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(5).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/sixth_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/sixth_day"
        tools:text="8:00 - 21:00" />

    <TextView
        android:id="@+id/seventh_day"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(6).day}"
        android:textColor="@{VM.days.get(6).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(6).isBold}"
        app:layout_constraintTop_toBottomOf="@id/sixth_day"
        tools:text="Saturday" />

    <TextView
        android:id="@+id/seventh_time"
        app:layout_constraintLeft_toLeftOf="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(6).time}"
        android:textColor="@{VM.days.get(6).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(6).isBold}"
        app:layout_constraintBottom_toBottomOf="@+id/seventh_day"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@+id/barrier"
        app:layout_constraintTop_toTopOf="@+id/seventh_day"
        tools:text="8:00 - 21:00" />


</android.support.constraint.ConstraintLayout>

Я пытаюсь поместить всю ширину timeUI в 0dp и начать с барьера, до родителя. Но если все время у меня есть эти ограничения, они все исчезают

JCDecary 06 март 2019, в 14:32

Источник

Теги:

android

android-layout

android-constraintlayout

2 ответа

1

Удалено правое/конечное ограничение из "закрытого" представления. Это выровняет его по левому краю:

<TextView
        android:id="@+id/second_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{VM.days.get(1).time}"
        android:textColor="@{VM.days.get(1).highlight ? @color/red : @color/gray}"
        app:isBold="@{VM.days.get(1).isBold}"
        app:layout_constraintBottom_toBottomOf="@id/second_day"
        app:layout_constraintStart_toStartOf="@id/barrier"
        app:layout_constraintTop_toTopOf="@id/second_day"
        tools:text="Closed" />

Кроме того, решите использовать между левым/правым и начальным/конечным ограничениями. Наличие обоих является излишним. Кроме того, когда вы ссылаетесь на представление, нет необходимости включать знак "+" в его имя.

Nikos Hidalgo 06 март 2019, в 11:30

0

закрытое представление является динамическим, оно может измениться, оно определяется VM.days.get (1) .time
JCDecary 06 март 2019, в 13:10
0

Не проще ли просто изменить текст текстового представления, чтобы оно закрывалось этим цветом?
Tamir Abutbul 06 март 2019, в 13:28
0

@JCDecary вы можете изменить свое ограничение программно в зависимости от значения textview (многие потоки здесь предлагают решение для этого - например, stackoverflow.com/questions/41670618/… ). Пока у вас установлены начальные и конечные ограничения, ваш текст будет отображаться посередине.
Nikos Hidalgo 06 март 2019, в 14:17

Показать ещё 1 комментарий

Ещё вопросы

закрытое представление является динамическим, оно может измениться, оно определяется VM.days.get (1) .time
Не проще ли просто изменить текст текстового представления, чтобы оно закрывалось этим цветом?
@JCDecary вы можете изменить свое ограничение программно в зависимости от значения textview (многие потоки здесь предлагают решение для этого - например, stackoverflow.com/questions/41670618/… ). Пока у вас установлены начальные и конечные ограничения, ваш текст будет отображаться посередине.

Karim · Accepted Answer · 2019-03-06T11-01-00.000Z

Есть много решений для этого:

1- Используйте FrameLayout с 2 вертикальными LinearLayouts (позиции начинаются и заканчиваются)

2- Если вы настаиваете на использовании макета ограничения, вы можете попытаться задать ширину текстового обзора (особенно справа)

3- Я действительно не уверен, что произойдет, но вы можете попробовать сделать закрытую по ширине match_parent вместо wrap_content

Я, когда с вашим решением, я сделал linearLayout, с 3 просмотра (обернуть / весить 1 / обернуть)