web-dev-qa-db-ja.com

Android-L CardViewビジュアルタッチフィードバック

cardView内でGoogle I/O 2014でデモンストレーションされた視覚的なタッチフィードバックを実装する方法を誰かに説明していただけますか。

XMLでCardViewを使用する方法は次のとおりです。おそらく何か足りないものがあるので、誰か助けてくれないかと思っただけです。

<!-- 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 +：

追加 Android:foreground="?android:attr/selectableItemBackground"をCardView要素に追加します。

API 9 +：

追加 Android:foreground="?selectableItemBackground"をCardView要素に追加します。

編集：タッチポイントからではなく、中心から発生する波紋は 既知のバグであり、修正されています 。

176
nhaarman

pre-Lollipopおよびpost-Lollipopで選択範囲を正しく描画するには、次のアプローチを使用できます（アイデアはインセットセレクターの描画可能丸み付け pre-Lollipopのコーナー-以下のサンプルではカスタムカラーを使用し、デフォルトに変更できます）：

Android:foreground="@drawable/card_foreground"

ポストロリポップ

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>

事前ロリポップ

drawable/card_foreground.xml（カードの高さに応じてインセット値を微調整する必要があります）

<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

これは私の場合に役立ちました

背景：

CardViewはAndroid:backgroundを無視し、app:cardBackgroundを優先します。これは色のみにすることができます。境界線と影は実際には背景の一部なので、独自に設定することはできません。

解決策：

カード自体ではなく、CardView内のレイアウトをクリック可能にします。このレイアウトに必要な両方の属性をすでに作成しました。

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

これが私の解決策です。 Lollipop +にはリップルを使用し、Lollipop以前のデバイスには静的な前景を使用します。

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