Android "elevación" no muestra una sombra


Tengo una vista de lista, y con cada elemento de la lista quiero que muestre una sombra debajo de ella. Estoy usando la nueva función de elevación de Android Lollipop para establecer una Z en la vista que quiero proyectar una sombra, y ya estoy haciendo esto de manera efectiva con la barra de acción (técnicamente una barra de herramientas en Lollipop). Estoy usando la elevación de Lollipop, pero por alguna razón no está mostrando una sombra debajo de los elementos de la lista. Así es como se configura el diseño de cada elemento de la lista:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    style="@style/block"
    android:gravity="center"
    android:layout_gravity="center"
    android:background="@color/lightgray"
    >

    <RelativeLayout
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_marginLeft="40dp"
        android:layout_marginRight="40dp"
        android:layout_marginTop="20dp"
        android:layout_marginBottom="20dp"
        android:elevation="30dp"
        >

        <ImageView
            android:id="@+id/documentImageView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop" />

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/alphared"
            android:layout_alignParentBottom="true" >

            <appuccino.simplyscan.Extra.CustomTextView
                android:id="@+id/documentName"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@color/white"
                app:typeface="light"
                android:paddingLeft="16dp"
                android:paddingTop="8dp"
                android:paddingBottom="4dp"
                android:singleLine="true"
                android:text="New Document"
                android:textSize="27sp"/>

            <appuccino.simplyscan.Extra.CustomTextView
                android:id="@+id/documentPageCount"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textColor="@color/white"
                app:typeface="italic"
                android:paddingLeft="16dp"
                android:layout_marginBottom="16dp"
                android:text="1 page"
                android:textSize="20sp"/>

        </LinearLayout>

    </RelativeLayout>

</RelativeLayout>

Sin embargo, así es como muestra la lista artículo, sin sombra: introduzca la descripción de la imagen aquí

También he intentado lo siguiente en vano:

  1. Establezca la elevación en ImageView y TextViews en lugar del diseño principal.
  2. Aplicó un fondo a ImageView.
  3. TranslationZ usado en lugar de Elevación.
Author: AggieDev, 2014-12-15

16 answers

He estado jugando con sombras en Lollipop durante un tiempo y esto es lo que he encontrado:

  1. Parece que los límites de un padre ViewGroup cortan la sombra de sus hijos por alguna razón; y{[14]]}
  2. las sombras establecidas con android:elevation se cortan por los límites de View, no los límites extendidos a través del margen;
  3. la forma correcta de obtener una vista hija para mostrar sombra es establecer relleno en el padre y establecer android:clipToPadding="false" en ese padre.

Aquí está mi sugerencia para usted basado en lo que sé:

  1. Establezca su nivel superior RelativeLayout para que tenga un relleno igual a los márgenes que ha establecido en el diseño relativo que desea mostrar sombra;
  2. establecer android:clipToPadding="false" en el mismo RelativeLayout;
  3. Eliminar el margen de la RelativeLayout que también tiene conjunto de elevación;
  4. [EDITAR] también es posible que necesite establecer un color de fondo no transparente en el diseño hijo que necesita elevación.

Al final del día, su diseño relativo de nivel superior debería verse como esto:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    style="@style/block"
    android:gravity="center"
    android:layout_gravity="center"
    android:background="@color/lightgray"
    android:paddingLeft="40dp"
    android:paddingRight="40dp"
    android:paddingTop="20dp"
    android:paddingBottom="20dp"
    android:clipToPadding="false"
    >

El diseño relativo interior debería tener este aspecto:

<RelativeLayout
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:background="[some non-transparent color]"
    android:elevation="30dp"
    >
 306
Author: Justin Pollard,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-06-08 10:28:49

Si tienes una vista sin fondo esta línea te ayudará

android:outlineProvider="bounds"

De forma predeterminada, la sombra está determinada por el fondo de la vista, por lo que si no hay fondo, tampoco habrá sombra.

 213
Author: Dmitry Ryadnenko,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-11-24 10:53:45

Aparentemente, no se puede simplemente establecer una elevación en una Vista y hacer que aparezca. También es necesario especificar un fondo.

Las siguientes líneas agregadas a mi LinearLayout finalmente mostraron una sombra:

android:background="@android:color/white"
android:elevation="10dp"
 66
Author: John Slavick,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-02-10 19:07:04

Otra cosa que debes tener en cuenta, las sombras no se mostrarán si tienes esta línea en el manifiesto:

android:hardwareAccelerated="false"

Probé todas las cosas sugeridas, pero solo funcionó para mí cuando eliminé la línea, la razón por la que tenía la línea fue porque mi aplicación funciona con una serie de imágenes de mapa de bits y estaban causando que la aplicación se bloqueara.

 27
Author: nada,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-01-30 13:04:10

Si está agregando elevación a un elemento de botón, debe agregar la siguiente línea:

android:stateListAnimator="@null"

Ver Android 5.0 android: la elevación funciona para la vista,pero no para el botón?

 16
Author: user8102108,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-10-19 17:22:57

Ugh, acabo de pasar una hora tratando de resolver esto. En mi caso tenía un fondo establecido, sin embargo, se estableció en un color. Esto no es suficiente, necesita tener el fondo de la vista establecido en un elemento de diseño.

E. g. Esto no tendrá sombra:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="165dp"
    android:background="@color/ight_grey"
    android:elevation="20dp"
    android:orientation="vertical"
    />

Pero esto será

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="165dp"
    android:background="@drawable/selector_grey"
    android:elevation="20dp"
    android:orientation="vertical"
    />

