actions - cardview android shadow

Android-L CardView Visual Touch Feedback

Question

¿Alguien podría explicarme cómo implementar algunos de los comentarios táctiles visuales que se demostraron en Google I / O 2014 dentro de un CardView?

Así es como estoy usando CardView en XML, es probable que haya algo pequeño que me falta, así que solo me preguntaba si alguien podría ayudarme.

<!-- A CardView -->
<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/CardView_1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginTop="10dp" 
    card_view:cardCornerRadius="4dp"
    android:elevation="2dp">

    <LinearLayout
        android:id="@+id/LinearLayout_1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:onClick="RunSomeMethod"">

    <!-- Main CardView Content In Here-->

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

Answer 1

Aquí está mi solución. Utiliza ondas para lollipop + y primer plano estático para dispositivos pre-piruletas.

<android.support.v7.widget.CardView
    ...
    android:foreground="?android:attr/selectableItemBackground">

Answer 2

Esto ayudó en mi caso

Fondo:

CardView ignora android:background a favor de la app:cardBackground que solo puede ser de color. El borde y la sombra son, de hecho, parte del fondo, por lo que no puede configurar el suyo propio.

Solución:

Haga que el diseño dentro de CardView clic en lugar de la tarjeta en sí. Ya escribió los dos atributos necesarios para este diseño:

android:clickable="true"
android:background="?android:selectableItemBackground"

Answer 3

Para dibujar la selección en pre-Lollipop y post-Lollipop correctamente, puede usar el siguiente enfoque (la idea es usar recuadro dibujable del selector con esquinas redondeadas para pre-Lollipop - la muestra a continuación usa colores personalizados, puede cambiarlos a los valores predeterminados) :

android:foreground="@drawable/card_foreground"

post-Lollipop

drawable-v21 / card_foreground.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="#20000000"
        android:drawable="@drawable/card_foreground_selector" />

drawable-v21 / card_foreground_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#18000000"/>
        </shape>
    </item>
    <item android:state_focused="true" android:state_enabled="true">
        <shape android:shape="rectangle">
            <solid android:color="#0f000000"/>
        </shape>
    </item>
</selector>

pre-Lollipop

drawable / card_foreground.xml (necesitará ajustar los valores insertados de acuerdo con la elevación de su tarjeta)

<inset xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/card_foreground_selector"
    android:insetLeft="2dp"
    android:insetRight="2dp"
    android:insetTop="4dp"
    android:insetBottom="4dp"/>

drawable / card_foreground_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#18000000"/>
            <corners android:radius="@dimen/card_radius" />
        </shape>
    </item>
    <item android:state_focused="true" android:state_enabled="true">
        <shape android:shape="rectangle">
            <solid android:color="#0f000000"/>
            <corners android:radius="@dimen/card_radius" />
        </shape>
    </item>
</selector>

Answer 4

API 11+ :

Agregue android:foreground="?android:attr/selectableItemBackground" a su elemento CardView .

API 9+ :

Agregue android:foreground="?selectableItemBackground" CardView android:foreground="?selectableItemBackground" a su elemento CardView .

Editar: La onda que se origina desde el centro y no desde el punto de contacto es un error conocido, y se ha solucionado .