web-dev-qa-db-fra.com

Android-L CardView Visual Touch Commentaires

quelqu'un pourrait-il m'expliquer comment implémenter certains des commentaires tactiles visuels présentés lors de Google I/O 2014 dans un CardView.

Voici comment j'utilise CardView en XML, il manque probablement quelque chose de petit, alors je me demandais si quelqu'un pourrait m'aider ?.

<!-- 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>
androidandroid-layoutandroid-5.0-lollipopandroid-cardview
64
Smiler

API 11 + :

Ajouter Android:foreground="?android:attr/selectableItemBackground" à votre élément CardView.

API 9 + :

Ajouter Android:foreground="?selectableItemBackground" à votre élément CardView.

Edit: l'ondulation provenant du centre et non du point de contact est un bogue connu, qui a été corrigé .

176
nhaarman

Pour dessiner une sélection sur pré-Lollipop et post-Lollipop correctement, vous pouvez utiliser l'approche suivante (l'idée est d'utiliser encadré dessinable du sélecteur avec arrondi angles pour pré-Lollipop - l’échantillon ci-dessous utilise des couleurs personnalisées, vous pouvez les changer par défaut) :

Android:foreground="@drawable/card_foreground"

post-sucette

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>

pré-sucette

drawable/card_foreground.xml (vous aurez besoin de Tweak valeurs insérées en fonction de l'altitude de votre carte) 

<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>
35
GregoryK

Cela a aidé dans mon cas

Background:

Le CardView ignore Android:background en faveur de app:cardBackground qui ne peut être que couleur. La bordure et l'ombre font en fait partie de l'arrière-plan, vous ne pouvez donc pas définir le vôtre.

Solution:

Rendre la mise en page à l'intérieur du CardView cliquable au lieu de la carte elle-même. Vous avez déjà écrit les deux attributs nécessaires pour cette présentation:

Android:clickable="true"
Android:background="?android:selectableItemBackground"
10
AndyW

Voici ma solution. Il utilise l’ondulation pour Lollipop + et l’avant-plan statique pour les appareils pré-Lollipop.

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