Android View shadow
Create card_background.xml in the res/drawable folder with the following code:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#BDBDBD"/>
<corners android:radius="5dp"/>
</shape>
</item>
<item
android:left="0dp"
android:right="0dp"
android:top="0dp"
android:bottom="2dp">
<shape android:shape="rectangle">
<solid android:color="#ffffff"/>
<corners android:radius="5dp"/>
</shape>
</item>
</layer-list>
Then add the following code to the element to which you want the card layout
android:background="@drawable/card_background"
the following line defines the color of the shadow for the card
<solid android:color="#BDBDBD"/>
I'm using Android Studio 0.8.6 and I couldn't find:
android:background="@drawable/abc_menu_dropdown_panel_holo_light"
so I found this instead:
android:background="@android:drawable/dialog_holo_light_frame"
and it looks like this:
putting a background of @android:drawable/dialog_holo_light_frame
, gives shadow but you can't change background color nor border style, so it's better to benefit from the shadow of it, while still be able to put a background via layer-list
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!--the shadow comes from here-->
<item
android:bottom="0dp"
android:drawable="@android:drawable/dialog_holo_light_frame"
android:left="0dp"
android:right="0dp"
android:top="0dp">
</item>
<item
android:bottom="0dp"
android:left="0dp"
android:right="0dp"
android:top="0dp">
<!--whatever you want in the background, here i preferred solid white -->
<shape android:shape="rectangle">
<solid android:color="@android:color/white" />
</shape>
</item>
</layer-list>
save it in the drawable folder under say shadow.xml
to assign it to a view, in the xml layout file set the background of it
android:background="@drawable/shadow"
I know this question has already been answered but I want you to know that I found a drawable
on Android Studio
that is very similar to the pics you have in the question:
Take a look at this:
android:background="@drawable/abc_menu_dropdown_panel_holo_light"
It looks like this:
Hope it will be helpful
Edit
The option above is for the older versions of Android Studio
so you may not find it. For newer versions:
android:background="@android:drawable/dialog_holo_light_frame"
Moreover, if you want to have your own custom shape, I suggest to use a drawing software like Photoshop
and draw it.
Don't forget to save it as .9.png
file (example: my_background.9.png
)
Read the documentation: Draw 9-patch
Edit 2
An even better and less hard working solution is to use a CardView
and set app:cardPreventCornerOverlap="false"
to prevent views to overlap the borders:
<android.support.v7.widget.CardView
android:id="@+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="2dp"
app:cardElevation="2dp"
app:cardPreventCornerOverlap="false"
app:contentPadding="0dp">
<!-- your layout stuff here -->
</android.support.v7.widget.CardView>
Also make sure to have included the latest version in the build.gradle
, current is
compile 'com.android.support:cardview-v7:26.0.0'