在视图上指定最大约束百分比

Question

问题

为任何视图指定最大约束百分比。

例如-

在下面的案例中，我有 2 个左视图和 2 个右视图。

我想限制权利最多占整个宽度的 50%。
左边的物品优先，这意味着他们可以获得尽可能多的space。所以，如果任何左边的项目足够大，它可以移动右边的项目并缩小它们。

我尝试了以下方法，但这似乎不起作用，即当 right1 或 right2 文本变得足够长时，它会优先选择并获得超过 50% 的宽度。

目前，约束布局可能不支持这个，但是有什么办法可以实现这个吗？

XML

<?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/section_item_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/left_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constrainedWidth="true"
        app:layout_constraintBottom_toTopOf="@id/left_2"
        app:layout_constraintEnd_toStartOf="@id/l_container"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="spread"
        tools:text="Leftsadasdasdadsdasdasdhsjakjdhaskkjdhdjakskjhkjdashkjddasdasdsaadsdasd1" />

    <TextView
        android:id="@+id/left_2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@id/l_container"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintStart_toStartOf="@id/left_1"
        app:layout_constraintTop_toBottomOf="@id/left_1"
        tools:text="Left2" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guide"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.5" />

    <androidx.constraintlayout.widget.Barrier
        android:id="@+id/right_barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:barrierDirection="start"
        app:constraint_referenced_ids="l_container" />

    <LinearLayout
        android:id="@+id/l_container"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_min="wrap"
        app:layout_constraintWidth_max="wrap"
        app:layout_constraintWidth_percent="0.5">

        <TextView
            android:id="@+id/right_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:maxLines="1"
            app:layout_constrainedWidth="true"
            app:layout_constraintBottom_toTopOf="@+id/right_2"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="1"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_chainStyle="packed"
            tools:text="Right1"
            tools:visibility="visible" />

        <TextView
            android:id="@+id/right_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="end"
            app:layout_constrainedWidth="true"
            app:layout_constraintBottom_toBottomOf="@id/left_2"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="1"
            app:layout_constraintTop_toBottomOf="@+id/right_1"
            tools:text="Right2"
            tools:visibility="visible" />

    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Answer 1

我随意简化了此插图的布局，但您应该能够根据以下内容重建您的布局。

<androidx.constraintlayout.widget.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/left_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constrainedWidth="false"
        app:layout_constraintEnd_toStartOf="@id/right_barrier"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="Not so long" />

    <androidx.constraintlayout.widget.Barrier
        android:id="@+id/right_barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:barrierDirection="start"
        app:constraint_referenced_ids="right_1" />

    <TextView
        android:id="@+id/right_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constrainedWidth="true"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1"
        app:layout_constraintStart_toEndOf="@id/right_barrier"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_max="wrap"
        app:layout_constraintWidth_percent="0.5"
        android:text="very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very " />

</androidx.constraintlayout.widget.ConstraintLayout>

产生这个：

增加 left_1 中的文本长度会导致左视图侵占屏幕的右半部分。

layout_constrainedWidth 和 layout_constraintWidth_max 是布局中感兴趣的内容。

在视图上指定最大约束百分比

Specify max constraint percentage on a view

android

android-constraintlayout

问题

XML