为什么我的文本在具有左约束时会出现在左侧

Why is my text going out on the left side when it has a left constraint

基本上我想要做的是让 CheckboxTextView 在它的左边右对齐。这是可行的,但是当文本很长时,它会在左边框之外的左侧继续,而不是文本换行。

这是设计工具显示的内容,在 phone 上看起来大致相同:

布局如下:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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/linearLayout"
    android:layout_width="match_parent"
    android:padding="24dp"
    android:layout_height="match_parent">

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/message"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:lineSpacingExtra="3dp"
        android:textColor="@color/secondary_text"
        android:textSize="14sp"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="message" />

    <View
        android:layout_width="0dp"
        android:layout_height="1dp"
        app:layout_constraintTop_toTopOf="@+id/always_do_this_checkbox_label"
        app:layout_constraintLeft_toLeftOf="@+id/message"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintRight_toLeftOf="@+id/always_do_this_checkbox_label"
        android:id="@+id/spacer" />

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/always_do_this_checkbox_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:lineSpacingExtra="3dp"
        android:layout_marginTop="4dp"
        android:textColor="@color/secondary_text"
        android:textSize="14sp"
        android:layout_marginRight="16dp"
        app:layout_constraintTop_toTopOf="@+id/always_do_this"
        app:layout_constraintLeft_toRightOf="@+id/spacer"
        app:layout_constraintRight_toLeftOf="@+id/always_do_this"
        tools:text="this is is super long text that will probably wrap as soon as it" />

    <com.google.android.material.checkbox.MaterialCheckBox
        android:id="@+id/always_do_this"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:layout_marginTop="24dp"
        app:layout_constraintTop_toBottomOf="@+id/message"
        app:layout_constraintLeft_toRightOf="@+id/always_do_this_checkbox_label"
        app:layout_constraintRight_toRightOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

我做错了什么?

编辑:需要说明的是,对于长文本,问题在于它会出现在左侧。但它适用于短文本,一切都是右对齐的。已建议的一些解决方案将修复它以用于长文本,但最终会破坏它以用于短文本。两者都必须有效。

因为你不使用 layout_constrainedWidth 而你的 always_do_this_checkbox_label TextView 有一个 layout_constraintLeft_toRightOf 必须是 layout_constraintLeft_toLeftOf 并且 app:layout_constraintHorizontal_bias 必须是1 和 app:layout_constraintHorizontal_chainStyle 必须 packed,因此将您的 TextView 更改为:

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/always_do_this_checkbox_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:lineSpacingExtra="3dp"
        android:layout_marginTop="4dp"
        android:textColor="@color/secondary_text"
        android:textSize="14sp"
        android:layout_marginRight="16dp"
        app:layout_constrainedWidth="true"
        app:layout_constraintHorizontal_bias="1"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintTop_toTopOf="@+id/always_do_this"
        app:layout_constraintLeft_toLeftOf="@+id/spacer"
        app:layout_constraintRight_toLeftOf="@+id/always_do_this"
        tools:text="this is is super long text that will probably wrap as soon as it" />

您可以尝试布局供您参考:

 <androidx.constraintlayout.widget.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/linearLayout"
    android:layout_width="match_parent"
    android:padding="24dp"
    android:layout_height="match_parent">

    <androidx.appcompat.widget.AppCompatTextView
        android:id="@+id/message"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:lineSpacingExtra="3dp"
        android:textColor="@android:color/black"
        android:textSize="14sp"
        android:gravity="end"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="message" />

    <View
        android:layout_width="0dp"
        android:layout_height="1dp"
        app:layout_constraintTop_toTopOf="@+id/always_do_ths"
        app:layout_constraintLeft_toLeftOf="@+id/message"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintRight_toLeftOf="@+id/always_do_label"
        android:id="@+id/spacer" />

    <TextView
        android:id="@+id/always_do_label"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="this is is super long, loong, lonng, longg Text that will probably wrap as soon as it"
        android:textSize="14sp"
        android:layout_marginTop="5dp"
        app:layout_constraintStart_toStartOf="@id/message"
        app:layout_constraintTop_toBottomOf="@+id/message"
        app:layout_constraintEnd_toStartOf="@+id/always_do_ths"/>


    <androidx.appcompat.widget.AppCompatCheckBox
        android:id="@+id/always_do_ths"
        android:layout_width="32dp"
        android:layout_height="32dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/message"
        app:layout_constraintBottom_toBottomOf="@+id/always_do_label"/>
    
    <View
        android:id="@+id/spacer_2"
        android:layout_width="0dp"
        android:layout_height="1dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/always_do_label"
        android:layout_marginTop="10dp"/>

    <androidx.appcompat.widget.AppCompatTextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintWidth_percent="0.85"
        android:text="really long text with lots n lots of data to display and with\nstill filling with some random data...."
        android:textSize="14sp"
        app:layout_constraintTop_toBottomOf="@+id/spacer_2"
        app:layout_constraintStart_toStartOf="parent"/>

    <androidx.appcompat.widget.AppCompatCheckBox
        android:layout_width="32dp"
        android:layout_height="32dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@id/spacer_2"
        app:layout_constraintWidth_percent="0.15"/>
    
</androidx.constraintlayout.widget.ConstraintLayout>

为了更清晰起见,我添加了两个示例布局,您可以使用其中一个。对于要右对齐的文本,您可以使用重力作为结束或右对齐。