Question

我正在尝试在应用程序内进行约束布局，而在使用约束布局创建布局时，我只是停留在某一点。

我想将最大宽度 70％设置为Root ViewGroup约束布局。

Answer 1

这是我的聊天用XML，它显示了我尝试过的与您的gist相同的味精，但没有用。所以我创建了这个

    <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minWidth="200dp"
    android:paddingTop="5dp"
    android:paddingBottom="5dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/cl_received"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="@dimen/height_100dp"
        android:background="@drawable/bg_chat_item_received"
        android:padding="5dp"
        android:visibility="visible"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <!-- your ui goes here -->
    </androidx.constraintlayout.widget.ConstraintLayout>
</RelativeLayout>

Answer 2

您可以在主布局中使用垂直指引，像这样的百分比为0.7

<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:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#43B2FD"
    android:padding="6dp"
    app:layout_constraintWidth_max="wrap"
    app:layout_constraintWidth_percent=".7">


    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.7" />
                       .
                       .
                       .

然后像这样将内部布局的结尾约束到该准则

<androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/csReply"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="#20606060"
        app:layout_constraintBottom_toTopOf="@+id/tvMsg"
        app:layout_constraintEnd_toStartOf="@+id/guideline"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

Answer 3

您应将所有布局放到另一个布局中，并使用百分比为0.7的准则并像这样将内部布局（蓝色布局）约束到该准则


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

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.7"/>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintHorizontal_weight="1.0"
        android:background="#43B2FD"
        android:padding="6dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="@+id/guideline"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintWidth_max="wrap">


        <androidx.constraintlayout.widget.ConstraintLayout
            android:id="@+id/csReply"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="#20606060"
            app:layout_constraintBottom_toTopOf="@+id/tvMsg"
            app:layout_constraintEnd_toStartOf="@+id/barrier"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintWidth_percent="0.7">

            <TextView

                android:id="@+id/tvVerticalLine"
                android:layout_width="5dp"
                android:layout_height="0dp"
                android:background="#4476FC"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <TextView
                android:id="@+id/tvText"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="4dp"
                android:paddingStart="2dp"
                android:paddingEnd="2dp"
                android:text="sssssssssssss\nsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss"
                app:layout_constrainedWidth="false"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toStartOf="@+id/ivReplyThumbnail"
                app:layout_constraintStart_toEndOf="@+id/tvVerticalLine"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.5" />

            <ImageView
                android:id="@+id/ivReplyThumbnail"
                android:layout_width="36dp"
                android:layout_height="36dp"
                android:adjustViewBounds="true"
                android:background="#F44336"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

        </androidx.constraintlayout.widget.ConstraintLayout>

        <TextView
            android:id="@+id/tvMsg"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="Heressssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss "
            android:textColor="#fff"
            app:layout_constrainedWidth="false"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/csReply"
            app:layout_constraintWidth_percent="0.7"
            tools:layout_editor_absoluteX="5dp"
            tools:layout_editor_absoluteY="75dp" />

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="07:43 PM"
            android:textColor="#fff"
            app:layout_constraintEnd_toStartOf="@id/barrier"
            app:layout_constraintTop_toBottomOf="@+id/tvMsg"
            tools:layout_editor_absoluteX="133dp"
            tools:layout_editor_absoluteY="161dp" />

        <androidx.constraintlayout.widget.Barrier
            android:id="@+id/barrier"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:barrierDirection="end"
            app:constraint_referenced_ids="tvMsg,csReply,textView" />


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

请注意，我刚刚在代码中添加了第一个约束布局和准则，并且还更改了蓝色背景的约束布局的宽度

将最大宽度设置为根视图约束布局

3 个答案: