使用带有白色背景色的{selectableItemBackground

Question

当点击视图（例如android:background="?selectableItemBackground"时）时，我一直在使用LinearLayout来产生连锁反应。我想我在某处读到了它向后兼容API 14。

但是，我发现我需要使用这种涟漪效果，但背景为白色。具体来说，我有一个列表项的布局将显示在默认的颜色背景上（我从Theme.AppCompat.Light.NoActionBar延伸），所以我希望列表项通过着色列表项明白而从这个背景中脱颖而出白色（#FFFFFF）。

以下是列表项布局：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="?selectableItemBackground"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    ...

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:paddingLeft="@dimen/mdu_keyline_1"
        android:paddingRight="@dimen/mdu_keyline_1"
        android:paddingTop="@dimen/mdu_padding_normal"
        android:paddingBottom="@dimen/mdu_padding_normal">

        ...

    </LinearLayout>

</FrameLayout>

以上产生没有白色背景的涟漪效应。

如果我尝试：

<FrameLayout ...
    android:background="@color/white">

这显然会产生白色背景，但没有涟漪效应。

我还尝试了其他的东西 - 这产生了一个最接近我所寻找的结果：

<FrameLayout ...
    android:background="@color/white">

    ...

    <LinearLayout ...
        android:background="?selectableItemBackground">

上面给了我带有涟漪效果的白色背景。 然而，无论我点击的项目是哪一部分，纹波似乎总是从中心开始。

以下是一些显示当前结果的屏幕截图（忽略列表项顶部的阴影 - 这是我正在使用的AppBarLayout和Toolbar的阴影。

我怎样才能达到预期的效果？

Answer 1

您可以使用FrameLayout的前景：

<FrameLayout ...
    android:background="@android:color/white"
    android:foreground="?attr/selectableItemBackground">

Answer 2

您可以在drawables文件夹中创建图层列表，并将其设置为您的背景：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@android:color/white"/>
    <item android:drawable="?attr/selectableItemBackground"/>
</layer-list>

Answer 3

其他答案的确起作用，但以下内容对我来说才最有效：

在styles.xml中添加colorControlHighlight          

  <style name="ExampleTheme" parent="Theme.AppCompat">
    <item name="colorAccent">...</item>
    <item name="colorPrimary">...</item>
    <item name="colorPrimaryDark">...</item>
    ...
    <item name="colorControlHighlight">@color/purple_bg</item> <-- THIS LINE
    ...
  </style>

</resources>

在colors.xml中添加一些Alpha #77632E8E来选择颜色

<?xml version="1.0" encoding="UTF-8" ?>
<resources>

  <color name="purple_bg">#77632E8E</color>

</resources>

在AndroidManifest.xml中为您的活动（所有活动）设置主题

<activity android:name=".MainActivity"
      ...
      android:theme="@style/ExampleTheme"
      ... />

在“活动”的布局main_layout.xml中，在您要对其起作用的视图上设置android:background：

<LinearLayout
    android:id="@+id/llBlock"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:background="?attr/selectableItemBackgroundBorderless">
    ....
</LinearLayout>

?attr/selectableItemBackground和?attr/selectableItemBackgroundBorderless都有效

Answer 4

Ripple drawable是LayerDrawable。 所以正确的方法是：

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?attr/colorControlHighlight">

    <item>
        <shape>
            <solid
                android:color="#FFFFFF"/>
        </shape>
    </item>

    <item android:id="@android:id/mask">
        <shape>
            <solid android:color="@android:color/white"/>
        </shape>
    </item>

</ripple>