Cardview 波纹效果不起作用答案

【问题标题】：Cardview ripple effect doesn't workCardview 波纹效果不起作用
【发布时间】：2017-02-18 17:33:19
【问题描述】：

Min SDK 为 21。当我单击回收器适配器中的卡片视图时，不会出现涟漪效应，而是进入下一个屏幕。 recyclerview 在一个片段内。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <android.support.v7.widget.CardView
        android:id="@+id/entire_card"
        android:layout_width="match_parent"
        android:layout_height="265dp"
        android:layout_margin="8dp"
        android:foreground="?android:attr/selectableItemBackground"
        app:cardUseCompatPadding="true"
        app:cardCornerRadius="2dp"
        >


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ProgressBar
                android:id="@+id/progressbar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:layout_centerHorizontal="true"
                android:paddingTop="120dp"
                android:visibility="visible"/>


            <ImageView
                android:id="@+id/pet_image"
                android:layout_width="match_parent"
                android:layout_height="210dp"
                android:layout_alignParentTop="true"
                android:scaleType="centerCrop"
                android:src="@drawable/placeholder"
                android:visibility="gone"
                 />

            <TextView
                android:id="@+id/pet_description"
                android:layout_width="fill_parent"
                android:layout_height="55dp"
                android:layout_below="@+id/pet_image"
                android:padding="10dp"
                android:textColor="#FFFFFF"
                android:visibility="gone"
                android:textSize="20sp"
                android:background="@color/primaryColour"
                />

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

</LinearLayout>

每个项目都有我的 onClick 的适配器代码。

public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
        public TextView petInfo;
        public ImageView imgURL;
        public ProgressBar progressBar;

        private Context itemContext;
        public ViewHolder(View v){
            super(v);
            imgURL = (ImageView) v.findViewById(R.id.pet_image);
            petInfo = (TextView) v.findViewById(R.id.pet_description);
            progressBar = (ProgressBar) v.findViewById(R.id.progressbar);

            itemContext = v.getContext();

            v.setOnClickListener(this);
        }

        @Override
        public void onClick(View v){

            Intent intent= new Intent(itemContext, DetailCardLayout.class);
            Integer position = getAdapterPosition();
            intent.putExtra("CARDVIEW_POSITION", position);
            v.getContext().startActivity(intent);

        }
    }

【问题讨论】：

将您的 CardView 设置为根布局并尝试。
这有帮助！然而，涟漪效应仅适用于两次点击。即单击卡片视图，转到下一个屏幕并按返回。重复。然后当你第三次点击时不再有涟漪效应
stackoverflow.com/questions/26942434/…

标签： android android-recyclerview android-animation cardview

【解决方案1】：

您的卡片视图包含覆盖卡片视图表面的相对布局，因此请在相对布局中编写波纹效果。

<android.support.v7.widget.CardView 
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardPreventCornerOverlap="false"
    app:cardElevation="2dp"
    app:cardUseCompatPadding="false"
    app:cardCornerRadius="2dp"
    android:layout_marginBottom="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginLeft="8dp"
    >
    <RelativeLayout
        android:id="@+id/rl_bookmark"
        android:background="?attr/selectableItemBackground"
        android:clickable="true"
        android:layout_width="match_parent"
        android:layout_height="match_parent"> ...

【讨论】：

【解决方案2】：

尝试添加

android:clickable="true"

到你的卡片视图 xml

【讨论】：

这似乎有帮助。但是，当我滚动查看更多内容（2 张卡片占据一个屏幕）时，涟漪效果似乎在前两张卡片之后不起作用。

【解决方案3】：

尝试将您的图像包装在 FrameLayout 中，其前景属性为： android:foreground="?attr/selectableItemBackground"

例如

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:focusable="true"
        android:foreground="?attr/selectableItemBackground"
        >

        <ImageView
            android:id="@+id/pet_image"
            android:layout_width="match_parent"
            android:layout_height="210dp"
            android:layout_alignParentTop="true"
            android:scaleType="centerCrop"
            android:src="@drawable/placeholder"
            android:visibility="gone"
             />

    </FrameLayout>

【讨论】：

【解决方案4】：

解决此问题的另一种方法：使用按钮样式

将无边框按钮样式添加到布局的根元素。不需要focusable 或clickable 属性，默认样式为您封装了所有这些。

<androidx.constraintlayout.widget.ConstraintLayout
    style="@android:style/Widget.Material.Button.Borderless"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

注意：将样式添加到包含其他视图的CardView 中的ViewGroup

【讨论】：

【解决方案5】：

只需在 MaterialCardView 中将 background 添加到您的子视图。

android:background="?attr/selectableItemBackground"

<com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:layout_marginBottom="4dp"
        android:background="@color/white">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:id="@+id/item_view"
            android:layout_width="match_parent"
            android:background="?attr/selectableItemBackground"
            android:layout_height="wrap_content" >

    // -> rest of your design

  </androidx.constraintlayout.widget.ConstraintLayout>

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

【讨论】：