androidandroid-layoutandroid-studioandroid-linearlayout

How can I add a shadow (like the attached example) under a LinearLayout element?


I am an absolute beginner in Android development and I have the following problem:

How can I insert something like a shadow under a LinearLayout component into my XML activity definition?

I want to obtain something like this:

example image

As you can see in the previous image, under the first linear layout (the one that contains the menu and the April 2017 date) there is a shadow.

What is the standard way to implement this effect?

This is the code of the linear layout under which I want to add this effect:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="#FFD54F"
    android:paddingLeft="10dp"
    android:paddingTop="10dp"
    android:paddingBottom="10dp">

    <ImageView
        android:src="@drawable/colosseumIcon"
        android:layout_width="80dp"
        android:layout_height="80dp"/>

    <TextView
        style="@style/HeaderTextStyle"
        android:text="Pasta From Rome" />


</LinearLayout>

Solution

  • The shadow is done "automatically" by the android system starting in Lollipop. All you have to do is define the view elevation. Meaning, the view is higher on the Z-axis than the view below (or under) it and should drop a shadow on top of it.

    For that simply add following on the XML

    android:elevation="8dp"
    

    Adjust the value as you need.