向可选项目添加selectableItemBackground并为背景着色

Question

我已经在RecyclerView上的CardView中添加了selectableItemBackground，每个CardView都显示文本和图像。每个卡片都可以被选择，在点击时为了添加涟漪效果，我已经添加了以下内容：

android:background="?attr/selectableItemBackground"

问题是现在我不能设置背景颜色。这两行代码一起会显示一个错误：

android:background="?attr/selectableItemBackground"
android:background="#FFFFFF"

如何为布局背景添加颜色并使用selectableItemBackground添加涟漪效果。

完整的card_view.xml代码：

<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="match_parent"
    android:layout_margin="2dp"
    card_view:cardCornerRadius="10dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="?attr/selectableItemBackground"
        android:orientation="vertical">
        <!--CANT ADD THIS: android:background="#FFFFFF"-->

        <TextView
            android:id="@+id/singleTextLine"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:layout_margin="3dp"
            android:text="Test"
            android:textSize="30dp" />

        <ImageView
            android:id="@+id/singleImage"
            android:layout_width="fill_parent"
            android:layout_height="125dp"
            android:layout_gravity="center_horizontal"
            android:layout_margin="3dp" />

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

问题在于我无法将背景颜色设置为白色，同时又使用?attr/selectableItemBackground实现涟漪效果，结果看起来像这样：

- Yuval Levy

---

你尝试过选择器吗？ - Rahul Sharma

我会查看的，谢谢。 - Yuval Levy

有人回答了这个问题吗？@RahulSharma - Shubham AgaRwal

不要将其添加为“background”，而是将其添加为“foreground”像这样： android:background="#ffffff" android:foreground="?android:selectableItemBackground" - J El

Answer 1

你有两个选项：

1：添加父线性布局：

父布局具有背景颜色，子布局具有涟漪效果。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="?attr/selectableItemBackground"
        android:clickable="true"
        android:orientation="vertical">

       <TextView
            android:id="@+id/singleTextLine"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:layout_margin="3dp"
            android:text="Test"
            android:textSize="30dp" />

        <ImageView
            android:id="@+id/singleImage"
            android:layout_width="fill_parent"
            android:layout_height="125dp"
            android:layout_gravity="center_horizontal"
            android:layout_margin="3dp" />


    </LinearLayout>
</LinearLayout>

2：Opton： 创建可绘制的资源文件：bg_ripple.xml

其中一个在drawable文件夹中。

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@color/gray"/>
    <item android:drawable="@color/white"/>
</selector>

另一个在文件夹中的 drawable-v21

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/gray">
    <item android:drawable="@color/white" />
</ripple>

然后将此资源设置为您的布局背景：

android:background="@drawable/bg_ripple"

- Matej Scolopax

---

第一个选项是否会在 API 21 之前的设备上产生涟漪效果？也就是 Android 4.x.x。 - Noah

Answer 2

现在我们可以以更好的方式实现这一点。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFFFFF" //ACTUAL BACKGROUND
    android:foreground="?selectableItemBackground" //RIPPLE EFFECT
    android:orientation="vertical">

- Johnett Mathew

---

这比其他解决方案要容易得多。 - Maverick

这很好，但只适用于API 23及以上版本。 - YaMiN

我的应用程序仍然支持Android 4.0，所以我实际上不能使用这个。 - Noah

你试过 @Matej Scolopax 的答案了吗？ - Johnett Mathew

Answer 3

还有一种更简单的方法是添加一个FrameLayout（设置背景颜色），并将原始TextView包含在其中。

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/category_numbers">
<TextView
    android:id="@+id/numbers"
    style="@style/CategoryStyle"
    android:background="?android:selectableItemBackground"
    android:text="@string/category_numbers" />
</FrameLayout>

- Hoya Hsu