Come posso aggiungere un'ombra alla vista del basso?

Question

A partire da ora, con il componente di foglio inferiore ufficiale dalla libreria di progettazione Android implementato il bordo superiore non mostra un'ombra. Ma per quello che ho visto in vari prototipi e nelle specifiche di Material Design, il foglio di sotto include un'ombra discreta di qualche tipo.

Penso che l'ombra aiuterebbe a distanziare il foglio inferiore dal layout principale, soprattutto se è presente un valore di sbirciata impostato e/o il foglio inferiore è sempre visibile. Altrimenti si fonderà semplicemente con il layout principale e i suoi elementi.

Ho provato sia ViewCompat.setElevation(bottomSheet, 5); che impostazione android:elevation="5dp" alla vista nell'XML, senza esito positivo.

Answer 1

so che un ombra non ha lo stesso aspetto di un'elevazione - ma almeno fare un tentativo. Il trucco è usare app:layout_anchor per tagliare l'ombra sul foglio inferiore.

activity_main.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<MapView 
    android:id="@+id/map" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" /> 

<View 
    android:id="@+id/shadow" 
    android:layout_width="match_parent" 
    android:layout_height="16dp" 
    android:background="@drawable/shape_gradient_top_shadow" 
    app:layout_anchor="@id/bottom_sheet" /> 

<FrameLayout 
    android:id="@+id/bottom_sheet" 
    android:layout_width="match_parent" 
    android:layout_height="200dp" 
    android:clipToPadding="false" 
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior" /> 

</android.support.design.widget.CoordinatorLayout> 

shape_gradient_top_shadow.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
<gradient 
    android:angle="90" 
    android:endColor="@android:color/transparent" 
    android:startColor="#64000000"/> 
</shape> 

appare come questa

EDIT

ottenere un risultato ancora migliore con un costume ShadowView:

• Post da Romano Nurik su questo argomento: https://plus.google.com/+RomanNurik/posts/2QvHVFWrHZf
• Sintesi della ShadowView sulla base di soluzione di Roman Nurik: https://gist.github.com/MariusBoepple/bf869e02541cd4750550e88fa07b5ddd

Poi si può fare quanto segue:

<ShadowView 
    android:id="@+id/shadow" 
    android:layout_width="match_parent" 
    android:layout_height="16dp" 
    android:gravity="bottom" 
    app:layout_anchor="@id/bottom_sheet" /> 

Answer 2

Per livello API 21 e superiori, impostare quanto segue nella vista primaria. Si può anche provare in rootview del bottomsheet (non ho provato nella vista di root)

android:background="@android:color/white" 
android:elevation="16dp" 

Se senza sfondo quindi può usare

android:outlineProvider="bounds" 

Per esempio, io ho il mio foglio all'interno di un nidificato vista di scorrimento

<android.support.v4.widget.NestedScrollView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:clipToPadding="false" 
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior" 
     android:elevation="16dp" 
     android:outlineProvider="bounds" 
     > 

    <include layout="@layout/bottomsheet_1" /> 

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