Elevation not working on a LinearLayout

问题

After searching for a solution, I didn't find any to solve my problem.

I have some elevation which produces a shadow on a big part of my app.
But in a particular place, I'm not able to make it work.
(It's where I put an arrow on the picture below)

The white area below the toolbar is a Fragment which displays a LinearLayout

layout:

<LinearLayout
    android:id="@+id/panelAddress"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/button_flat_white"
    android:elevation="10dp"
    android:orientation="vertical"
    android:padding="20dp"
    >  
//some content
</LinearLayout>

The parent of the Fragment :

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawerLayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <include
            android:id="@+id/custom_toolbar"
            layout="@layout/toolbar"/>

        <RelativeLayout
            android:id="@+id/mapLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <fragment
                android:id="@+id/map"
                class="com.google.android.gms.maps.SupportMapFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>

            <FrameLayout
                android:id="@+id/fragment_container_top"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                />

            <FrameLayout
                android:id="@+id/fragment_container_bottom"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"/>

        </RelativeLayout>

    </LinearLayout>

</android.support.v4.widget.DrawerLayout>

Do you have an idea about why I don't get my elevation?

回答1:

As described here https://stackoverflow.com/a/27518160/2481494 there are several requirements so that the shadow is drawn:

Space for the shadow in the parents view Group. As bleeding182 mentioned, padding can cause the shadow to be clipped:

(Do NOT use a padding. A padding on the framelayout will also cut the shadow off)

However, this can be fixed with android:clipToPadding="false" in the parent.
The elevated view needs to have a background to cast a shadow. Without information about your @drawable/button_flat_white I can't tell whether this is a problem in your case.

To solve your problem you should modify your FrameLayout like this:

<FrameLayout
        android:id="@+id/fragment_container_top"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"

        android:clipToPadding="false"
        android:paddingBottom="10dp"/>

To check whether your @drawable/button_flat_white causes any problems try to change the background of your LinearLayout to a simple color temporarily:

<LinearLayout
    android:id="@+id/panelAddress"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:elevation="10dp"
    android:orientation="vertical"
    android:padding="20dp"

    android:background="#fff">  
//some content
</LinearLayout>

回答2:

Just make CardView as parent of your LinearLayout and you can achieve elevation.

<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="match_parent"
    android:layout_height="match_parent"
    card_view:cardUseCompatPadding="true"
    card_view:cardElevation="4dp"
    card_view:cardCornerRadius="3dp">

       <LinearLayout
              android:id="@+id/panelAddress"
              xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:background="@drawable/button_flat_white"
              android:orientation="vertical"
              android:padding="20dp">  

            //some content
      </LinearLayout>
 </android.support.v7.widget.CardView>

回答3:

If elevation is not working than you can create you XML by giving reference as a background on the LinearLayout :

shadowfile.xml

    <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#18000000" />
            <corners android:radius="8dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#05000000" />
            <corners android:radius="7dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#10000000" />
            <corners android:radius="6dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#15000000" />
            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#20000000" />
            <corners android:radius="4dp" />
        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <solid android:color="#FFFFFF" />
            <corners android:radius="0dp" />
        </shape>
    </item>
</layer-list>

Add like that :

<LinearLayout
        android:id="@+id/profileDetails"
        android:layout_width="match_parent"
        android:layout_height="125dp"
        android:background="@drawable/shadowfile"
        android:padding="15dp"
        android:layout_below="@id/toolbar_title"
        android:layout_marginTop="20dp">

Output :

回答4:

This is a drawing issue.

The cast shadow is drawn outside of the actual views bounds, so if the Parent layout does not "give" the view enough space, it will be clipped.

Since the parent of the fragment (Linear layout) has the same size, the shadow is clipped. Add a margin on the bottom to the LinearLayout.
If this does not help try wrapping the layout with a FrameLayout with a little margin on the bottom (Do NOT use a padding. A padding on the framelayout will also cut the shadow off)

1-2dp should do.

回答5:

i hope it help you, Just add"marginTop" in second layout.

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="90dp"
    android:orientation="vertical"
    android:elevation="5dp"
     />

<LinearLayout
    android:id="@+id/linearLayout2"
    android:layout_width="match_parent"
    android:layout_height="90dp"
    android:orientation="vertical"
    android:padding="5dp"
    android:layout_marginTop="3dp"
    />

回答6:

I have used paddingRight and paddingBottom(for shadow at bottom and to right of layout) then it worked for me, it shows a shadow otherwise the drawable shadow will not work properly.

Do such thing if you facing same problem.

回答7:

Please enable hardwardAccelerated option in manifest file,

<application
  ...
  android:hardwareAccelerated="true">

来源：https://stackoverflow.com/questions/33417049/elevation-not-working-on-a-linearlayout

标签

android

android-layout

material-design