La elevación no funciona para BottomSheet dentro de la disposición del coordinador

Estoy intentando usar una BottomSheet en mi diseño. La vista de la raíz es un CoordinatorLayout y quiero fijar Elevation en la parte superior de la Hoja de Fondo por lo que estoy configurándolo con un valor alto (50dp), sin embargo, no se muestra cuando la aplicación se ejecuta, pero aparece en la herramienta de diseño de estudio de Android.

He intentado fijar el fondo para la hoja con un color sólido en vez del gradiente pero todavía trabajó. También traté de usar formas de sombra, pero no da la misma apariencia de elevación.

Aquí está mi XML

 <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.atefhares.StartActivity" android:clipToPadding="false"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <LinearLayout android:id="@+id/DetailsView" android:layout_width="match_parent" android:layout_height="100dp" android:orientation="vertical"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Details Should be shown here" android:id="@+id/textView" android:textSize="25sp" android:padding="20dp" /> </LinearLayout> <fragment xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/map" android:name="com.google.android.gms.maps.SupportMapFragment" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.atefhares.Start_Activity" /> </LinearLayout> <android.support.v4.widget.SlidingPaneLayout android:id="@+id/bottom_sheet" android:layout_width="match_parent" android:layout_height="match_parent" app:behavior_peekHeight="70dp" app:layout_behavior="android.support.design.widget.BottomSheetBehavior" android:background="@drawable/gradiant" android:fillViewport="true" android:elevation="50dp"> <include layout="@layout/bottom_sheet_layout"/> </android.support.v4.widget.SlidingPaneLayout> </android.support.design.widget.CoordinatorLayout> 

Editar: bottom_sheet_layout.xml

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:fillViewport="true" android:orientation="vertical"> <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="70dp" android:background="@color/colorPrimary" android:padding="10dp" android:id="@+id/inviteLL"> <ImageView android:layout_width="40dp" android:layout_height="40dp" android:id="@+id/imageView" android:background="@drawable/invite_icon" android:layout_margin="5dp" android:layout_gravity="center_vertical" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Invite Friends" android:textSize="22sp" android:textColor="#ffffff" android:padding="10dp" android:fontFamily="sans-serif-condensed" android:gravity="center_vertical" android:id="@+id/inviteTV" android:layout_gravity="center_vertical" android:layout_weight="1" /> <ImageView android:layout_width="30dp" android:layout_height="30dp" android:id="@+id/arrowIV" android:layout_gravity="center_vertical" android:background="@drawable/arrow_up" /> </LinearLayout> <ListView android:layout_width="match_parent" android:layout_height="fill_parent" android:id="@+id/usersLV" android:dividerHeight="1dp" android:divider="#ffffff" android:background="#ffffff" /> </LinearLayout> 

Entonces, ¿ cómo puedo hacer la elevación muestra en la parte superior de la Bottom Sheet

Cualquiera puede ayudar, por favor?

La respuesta es: no, no es posible (a menos que cree su propia vista personalizada con una función de elevación en la parte superior).

La eleva- ción no pretende ser visible en la parte superior de una vista, sino en la parte inferior, a la derecha ya la izquierda.

Si observa de cerca las directrices oficiales de diseño de material , puede ver que la barra inferior simplemente no la tiene (no confunda con el espacio gris entre la tarjeta y la barra inferior).

Introduzca aquí la descripción de la imagen

Por ejemplo: import Card Ver muestra de Android Studio y jugar con ella con el emulador o el dispositivo. Verá que si aumenta el valor de elevación, la vista tendrá su sombra en todas partes excepto en la parte superior (vea la segunda imagen a continuación).

Introduzca aquí la descripción de la imagen

Otro ejemplo es dado importando Elevación Básica .

EDITAR

El código siguiente se toma del ejemplo de la vista de tarjeta . Hay un diseño que contiene un CardView con elevación . Siempre que cambie la elevación, siempre verá sombra en todas partes, pero no en la parte superior (el código se probó con Lollipop y Marshmallow).

 <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" > <android.support.v7.widget.CardView android:id="@+id/cardview" android:layout_width="fill_parent" android:layout_height="wrap_content" android:elevation="100dp" card_view:cardBackgroundColor="@color/cardview_initial_background" card_view:cardCornerRadius="8dp" android:layout_marginLeft="@dimen/margin_large" android:layout_marginRight="@dimen/margin_large" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/margin_medium" android:text="@string/cardview_contents" /> </android.support.v7.widget.CardView> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="@dimen/margin_large" android:orientation="horizontal" > <TextView android:layout_width="@dimen/seekbar_label_length" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:text="@string/cardview_radius_seekbar_text" /> <SeekBar android:id="@+id/cardview_radius_seekbar" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="@dimen/margin_medium" /> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <TextView android:layout_width="@dimen/seekbar_label_length" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:text="@string/cardview_elevation_seekbar_text" /> <SeekBar android:id="@+id/cardview_elevation_seekbar" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="@dimen/margin_medium" /> </LinearLayout> </LinearLayout> 

No te olvides que para dibujar sombra debes usar el diseño hardwareAccelerated

HardwareAccelerated = true Introduzca aquí la descripción de la imagen

HardwareAccelerated = false Introduzca aquí la descripción de la imagen

Consulta Aceleración de hardware de Android para obtener detalles

Prueba esto,

 <android.support.v4.widget.SlidingPaneLayout android:id="@+id/bottom_sheet" xmlns:slide_panel="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" app:behavior_peekHeight="70dp" app:layout_behavior="android.support.design.widget.BottomSheetBehavior" android:background="@drawable/gradiant" android:fillViewport="true" slide_panel:elevation="50dp"> 

De acuerdo con las directrices de Google con el androide: la elevación no es posible (También se puede leer más sobre el keyligth ).

De todos modos, en los casos más comunes cuando se desplaza hacia arriba la "Hoja de Fondo" aparece una capa semitransparente detrás de la "Hoja de Fondo", esto ayuda a mantener al usuario enfocado en las acciones de "Hoja de Fondo", como estos ejemplos .

Si de todos modos desea una sombra superior, puede establecer un fondo dibujable con degradado como este (shadow_top.xml):

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

Y su SlidingPanelLayout será:

 <android.support.v4.widget.SlidingPaneLayout android:id="@+id/bottom_sheet" android:layout_width="match_parent" android:layout_height="match_parent" app:behavior_peekHeight="95dp" android:paddingTop="25dp" app:layout_behavior="android.support.design.widget.BottomSheetBehavior" android:background="@drawable/shadow_top" android:fillViewport="true" > 

Atentamente.

  • RecyclerView (horizontal) anidados en BottomSheet que impide el desplazamiento vertical
  • BottomSheetBehaviour setstate sin animación
  • Android: Problema de evento de toque de la hoja inferior anidado
  • AS no puede encontrar BottomSheetBehavior_Params, _behavior_peekHeight y _behavior_hideable
  • Scrollview no se desplaza en la hoja de cálculo de Android
  • BottomSheetDialog / BottomSheetDialogFragment - ¿qué usar y cómo?
  • Pantalla débil e interacción de bloques con hojas de fondo
  • Pantalla inferior de pantalla completa con el botón Cerrar (X) en la parte superior
  • Persistente BottomSheet peekHeight y STATE_COLLAPSED no dibujar correctamente en Inicio de actividad
  • Trate de entender el comportamiento de BottomSheet en la biblioteca de soporte de Android 23.2.1
  • Hoja de fondo con movimiento Botones de acción flotante
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.