Im using this cardview (blue) and another one in an recyclerview to display messages sent and received.
But the cardview (blue) goes over the whole width as you can see int the picture and I cant stop it.
<?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="wrap_content">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:maxWidth="200dp"
app:cardBackgroundColor="#147EFB"
app:cardCornerRadius="25dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="match_parent">
<TextView
android:id="@+id/OutgoingSender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="15dp"
android:layout_marginEnd="90dp"
android:text="No sender available"
android:textColor="#FFFFFFFF"
android:textStyle="bold"
app:layout_constraintEnd_toStartOf="@+id/OutgoingDate"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/OutgoingDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginEnd="15dp"
android:text="No date"
android:textColor="#FFFFFFFF"
android:textStyle="italic"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/OutgoingContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginBottom="15dp"
android:text="No message content available"
android:textColor="#FFFFFFFF"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="@+id/OutgoingSender"
app:layout_constraintTop_toBottomOf="@+id/OutgoingSender" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
I tried to change the root elements width, and to restrict the maxWidth of the cardview but neither helped.
try following code snippet. It will move whole card view to the right and wrap the content around it. I see unnecessary usage of ConstraintLayout as a root. CardView itself can serve as parent and this will also optimize the layout rendering a bit. I hope this helps
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
app:cardCornerRadius="8dp"
app:cardElevation="4dp"
android:layout_gravity="end">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/OutgoingSender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
android:layout_marginTop="15dp"
android:layout_marginEnd="90dp"
android:text="No sender available"
android:textColor="#FFFFFFFF"
android:textStyle="bold"
app:layout_constraintEnd_toStartOf="@+id/OutgoingDate"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/OutgoingDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginEnd="15dp"
android:text="No date"
android:textColor="#FFFFFFFF"
android:textStyle="italic"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/OutgoingContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:layout_marginBottom="15dp"
android:text="No message content available"
android:textColor="#FFFFFFFF"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="@+id/OutgoingSender"
app:layout_constraintTop_toBottomOf="@+id/OutgoingSender" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>