EDITAR: También han descubierto que si usa un selector como fondo, si no tiene la esquina configurada, la sombra no se mostrará en la ventana de vista previa pero se mostrará en el dispositivo

Por ejemplo, esto no tiene una sombra en vista previa:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/white" />
            <stroke
                android:width="1dp"
                android:color="@color/grey"/>
        </shape>
    </item>
</selector>

Pero esto sí:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/white" />
            <corners android:radius="1dp" />
            <stroke
                android:width="1dp"
                android:color="@color/grey"/>
        </shape>
    </item>
</selector>
 10
Author: odiggity,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-10-21 15:06:01

Agregar color de fondo me ayudó.

<CalendarView
    android:layout_width="match_parent"
    android:id="@+id/calendarView"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true"
    android:layout_height="wrap_content"
    android:elevation="5dp"

    android:background="@color/windowBackground"

    />
 5
Author: Tim Glenn,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-09-22 15:07:00

Si tienes una vista sin fondo esta línea te ayudará

android:outlineProvider="bounds"

Si tienes una vista con fondo esta línea te ayudará

android:outlineProvider="paddedBounds"
 5
Author: Deepak sharma,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-07-11 12:34:41

Si desea tener un fondo transparente y android:outlineProvider="bounds" no funciona para usted, puede crear ViewOutlineProvider personalizado:

class TransparentOutlineProvider extends ViewOutlineProvider {

    @Override
    public void getOutline(View view, Outline outline) {
        ViewOutlineProvider.BACKGROUND.getOutline(view, outline);
        Drawable background = view.getBackground();
        float outlineAlpha = background == null ? 0f : background.getAlpha()/255f;
        outline.setAlpha(outlineAlpha);
    }
}

Y establezca este proveedor en su vista transparente:

transparentView.setOutlineProvider(new TransparentOutlineProvider());

Fuentes: https://code.google.com/p/android/issues/detail?id=78248#c13

[5] [EDITAR]] Documentación de Drawable.getAlpha () dice que es específico de cómo el elemento de diseño amenaza el alfa. Es posible que siempre devuelva 255. En este caso se puede proporcionar el alfa manualmente:
class TransparentOutlineProvider extends ViewOutlineProvider {

    private float mAlpha;

    public TransparentOutlineProvider(float alpha) {
        mAlpha = alpha;
    }

    @Override
    public void getOutline(View view, Outline outline) {
        ViewOutlineProvider.BACKGROUND.getOutline(view, outline);
        outline.setAlpha(mAlpha);
    }
}

Si su fondo de vista es un StateListDrawable con el color predeterminado # DDFF0000 que es con alpha DDx0 / FFx0 = = 0.86

transparentView.setOutlineProvider(new TransparentOutlineProvider(0.86f));
 3
Author: wirdil,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-03-12 09:07:13

A veces como background= "@color/* "o background =" # ff33 " no funciona, reemplazo background_color con drawable, entonces funciona

 2
Author: ray liu,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-03 10:10:32

Dar un poco de color de fondo al diseño funcionó para mí como:

    android:background="@color/catskill_white"
    android:layout_height="?attr/actionBarSize"
    android:elevation="@dimen/dimen_5dp"
 2
Author: sudhakara,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-02-16 08:40:56

Añadiendo a la respuesta aceptada, hay una razón más debido a la cual la elevación puede no funcionar como se esperaba.

Si la función de filtro Bluelight en el teléfono está ACTIVADA

Me enfrentaba a este problema cuando la elevación parecía completamente distorsionada e insoportable en mi dispositivo. Pero la elevación estaba bien en la vista previa. Desactivar el filtro Bluelight en el teléfono resolvió el problema.

Así que incluso después de configurar

android:outlineProvider="bounds"

La elevación no funciona correctamente, a continuación, puede tratar de jugar con la configuración de color del teléfono.

 1
Author: Hemang Kumar,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-06-29 09:19:02

Creo que su problema se debe al hecho de que ha aplicado el elemento elevation a un diseño relativo que llena su padre. Su padre recorta todas las vistas secundarias dentro de su propio lienzo de dibujo (y es la vista que maneja la sombra del hijo). Puede solucionar esto aplicando una propiedad elevation al RelativeLayout más alto de su xml de vista (la etiqueta raíz).

 0
Author: FluffyC4n't,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-01-29 18:27:35

En mi caso las fuentes eran el problema.

1) Sin fontFamily Necesitaba establecer android:background a algún valor.

<TextView
    android:layout_width="match_parent"
    android:layout_height="44dp"
    android:background="@android:color/white"
    android:elevation="3dp"
    android:gravity="center"
    android:text="@string/fr_etalons_your_tickets"
    android:textAllCaps="true"
    android:textColor="@color/blue_4" />

2) con fontFamily tuve que añadir android:outlineProvider="bounds" ajuste:

<TextView
    android:fontFamily="@font/gilroy_bold"
    android:layout_width="match_parent"
    android:layout_height="44dp"
    android:background="@android:color/white"
    android:elevation="3dp"
    android:gravity="center"
    android:outlineProvider="bounds"
    android:text="@string/fr_etalons_your_tickets"
    android:textAllCaps="true"
    android:textColor="@color/blue_4" />
 0
Author: soshial,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-04-17 09:21:32

Tuve suerte al configurar clipChildren="false" en el diseño padre.

 0
Author: Kavi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-05-03 09:30:57

Pasé algún tiempo trabajando en él y finalmente me di cuenta de que cuando el fondo es oscuro, la sombra no es visible

 0
Author: Efi G,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-10-03 13:30:14