Skip to content

Instantly share code, notes, and snippets.

@MarsVard

MarsVard/README

Last active Nov 15, 2020
Embed
What would you like to do?
android drawable to imitate google cards.
put card.xml in your drawables directory, put colors.xml in your values directory or add the colors to your colors.xml file.
set the background of a view to card,
as you can see in card.xml the drawable handles the card margin, so you don't have to add a margin to your view
``` xml
<View
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/card"
/>
```
(here is a screenshot of what the cards look like)[http://i.imgur.com/XFbovuI.png]
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<padding android:top="10dp" android:right="10dp" android:bottom="5dp" android:left="10dp" />
<solid android:color="@color/transparent" />
</shape>
</item>
<item>
<shape>
<padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" />
<solid android:color="@color/card_shadow_1" />
<corners android:radius="2dp" />
</shape>
</item>
<item>
<shape>
<padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" />
<solid android:color="@color/card_shadow_2" />
<corners android:radius="2dp" />
</shape>
</item>
<!-- Background -->
<item>
<shape >
<solid android:color="@color/card_background" />
<corners android:radius="2dp" />
</shape>
</item>
</layer-list>
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="transparent">#00000000</color>
<!-- card colors -->
<color name="card_background">#ffffff</color>
<color name="card_shadow_1">#d4d4d4</color>
<color name="card_shadow_2">#dddddd</color>
<color name="card_detailing">#eee</color>
</resources>
@aemxn

This comment has been minimized.

Copy link

@aemxn aemxn commented Oct 25, 2015

Thanks

@hirenkapuria

This comment has been minimized.

Copy link

@hirenkapuria hirenkapuria commented Nov 3, 2015

Thank you so much

@ahujakaran24

This comment has been minimized.

Copy link

@ahujakaran24 ahujakaran24 commented Nov 4, 2015

Wowo thumbs up +1

@dbarwacz

This comment has been minimized.

Copy link

@dbarwacz dbarwacz commented Dec 22, 2015

You could as well use system parameter: "@android:color/transparent"

@mrmodise

This comment has been minimized.

Copy link

@mrmodise mrmodise commented Jan 23, 2016

Very much appreciated

@RaviDhoriya

This comment has been minimized.

Copy link

@RaviDhoriya RaviDhoriya commented Feb 11, 2016

That's perfect!! (y)

@emanuelthedude

This comment has been minimized.

Copy link

@emanuelthedude emanuelthedude commented Mar 12, 2016

i like :)

@cooliscool

This comment has been minimized.

Copy link

@cooliscool cooliscool commented Apr 14, 2016

Really cool ! Thanks :)
A short question :
Is there a better way to design drawables other than looking at the preview in android studio ?

@shashanthk

This comment has been minimized.

Copy link

@shashanthk shashanthk commented Oct 8, 2016

This is awesome. Thank you and +1 for the work...

@lovebdsobuj

This comment has been minimized.

Copy link

@lovebdsobuj lovebdsobuj commented Feb 26, 2017

How to add click effect color?

@ade-akinyede

This comment has been minimized.

Copy link

@ade-akinyede ade-akinyede commented Oct 4, 2019

Thank you for this :)

@kunalpat25

This comment has been minimized.

Copy link

@kunalpat25 kunalpat25 commented Jun 21, 2020

Thank you so much!

@jiahaoliuliu

This comment has been minimized.

Copy link

@jiahaoliuliu jiahaoliuliu commented Nov 15, 2020

Good job!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment