ConstraintLayoutฉันกำลังพยายามที่จะใช้ฟองง่ายแชทโดยใช้ นี่คือสิ่งที่ฉันพยายามบรรลุ:

อย่างไรก็ตามwrap_contentดูเหมือนจะไม่ทำงานอย่างถูกต้องกับข้อ จำกัด มันเคารพระยะขอบ แต่ไม่คำนวณพื้นที่ว่างที่เหมาะสม นี่คือเค้าโครงของฉัน:

<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content">

    <TextView
        android:id="@+id/chat_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="16dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_bias="0"
        tools:background="@drawable/chat_message_bubble"
        tools:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sodales accumsan tortor at bibendum."
        android:layout_marginStart="64dp"
        android:layout_marginLeft="64dp"
        android:layout_marginEnd="32dp"
        android:layout_marginRight="32dp"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp" />
</android.support.constraint.ConstraintLayout>

แสดงผลดังนี้:

com.android.support.constraint:constraint-layout:1.0.0-beta4ฉันใช้

ฉันกำลังทำอะไรผิดหรือเปล่า? มันเป็นข้อบกพร่องหรือเพียงแค่พฤติกรรมที่ไม่ได้ใช้งานง่าย? ฉันสามารถใช้พฤติกรรมที่เหมาะสมโดยใช้ConstraintLayout(ฉันรู้ว่าฉันสามารถใช้เลย์เอาต์อื่น ๆ ที่ฉันถามConstrainLayoutโดยเฉพาะ)

ล้าสมัย: ดูคำตอบที่ดีกว่า

ไม่คุณไม่สามารถทำสิ่งที่คุณต้องการด้วย ConstraintLayout ได้ในวันนี้ (1.0 beta 4):

• wrap_content ขอให้วิดเจ็ตวัดเท่านั้นเอง แต่จะไม่ จำกัด การขยายตัวเมื่อเทียบกับข้อ จำกัด ในที่สุด
• match_constraints(0dp) จะจำกัด ขนาดของวิดเจ็ตกับข้อ จำกัด ... แต่จะจับคู่แม้ว่าwrap_contentจะเล็กกว่า (ตัวอย่างแรกของคุณ) ซึ่งไม่ใช่สิ่งที่คุณต้องการ

ดังนั้นตอนนี้คุณไม่มีโชคสำหรับกรณีนั้น: - /

ตอนนี้ ... เรากำลังคิดที่จะเพิ่มความสามารถพิเศษเพื่อที่match_constraintsจะจัดการกับสถานการณ์ที่แน่นอนนี้ (ทำตัวเป็นwrap_contentเว้นเสียแต่ว่าขนาดจะสิ้นสุดมากกว่าข้อ จำกัด )

ฉันไม่สามารถรับประกันได้ว่าฟีเจอร์ใหม่นี้จะทำก่อนปล่อย 1.0

แก้ไข : เราเพิ่มความสามารถนี้ใน 1.0 ด้วยแอตทริบิวต์app:layout_constraintWidth_default="wrap"(โดยตั้งค่าความกว้างเป็น 0dp) หากตั้งค่าวิดเจ็ตจะมีขนาดเท่ากับว่าใช้ wrap_content แต่จะถูก จำกัด โดยข้อ จำกัด (กล่าวคือจะไม่ขยายเกินกว่า)

อัปเดตทันที แท็กเหล่านั้นเลิกใช้แล้วแทนที่จะใช้ layout_width = "WRAP_CONTENT" และ layout_constrainedWidth = "true"

อัปเดต (ข้อ จำกัด เค้าโครง 1.1. +)

ใช้app:layout_constrainedWidth="true"กับandroid:layout_width="wrap_content"

ก่อนหน้านี้ (คัดค้าน):

app:layout_constraintWidth_default="wrap" กับ android:layout_width="0dp"

ใช่ดังที่ได้กล่าวไว้ในคำตอบของNikolas Roardคุณควรเพิ่มapp:layout_constraintWidth_default="wrap"และตั้งค่าความกว้างเป็น 0 dp และเพื่อให้สอดคล้องขวาฟองของคุณคุณควรตั้ง layout_constraintHorizontal_bias1.0

