I use a framelayout at the bottom of an activity, in order to show the shadow effects on the fragment, I add android:elevation. But the shadow effects only appear in the bottom side not on top side, any one could give me some advice?
<FrameLayout
android:id="@+id/bottom_container"
android:background="#00737f"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="bottom"
android:elevation="4dp"
android:layout_alignParentBottom="true"
android:layout_marginBottom="50dp"/>
There is a trick that can be used to display a shadow above a View.
Basically we have to use two nested Layouts, where the outer Layout casts the shadow with an elevation
and the inner layout sets the background
.
Then by setting a padding
to the outer Layout, we can shift the inner Layout down, without moving the shadow, thus more of the shadow becomes visible:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_marginBottom="50dp"
android:elevation="4dp"
android:outlineProvider="bounds"
android:paddingTop="2dp"
android:layout_marginTop="-2dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00737f">
<!-- content -->
</FrameLayout>
</FrameLayout>
An important thing here is the attribute outlineProvider
, that is required to make the outer Layout cast a shadow even without having a background set.
Further we specify a negative margin
to compensate for the offset created by the padding. Depending on the use-case we can omit that.
But attention: If we shift the View too much, some rendering artifacts become visible: