Drawable as Background for CardView

Question

the CardView ( android.support.v7.cardview ) stays white even though I set a backround drawable via android:backround - The documentation gives me the feeling that it should work. No Idea what I am doing wrong here.

looks like it is not possible. Take a look here https://code.google.com/p/android/issues/detail?id=77843 — Blackbelt, Dec 04 '14 at 16:51

Phil · Answer 1 · 2015-12-21T15:42:04.777

I know this is an old question, but I have a simple solution - just make the first child of your CardView an ImageView and specify the scale type to fitXY. You can get rid of the extra CardView padding by setting cardElevation and cardMaxElevation to 0dp:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    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="200dp"
    app:cardCornerRadius="4dp"
    app:cardElevation="0dp"
    app:cardMaxElevation="0dp">

    <ImageView
        android:src="@drawable/your_background"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"/>

    <... your layout

    .../>


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

Is there a way to do this without giving up the shadow from the elevation? — amitavk, Apr 18 '18 at 15:05

score 19 · Answer 2 · answered Sep 22 '16 at 09:15

19

for drawable or color just use:

cvSellerShopp.setBackgroundResource(R.drawable.ic_action_add_image);

for color use:

 cvSellerShopp.setCardBackgroundColor(R.color.colorPrimary);

but this one does not produce the intended results

answered Sep 22 '16 at 09:15

vikas kumar

10,447
2
46
52

score 14 · Answer 3 · answered Oct 12 '16 at 15:26

Make Cardview will host one viewgroup for eg relative layout in this case and then simply set any background to relative layout.

<?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:id="@+id/list_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5dp"
        card_view:cardCornerRadius="4dp"
        card_view:cardUseCompatPadding="true">

        <RelativeLayout
            android:id="@+id/list_container_bg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:gravity="center"
            android:orientation="vertical">

           <!--Add cardview contents-->

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

score 14 · Answer 4 · answered Nov 18 '18 at 04:33

I got this working by adding a linearlayout in the cardview and then setting cardPreventCornerOverlap to false in the cardview.

   <android.support.v7.widget.CardView
    android:id="@+id/result_cv"
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:layout_margin="4dp"
    app:cardCornerRadius="16dp"
    app:cardElevation="8dp"
    app:cardPreventCornerOverlap="false"
    >

     <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/gradient"
        android:gravity="center"
        >

       <!-- your views -->

    </LinearLayout>

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

score 7 · Answer 5 · edited Feb 18 '19 at 10:16

7

The command I used was:

cardView.setBackgroundResource(R.drawable.card_view_bg);

where card_view_bg is a custom XML resource file.

If you have some layouts inside the card view and these layouts are overlapping with the margins of the card view then you might need a separate custom background resource file for the layouts like the one I used for the card view background itself.

edited Feb 18 '19 at 10:16

סטנלי גרונן

2,917
23
46
68

answered Feb 18 '19 at 09:40

Ankit Deshmukh

549
5
11

Virendra Varma · Answer 6 · 2018-01-04T08:29:37.257

Try this

<?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:id="@+id/list_container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_margin="5dp"
    card_view:cardCornerRadius="4dp"
    card_view:cardUseCompatPadding="true">

    <RelativeLayout
        android:id="@+id/list_container_bg"
        android:layout_width="match_parent"
        android:background="@drawable/yourbackground"
        android:layout_height="match_parent">

       <!--Add cardview contents-->

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

card_view:cardBackgroundColor="@android:color/holo_green_dark

here you can set any color or make it transparent by giving color transparent and if u wand some drawable like image or svg put RelativeLayout background

score 4 · Answer 7 · answered Mar 01 '18 at 17:57

You can use LinearLayout or Relative layout inside CardView and set drawable background it like below :

<android.support.v7.widget.CardView
    android:id="@+id/card6"
    android:layout_width="180dp"
    android:layout_height="wrap_content"
    android:layout_marginRight="8dp"
    android:layout_marginTop="10dp"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/card4"
    app:cardCornerRadius="10dp"
    app:cardElevation="4dp"
    app:cardMaxElevation="8dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:background="@drawable/card_bg"
        android:padding="10dp">

        <ImageView
            android:id="@+id/card6Image"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="center_horizontal"
            android:src="@mipmap/ic_launcher_round" />

        <TextView
            android:id="@+id/card6Title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:padding="5dp"
            android:text="Daily Check In"
            android:textColor="#ffffff"
            android:textSize="15sp" />

        <TextView
            android:id="@+id/card6Description"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="5dp"
            android:text="Just Check in Daily and Earn Credits"
            android:textColor="#ffffff"
            android:textSize="10sp" />
    </LinearLayout>

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

Below is my Drawable resource file :

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle" >
<gradient
    android:angle="90"
    android:centerColor="#555994"
    android:endColor="#b5b6d2"
    android:startColor="#555994"
    android:type="linear" />

<corners
    android:radius="0dp"/>

score 4 · Answer 8 · answered Sep 08 '20 at 11:59

you can set foreground as follow for the card view to set custom bg

android:foreground="@drawable/bg"

and here is the transparent bg.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@android:color/transparent" />
    <stroke
        android:width="1dp"
        android:color="#d9d9d9" />
    <corners android:radius="4dp" />
    <padding
        android:bottom="0dp"
        android:left="0dp"
        android:right="0dp"
        android:top="0dp" />
</shape>

Константин Семочкин · Answer 9 · 2020-12-03T05:33:18.873

You have 2 possible solutions.

Setting background programmatically:

cardView.setBackgroundResource(R.drawable.background)

Add some child to cardview that will fill cardview's bounds and set background on it:

<android.support.v7.widget.CardView
...>
     <ConstraintLayout
        android:background="@drawable/background"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.v7.widget.CardView>

This way you can also give images some shape that you can configure by the shape of cardview. Disadvantage is that it is bad for performance.

score 0 · Answer 10 · answered Jun 24 '20 at 16:04

0

if you want change background color on cardView just add this code on your cardview XML

app:cardBackgroundColor="@color/whatever_color_you"

answered Jun 24 '20 at 16:04

Adhim Bagas

131
1
3

score 0 · Answer 11 · answered Apr 17 '21 at 10:06

0

Try this code:

cardView.setForeground(getResources().getDrawable(R.drawable.your_drawable));

answered Apr 17 '21 at 10:06

Mohsents

691
11
9

score 0 · Answer 12 · edited Mar 24 '22 at 13:56

0

sCard.setBackgroundResource(R.drawable.scard_background);

edited Mar 24 '22 at 13:56

Henry Ecker

34,399
18
41
57

answered Mar 24 '22 at 12:56

Khizar Warraich

21
5

score -1 · Answer 13 · answered Apr 20 '20 at 12:40

-1

You can simply use the below line in your xml file.

app:cardBackgroundColor="@drawable/your_custom_theme_here"

answered Apr 20 '20 at 12:40

Harshil Shah

537
4
15

Why was this answer disliked? This worked for me. – Michal Zhradnk Nono3551 Mar 24 '21 at 10:37
Because the question is about drawable not color. – David Apr 03 '21 at 16:01

Drawable as Background for CardView

13 Answers13

Linked

Related