Ripple efecto en Android Lollipop CardView
Estoy tratando de obtener un CardView para mostrar el efecto de rizado cuando se toca al establecer el atributo androide: backgound en el archivo XML de actividad tal como se describe aquí en la página de desarrolladores de Android, pero no funciona. No hay animación en absoluto, pero el método en onClick se llama. También he intentado crear un archivo ripple.xml como se sugiere aquí , pero el mismo resultado.
CardView tal como aparece en el archivo XML de la actividad:
- Cómo establecer el número de índice en la imagen de pin de mapa
- Marshmallow RelativeLayout se comporta de forma extraña con alignBaseline
- R.styleable no se puede resolver, ¿por qué?
- ¡Omitió 49 cuadros! La aplicación puede estar haciendo demasiado trabajo en su hilo principal
- Doble control deslizante android
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto" android:layout_width="155dp" android:layout_height="230dp" android:elevation="4dp" android:translationZ="5dp" android:clickable="true" android:focusable="true" android:focusableInTouchMode="true" android:onClick="showNotices" android:background="?android:attr/selectableItemBackground" android:id="@+id/notices_card" card_view:cardCornerRadius="2dp"> </android.support.v7.widget.CardView>
Soy relativamente nuevo en el desarrollo de Android, así que podría haber cometido algunos errores obvios.
Gracias por adelantado.
- Crear ListView personalizado con sombra
- Cómo configurar un Android GridView con diferentes tamaños de columna
- Organización de archivos de código / archivos XML para Android SDK
- ¿Cómo se contrae la barra de herramientas de la aplicación de contactos de Android L?
- El botón Switch no muestra texto ON y OFF en Android
- KitKat specific- android.content.res.Resources $ NotFoundException: Archivo res / drawable / list_selector_white.xml de ID de recurso extraíble
- División de pantalla dinámica de Android
- ¿Cómo escalar View / ViewGroup - animar el diseño de una manera adecuada?
Debería agregar el siguiente a CardView
:
android:foreground="?android:attr/selectableItemBackground" android:clickable="true"
Me las arreglé para obtener el efecto de ripple en el cardview por:
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto" android:clickable="true" android:foreground="@drawable/custom_bg"/>
Y para el custom_bg que se puede ver en el código anterior, hay que definir un archivo xml para los dispositivos de piruleta (en drawable-v21) y pre-lollipop (en paquete de drawable). Para custom_bg en el paquete drawable-v21 el código es:
<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?android:attr/colorControlHighlight"> <item android:id="@android:id/mask" android:drawable="@android:color/white"/> </ripple>
Para custom_bg en el paquete dibujable, el código es:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true"> <shape> <solid android:color="@color/colorHighlight"></solid> </shape> </item> <item> <shape> <solid android:color="@color/navigation_drawer_background"></solid> </shape> </item> </selector>
Por lo que en los dispositivos pre-lollipop tendrá un efecto de clic sólido y en los dispositivos lollipop tendrá un efecto de ripple en el cardview.
Agregue estos dos códigos de línea en su vista xml para dar efecto de ripple en su cardView.
android:clickable="true" android:foreground="?android:attr/selectableItemBackground"
El efecto de rizado se omitió en la librería de soporte appcompat, que es lo que está utilizando. Si quieres ver la ondulación, utiliza la versión Android L y pruébala en un dispositivo Android L. Por el sitio AppCompat v7:
Mucho de lo que permite que RippleDrawable funcione sin problemas es el nuevo RenderThread de Android 5.0 Para optimizar el rendimiento en versiones anteriores de Android, hemos dejado RippleDrawable por ahora.
Echa un vistazo a este enlace aquí para más información
Si la aplicación minSdkVersion
que está trabajando es de nivel 9, puede utilizar:
android:foreground="?selectableItemBackground" android:clickable="true"
En su lugar, a partir del nivel 11, utiliza:
android:foreground="?android:attr/selectableItemBackground" android:clickable="true"
De la documentación:
Clickable – Define si esta vista reacciona a los eventos de clic. Debe ser un valor booleano, ya sea "true" o "false".
Primer plano – Define el dibujable para dibujar sobre el contenido. Esto se puede usar como una superposición. El primer plano dibujable participa en el relleno del contenido si la gravedad está configurada para llenarse.
Evento Ripple para Android Control Cardview
:
<android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center" android:foreground="?android:attr/selectableItemBackground" android:clickable="true" android:layout_marginBottom="4dp" android:layout_marginTop="4dp" > </android.support.v7.widget.CardView>
Si hay un diseño raíz como RelativeLayout o LinearLayout que contienen todo el componente del elemento del adaptador en CardView, debe establecer el atributo background en ese diseño raíz. me gusta:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:card_view="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="122dp" android:layout_marginBottom="6dp" android:layout_marginLeft="6dp" android:layout_marginRight="6dp" card_view:cardCornerRadius="4dp"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/touch_bg"/> </android.support.v7.widget.CardView>
No estaba contento con AppCompat, así que escribí mis propias ondas CardView y backported. Aquí se está ejecutando en Galaxy S con Gingerbread, por lo que es definitivamente posible.
Para más detalles verifique la demo .
Para aquellos que buscan una solución a la cuestión del efecto de rizado que no funciona en un CardView creado mediante programación (o en mi caso la vista personalizada que extiende CardView) se muestra en un RecyclerView, lo siguiente funcionó para mí. Básicamente declarar los atributos XML mencionados en las otras respuestas de forma declarativa en el archivo de diseño XML no parece funcionar para una CardView creada mediante programación o creada a partir de un diseño personalizado (incluso si la vista raíz es CardView o el elemento de combinación se utiliza). Ellos tienen que ser fijados programmaticly como así:
private class MadeUpCardViewHolder extends RecyclerView.ViewHolder { private MadeUpCardView cardView; public MadeUpCardViewHolder(View v){ super(v); this.cardView = (MadeUpCardView)v; // Declaring in XML Layout doesn't seem to work in RecyclerViews if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { int[] attrs = new int[]{R.attr.selectableItemBackground}; TypedArray typedArray = context.obtainStyledAttributes(attrs); int selectableItemBackground = typedArray.getResourceId(0, 0); typedArray.recycle(); this.cardView.setForeground(context.getDrawable(selectableItemBackground)); this.cardView.setClickable(true); } } }
Donde MadeupCardView extends CardView
Kudos a esta respuesta para la parte TypedArray
.
Para mí, añadir el foreground
a CardView
no funcionó (razón desconocida: /)
Añadir el mismo a su disposición de niño hizo el truco.
CÓDIGO:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:card_view="http://schemas.android.com/apk/res-auto" android:id="@+id/card_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center" android:focusable="true" android:clickable="true" card_view:cardCornerRadius="@dimen/card_corner_radius" card_view:cardUseCompatPadding="true"> <LinearLayout android:id="@+id/card_item" android:layout_width="match_parent" android:layout_height="wrap_content" android:foreground="?android:attr/selectableItemBackground" android:padding="@dimen/card_padding"> </LinearLayout> </android.support.v7.widget.CardView>
- Reconocimiento de voz fuera de línea en Android (JellyBean)
- Android: la animación personalizada en la transacción de fragmentos no se está ejecutando