RecyclerView 中没有涟漪效应
No Ripple Effect in RecyclerView
我正在使用 RecyclerView
显示报价列表 Fragment
。我正在尝试在列表项中使用 Ripple 效果,但它不起作用。我的 RecyclerView
如下所示
<android.support.v7.widget.RecyclerView
android:id="@+id/listQuoteView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/BackColor"
android:layout_above="@+id/startAppBanner"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
列表项XML如下所示
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="?attr/selectableItemBackground"
android:clickable="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="4dp"
app:cardCornerRadius="6dp"
app:cardElevation="4dp">
<LinearLayout
android:id="@+id/quoteActionView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/TextColor"
android:clickable="true"
android:orientation="horizontal">
<ImageView
android:id="@+id/imageAuthorView"
android:layout_width="@dimen/imageAuthorView"
android:layout_height="@dimen/imageAuthorView"
android:visibility="visible" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/textQuote"
android:ellipsize="end"
android:layout_width="match_parent"
android:layout_height="0dp"
android:paddingRight="@dimen/list_text_margin"
android:paddingLeft="@dimen/list_text_margin"
android:gravity="center_vertical"
android:layout_weight="2"
android:maxLines="2"
android:layout_margin="2dp"
android:lineSpacingExtra="@dimen/linespace"
android:textColor="?attr/MainTextColor"
android:text="Hello there two line text for show here which I am typing for a test"
android:scrollHorizontally="true"
android:textSize="@dimen/textDetailQuote"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:background="?attr/dark_color"
android:orientation="horizontal">
<ImageView
android:layout_width="@dimen/likeIcon"
android:layout_height="@dimen/likeIcon"
android:layout_weight="1"
android:tint="?attr/List_Text"
android:src="@drawable/time_new_ic" />
<TextView
android:id="@+id/lblTimeCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="00:00"
android:textStyle="bold"
android:textColor="?attr/List_Text"
android:textSize="@dimen/lblTime" />
<ImageView
android:layout_width="@dimen/likeIcon"
android:layout_height="@dimen/likeIcon"
android:layout_weight="1"
android:tint="?attr/List_Text"
android:src="@drawable/fav_new_ic" />
<TextView
android:id="@+id/lblLikeCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="200"
android:textStyle="bold"
android:textColor="?attr/List_Text"
android:textSize="@dimen/lblTime" />
<ImageView
android:layout_width="@dimen/likeIcon"
android:layout_height="@dimen/likeIcon"
android:layout_weight="1"
android:tint="?attr/List_Text"
android:src="@drawable/share_new_ic" />
<TextView
android:id="@+id/lblShareCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textStyle="bold"
android:text="100"
android:textColor="?attr/List_Text"
android:textSize="@dimen/lblTime" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
我已经尝试了 Whosebug 中列出的许多解决方案,但都没有奏效。 如果我从列表项中删除 CardView
...。涟漪效应会在 LinearLayout
后面显示出来,但我也想使用 CardView
。 让我知道如果有人可以帮助我解决这个问题。谢谢。
注:我已经用解决了。谢谢
使用android:background="?android:attr/selectableItemBackground"
创建波纹 drawable 并将其设置为布局的 foreground
ripple.xml
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="@color/your_color"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<solid android:color="@color/your_color" />
</shape>
</item>
</ripple>
像这样更改您的代码:
<RelativeLayout
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.support.v7.widget.CardView
android:clickable="true"
android:foreground="@drawable/ripple"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="4dp"
app:cardCornerRadius="6dp"
app:cardElevation="4dp">
将波纹设置为前景可绘制在CardView
:
android:foreground="?attr/selectableItemBackground"
这将使涟漪显示在 上方 CardView
内的内容,这通常是 CardView
[=14] 中的内容=]
我正在使用 RecyclerView
显示报价列表 Fragment
。我正在尝试在列表项中使用 Ripple 效果,但它不起作用。我的 RecyclerView
如下所示
<android.support.v7.widget.RecyclerView
android:id="@+id/listQuoteView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/BackColor"
android:layout_above="@+id/startAppBanner"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
列表项XML如下所示
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="?attr/selectableItemBackground"
android:clickable="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="4dp"
app:cardCornerRadius="6dp"
app:cardElevation="4dp">
<LinearLayout
android:id="@+id/quoteActionView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/TextColor"
android:clickable="true"
android:orientation="horizontal">
<ImageView
android:id="@+id/imageAuthorView"
android:layout_width="@dimen/imageAuthorView"
android:layout_height="@dimen/imageAuthorView"
android:visibility="visible" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/textQuote"
android:ellipsize="end"
android:layout_width="match_parent"
android:layout_height="0dp"
android:paddingRight="@dimen/list_text_margin"
android:paddingLeft="@dimen/list_text_margin"
android:gravity="center_vertical"
android:layout_weight="2"
android:maxLines="2"
android:layout_margin="2dp"
android:lineSpacingExtra="@dimen/linespace"
android:textColor="?attr/MainTextColor"
android:text="Hello there two line text for show here which I am typing for a test"
android:scrollHorizontally="true"
android:textSize="@dimen/textDetailQuote"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:background="?attr/dark_color"
android:orientation="horizontal">
<ImageView
android:layout_width="@dimen/likeIcon"
android:layout_height="@dimen/likeIcon"
android:layout_weight="1"
android:tint="?attr/List_Text"
android:src="@drawable/time_new_ic" />
<TextView
android:id="@+id/lblTimeCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="00:00"
android:textStyle="bold"
android:textColor="?attr/List_Text"
android:textSize="@dimen/lblTime" />
<ImageView
android:layout_width="@dimen/likeIcon"
android:layout_height="@dimen/likeIcon"
android:layout_weight="1"
android:tint="?attr/List_Text"
android:src="@drawable/fav_new_ic" />
<TextView
android:id="@+id/lblLikeCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="200"
android:textStyle="bold"
android:textColor="?attr/List_Text"
android:textSize="@dimen/lblTime" />
<ImageView
android:layout_width="@dimen/likeIcon"
android:layout_height="@dimen/likeIcon"
android:layout_weight="1"
android:tint="?attr/List_Text"
android:src="@drawable/share_new_ic" />
<TextView
android:id="@+id/lblShareCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textStyle="bold"
android:text="100"
android:textColor="?attr/List_Text"
android:textSize="@dimen/lblTime" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
我已经尝试了 Whosebug 中列出的许多解决方案,但都没有奏效。 如果我从列表项中删除 CardView
...。涟漪效应会在 LinearLayout
后面显示出来,但我也想使用 CardView
。 让我知道如果有人可以帮助我解决这个问题。谢谢。
注:我已经用
使用android:background="?android:attr/selectableItemBackground"
创建波纹 drawable 并将其设置为布局的 foreground
ripple.xml
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="@color/your_color"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<solid android:color="@color/your_color" />
</shape>
</item>
</ripple>
像这样更改您的代码:
<RelativeLayout
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.support.v7.widget.CardView
android:clickable="true"
android:foreground="@drawable/ripple"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="4dp"
app:cardCornerRadius="6dp"
app:cardElevation="4dp">
将波纹设置为前景可绘制在CardView
:
android:foreground="?attr/selectableItemBackground"
这将使涟漪显示在 上方 CardView
内的内容,这通常是 CardView
[=14] 中的内容=]