Saya mencoba menerapkan gelembung obrolan sederhana menggunakan a ConstraintLayout. Inilah yang saya coba capai:

Namun, wrap_content sepertinya tidak berfungsi dengan baik dengan kendala. Itu menghormati margin, tetapi tidak menghitung ruang yang tersedia dengan benar. Inilah tata letak saya:

<?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>

Ini membuat sebagai berikut:

Saya menggunakan com.android.support.constraint:constraint-layout:1.0.0-beta4.

Apakah saya melakukan sesuatu yang salah? Apakah itu bug atau hanya perilaku yang tidak intuitif? Dapatkah saya mencapai perilaku yang tepat menggunakan a ConstraintLayout(Saya tahu saya bisa menggunakan tata letak lain, saya bertanya ConstrainLayoutsecara spesifik).

Kedaluwarsa: Lihat jawaban yang lebih baik

Tidak, Anda tidak dapat melakukan apa yang Anda inginkan dengan ConstraintLayout seperti sekarang (1.0 beta 4):

• wrap_content hanya meminta widget untuk mengukur sendiri, tetapi tidak akan membatasi ekspansi terhadap kendala yang akhirnya
• match_constraints(0dp) akan membatasi ukuran widget terhadap batasan ... tetapi akan mencocokkannya meskipun ukurannya wrap_contentlebih kecil (contoh pertama Anda), yang juga bukan yang Anda inginkan.

Jadi sekarang, Anda kurang beruntung untuk kasus tertentu: - /

Sekarang ... kami sedang berpikir tentang menambahkan kemampuan ekstra match_constraintsuntuk menangani skenario yang tepat ini (berlaku sebagaiwrap_content -olah ukurannya lebih dari kendala).

Saya tidak bisa menjanjikan bahwa fitur baru ini akan membuatnya sebelum rilis 1.0 sekalipun.

Sunting : kami menambahkan kemampuan ini di 1.0 dengan atribut app:layout_constraintWidth_default="wrap"(dengan lebar diatur ke 0dp). Jika disetel, widget akan memiliki ukuran yang sama seperti jika menggunakan wrap_content, tetapi akan dibatasi oleh batasan (artinya tidak akan meluas di luarnya)

Perbarui Sekarang tag-tag tersebut sudah tidak digunakan lagi, sebagai gantinya gunakan layout_width = "WRAP_CONTENT" dan layout_constrainedWidth = "true".

Diperbarui (ConstraintLayout 1.1. +)

Gunakan app:layout_constrainedWidth="true"denganandroid:layout_width="wrap_content"

Sebelumnya (usang):

app:layout_constraintWidth_default="wrap" dengan android:layout_width="0dp"

Yap, seperti disebutkan dalam jawaban yang diberikan oleh Nikolas Roard, Anda harus menambahkan app:layout_constraintWidth_default="wrap"dan mengatur lebar ke 0dp. Dan untuk meluruskan gelembung Anda, Anda harus mengatur 1,0 untuk layout_constraintHorizontal_bias.

Berikut kode sumber terakhir:

<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>

Hasilnya terlihat seperti:

Seperti jawaban lain yang sudah dikatakan, karena ConstraintLayout 1.0 dimungkinkan untuk mencapai itu, tetapi pada rilis terbaru (1.1.x) mereka telah mengubah cara Anda melakukannya.

Sejak rilis ConstraintLayout 1.1 yang lama app:layout_constraintWidth_default="wrap"dan app:layout_constraintHeight_default="wrap"atribut sekarang sudah usang .

Jika Anda ingin memberikan wrap_contentperilaku, tetapi tetap memberlakukan batasan pada Tampilan Anda, Anda harus mengatur lebar dan / atau tingginya untuk wrap_contentdigabungkan dengan app:layout_constrainedWidth=”true|false”dan / atau app:layout_constrainedHeight=”true|false”atribut, sebagaimana dinyatakan pada dokumen :

WRAP_CONTENT: menegakkan batasan (Ditambahkan dalam 1.1) Jika dimensi diatur ke WRAP_CONTENT, dalam versi sebelum 1.1 mereka akan diperlakukan sebagai dimensi literal - artinya, batasan tidak akan membatasi dimensi yang dihasilkan. Meskipun secara umum ini sudah cukup (dan lebih cepat), dalam beberapa situasi, Anda mungkin ingin menggunakan WRAP_CONTENT, namun tetap menerapkan batasan untuk membatasi dimensi yang dihasilkan. Dalam hal ini, Anda dapat menambahkan salah satu atribut yang sesuai:

app: layout_constrainedWidth = ”true | false” app: layout_constrainedHeight = ”true | false”

Adapun rilis terbaru, pada saat saya sudah menjawab ini, ConstraintLayout ada di versi 1.1.2 .

@ nicolas-roard menjawab app:layout_constraintWidth_default="wrap"dan android:layout_width="0dp"sekarang DIHAPUSKAN .

Silakan dan gunakan app:layout_constrainedWidth="true"danandroid:layout_width="wrap_content" .

Alasan penghinaan, saya tidak tahu. Tetapi haknya dalam kode sumber ConstraintLayout

Saya menggunakan yang ini

app:layout_constraintEnd_toEndOf="parent"

Anda harus mengganti

android:layout_width="wrap_content"

dengan

android:layout_width="match_parent"

dari TextView Anda dan kemudian sesuaikan bantalan dan margin sesuai. Saya telah memperbarui kode Anda,

<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." />

Anda akan mendapatkan hasil ini