Each card in the card view has different width

Question

I'm using AndroidStudio 3.2.1 and Java. I have a RecyclerView where the items are displayed using a CardView. My code works fine. However, each card has different width based on its content. What I need is that all cards have the same width as the parent width. I think this is a layout problem. I hope someone know how to fix this. Thank you.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="5dp">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="8dp">

            <ImageView
                android:id="@+id/imageView"
                android:layout_width="120dp"
                android:layout_height="90dp"
                android:padding="4dp" />

            <TextView
                android:id="@+id/textViewTitle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_toRightOf="@id/imageView"
                android:text="Apple MacBook Air Core i5 5th Gen - (8 GB/128 GB SSD/Mac OS Sierra)"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
                android:textColor="#000000" />

            <TextView
                android:id="@+id/textViewShortDesc"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/textViewTitle"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:layout_toRightOf="@id/imageView"
                android:text="13.3 Inch, 256 GB"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small" />

            <TextView
                android:id="@+id/textViewRating"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/textViewShortDesc"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:layout_toRightOf="@id/imageView"
                android:background="@color/colorPrimary"
                android:paddingLeft="15dp"
                android:paddingRight="15dp"
                android:text="4.7"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Small.Inverse"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/textViewPrice"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/textViewRating"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="5dp"
                android:layout_toRightOf="@id/imageView"
                android:text="INR 56990"
                android:textAppearance="@style/Base.TextAppearance.AppCompat.Large"
                android:textStyle="bold" />

        </RelativeLayout>

    </android.support.v7.widget.CardView>

</LinearLayout>

What is expected is equal width for each card that covers the parent width. However, the actual result is each card has a different width based on its content

score 0 · Accepted Answer · answered Jan 25 '19 at 22:32

0

Just change you TextViews property to match parent. If that Does not work put your relative inside a LinearLayout or Change your Relative to LinearLayout with orientation set to vertical

android:layout_width="match_parent"

You might also need to add this.

app:cardUseCompatPadding="true"

answered Jan 25 '19 at 22:32

skryshtafovych

572
4
16

Just changing the width of components to Match Parent did the job. Thank you. – Osama Al-Haj Hassan Jan 26 '19 at 08:03

Each card in the card view has different width

1 Answers1