Efek riak pada Android Lollipop CardView

Saya mencoba mendapatkan CardView untuk menampilkan efek riak ketika disentuh dengan mengatur atribut android: backgound dalam file XML aktivitas seperti dijelaskan di sini di halaman Android Developers, tetapi tidak berfungsi. Tidak ada animasi sama sekali, tetapi metode di onClick dipanggil. Saya juga mencoba membuat file ripple.xml seperti yang disarankan di sini , tetapi hasilnya sama.

CardView seperti yang muncul di file XML aktivitas:

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

Saya relatif baru dalam pengembangan android, jadi saya mungkin telah membuat beberapa kesalahan yang jelas.

Anda harus menambahkan yang berikut ke CardView:

android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"

Tambahkan dua kode baris ini ke tampilan xml Anda untuk memberikan efek riak pada cardView Anda.

android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"

Saya berhasil mendapatkan efek riak pada cardview dengan:

<android.support.v7.widget.CardView 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:clickable="true" 
    android:foreground="@drawable/custom_bg"/>

dan untuk custom_bg yang dapat Anda lihat dalam kode di atas, Anda harus mendefinisikan file xml untuk perangkat lollipop (dalam paket drawable-v21) dan pra-lollipop (dalam paket yang dapat ditarik). untuk custom_bg dalam paket drawable-v21 kodenya adalah:

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

untuk custom_bg dalam paket drawable, kodenya adalah:

<?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>

jadi pada perangkat pre-lollipop Anda akan memiliki efek klik padat dan pada perangkat lollipop Anda akan memiliki efek riak pada cardview.

Efek riak dihilangkan di pustaka dukungan appcompat yang Anda gunakan. Jika Anda ingin melihat riak, gunakan versi Android L dan uji pada perangkat Android L. Per situs AppCompat v7:

"Mengapa tidak ada riak pada pra-Lollipop? Banyak hal yang memungkinkan RippleDrawable untuk berjalan dengan lancar adalah RenderThread Android 5.0 yang baru. Untuk mengoptimalkan kinerja pada versi Android sebelumnya, kami membiarkan RippleDrawable keluar untuk saat ini."

Lihat tautan ini di sini untuk info lebih lanjut

Jika aplikasi minSdkVersionyang Anda gunakan level 9, Anda dapat menggunakan:

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

Sebaliknya, mulai dari level 11, Anda menggunakan:

android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"

Dari dokumentasi:

diklik - Menentukan apakah pandangan ini bereaksi terhadap peristiwa klik. Harus berupa nilai boolean, baik "benar" atau "salah".

foreground - Menentukan drawable untuk menggambar konten. Ini dapat digunakan sebagai hamparan. Drawable foreground berpartisipasi dalam padding konten jika gravitasi diatur untuk mengisi.

Bagi saya, menambahkan foregroundto CardViewtidak berfungsi (alasan tidak diketahui: /)

Menambahkan yang sama untuk tata letak anak itu melakukan trik.

KODE:

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

Tambahkan dua ini seperti kerja kode seperti pesona untuk tampilan seperti Tombol, Linear Layout, atau CardView Cukup letakkan dua baris ini dan lihat keajaiban ...

android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"

Jika ada tata letak root seperti RelativeLayout atau LinearLayout yang berisi semua komponen item adaptor di CardView, Anda harus mengatur atribut latar belakang dalam tata letak root tersebut. Suka:

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

Acara riak untuk Cardviewkontrol android :

<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" />

Saya tidak senang dengan AppCompat, jadi saya menulis CardView saya sendiri dan riak yang di-backport. Ini dia berjalan di Galaxy S dengan Gingerbread, jadi pasti mungkin.

Untuk lebih jelasnya periksa kode sumber .

Tambahkan berikut ini ke xml Anda:

android:clickable="true"
android:focusable="true"
android:background="?android:attr/selectableItemBackground"

Dan tambahkan ke adaptor Anda (jika itu kasus Anda)

    override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
            val attrs = intArrayOf(R.attr.selectableItemBackground)
            val typedArray = holder.itemView.context.obtainStyledAttributes(attrs)
            val selectableItemBackground = typedArray.getResourceId(0, 0)
            typedArray.recycle()

            holder.itemView.isClickable = true
            holder.itemView.isFocusable = true
            holder.itemView.foreground = holder.itemView.context.getDrawable(selectableItemBackground)
        }
    }

Bagi mereka yang mencari solusi untuk masalah efek riak yang tidak bekerja pada CardView yang dibuat secara program (atau dalam kasus khusus saya yang memperluas CardView) yang ditampilkan dalam RecyclerView, berikut ini bekerja untuk saya. Pada dasarnya mendeklarasikan atribut XML yang disebutkan dalam jawaban lain secara deklaratif dalam file tata letak XML tampaknya tidak berfungsi untuk CardView yang dibuat secara terprogram, atau yang dibuat dari tata letak khusus (meskipun tampilan root adalah CardView atau elemen gabungan digunakan), jadi mereka harus diatur secara terprogram seperti:

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);
        }
    }
}

Di mana MadeupCardView extends CardViewKudos untuk jawaban ini untuk TypedArraybagian itu.

  android:foreground="?android:attr/selectableItemBackgroundBorderless"
   android:clickable="true"
   android:focusable="true"

Hanya bekerja api 21 dan gunakan ini tidak menggunakan tampilan kartu baris daftar ini

Gunakan Material Cardview sebagai gantinya, itu memperluas Cardview dan menyediakan beberapa fitur baru termasuk efek yang dapat diklik default:

<com.google.android.material.card.MaterialCardView>

...

</com.google.android.material.card.MaterialCardView>

Ketergantungan

implementation 'com.google.android.material:material:1.0.0'