Search code examples
androidandroid-cardview

Cardview half width of the screen


This is my layout. I am putting in a GridView. I want two columns in GridView which fill the width of the screen. Not able to make CardView layout to fill half of the screen. I followed this link but no result.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="150dp" android:layout_height="wrap_content"
android:gravity="center"
card_view:cardCornerRadius="2dp"
card_view:cardElevation="2sp"
card_view:cardUseCompatPadding="true"
card_view:contentPadding="5dp"
>
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/quote"
        android:text="jalkdjlajflkdajf akjfdlajfljal alfjk"
        android:layout_margin="3dp"
        />
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:layout_marginLeft="2dp"
        android:layout_below="@+id/quote"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/time"
            android:layout_alignParentLeft="true"
            android:text="time started"
            android:layout_centerVertical="true"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button1"
            android:layout_alignParentRight="true"
            android:text="5"
            android:layout_marginLeft="3dp"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button2"
            android:layout_toLeftOf="@+id/button1"
            android:text="5"
            android:layout_marginLeft="3dp"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button3"
            android:layout_toLeftOf="@+id/button2"
            android:text="5"
            android:layout_marginLeft="3dp"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button4"
            android:layout_toLeftOf="@+id/button3"
            android:text="5"
            android:layout_marginLeft="3dp"
            />
    </RelativeLayout>
</RelativeLayout>


Solution

  • Since you are inflating the different layout file for your GridView. Your layout will be rendered as full screen width view. But when you define the no of columns or say span to the GridView, it will have two views side by side exactly the same which you want to achieve.

    So, simply in your GridView tag inside xml just add

    android:numColumns="2"
    

    Or from java code.

    mGridView.setNumColumns(2);