นี่คือซอร์สโค้ดสุดท้าย:

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:id="@+id/chat_message"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:layout_marginTop="8dp"
        android:layout_marginStart="64dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintWidth_default="wrap"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:background="@drawable/chat_message_bubble"
        android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sodales accumsan tortor at bibendum." />

</android.support.constraint.ConstraintLayout>

ดังนั้นดูเหมือนว่า:

เช่นเดียวกับคำตอบอื่น ๆ ที่ได้กล่าวไปแล้วเนื่องจาก ConstraintLayout 1.0 เป็นไปได้ที่จะได้รับสิ่งนั้น แต่เป็นรุ่นล่าสุด (1.1.x) พวกเขาได้เปลี่ยนวิธีที่คุณทำ

ตั้งแต่รุ่นของ ConstraintLayout 1.1 เก่าapp:layout_constraintWidth_default="wrap"และapp:layout_constraintHeight_default="wrap"คุณลักษณะที่จะเลิกใช้ในขณะนี้

หากคุณต้องการแสดงwrap_contentพฤติกรรม แต่ยังคงบังคับใช้ข้อ จำกัด ในมุมมองของคุณคุณควรตั้งค่าความกว้างและ / หรือความสูงให้wrap_contentรวมกับapp:layout_constrainedWidth=”true|false”และ / หรือapp:layout_constrainedHeight=”true|false”แอตทริบิวต์ตามที่ระบุไว้ในเอกสาร :

WRAP_CONTENT: บังคับใช้ข้อ จำกัด(เพิ่มใน 1.1)หากมิติถูกตั้งค่าเป็น WRAP_CONTENT ในเวอร์ชันก่อน 1.1 พวกเขาจะถูกถือว่าเป็นมิติตัวอักษร - ความหมายข้อ จำกัด จะไม่ จำกัด ขนาดผลลัพธ์ แม้ว่าโดยทั่วไปจะเพียงพอ (และเร็วกว่า) ในบางสถานการณ์คุณอาจต้องการใช้ WRAP_CONTENT แต่ยังคงบังคับใช้ข้อ จำกัด เพื่อ จำกัด ขนาดของผลลัพธ์ ในกรณีนั้นคุณสามารถเพิ่มหนึ่งในแอตทริบิวต์ที่เกี่ยวข้อง:

แอพ: layout_constrainedWidth =” จริง | เท็จ” แอป: layout_constrainedHeight =” จริง | เท็จ”

ในฐานะที่เป็นรุ่นล่าสุดโดยเวลาที่ผมเคยตอบนี้ConstraintLayout อยู่ในเวอร์ชัน 1.1.2

@ คำตอบ Nicolas-roard ของapp:layout_constraintWidth_default="wrap"และandroid:layout_width="0dp"ตอนนี้ก็คือเลิก

ไปข้างหน้าและใช้และapp:layout_constrainedWidth="true"android:layout_width="wrap_content"

เหตุผลที่เลิกใช้ฉันไม่รู้ แต่มันถูกต้องในซอร์สโค้ดของ ConstraintLayout

ฉันใช้อันนี้

app:layout_constraintEnd_toEndOf="parent"

คุณควรแทนที่

android:layout_width="wrap_content"

กับ

android:layout_width="match_parent"

จาก TextView ของคุณจากนั้นปรับการขยายและระยะขอบตาม ฉันได้อัปเดตรหัสของคุณแล้ว

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

<TextView
    android:id="@+id/chat_message"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="10dp"
    android:layout_marginLeft="60dp"
    android:layout_marginRight="10dp"
    android:layout_marginStart="60dp"
    android:layout_marginTop="8dp"
    android:padding="16dp"
    app:layout_constraintTop_toTopOf="parent"
    tools:background="#c9c7c7"
    tools:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sodales accumsan tortor at bibendum." />

คุณจะได้รับผลลัพธ์นี้