Использование? SelectableItemBackground с белым цветом фона

Я всегда использовал android:background="?selectableItemBackground" для эффекта пульсации, когда щелкнул вид (a LinearLayout). Кажется, я где-то читал, что это обратно совместимо с API 14.

Однако я обнаружил, что мне нужно использовать этот эффект пульсации, но на белом фоне. В частности, у меня есть макет элемента списка, который будет отображаться на цветном фоне по умолчанию (я расширяюсь от Theme.AppCompat.Light.NoActionBar), поэтому я хочу, чтобы элемент списка выделялся из этого фона, окрашивая элемент списка plain white (#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, которые я использую).

введите описание изображения здесь

введите описание изображения здесь

Как я могу достичь желаемого эффекта?

Ответы

Ответ 1

Вы можете использовать передний план FrameLayout:

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

Ответ 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>

Ответ 3

Выравнивание пульсаций равно 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>

Ответ 4

Другие ответы работают несколько, но для меня лучше всего работает следующее:

В 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 добавить цвет по вашему выбору с небольшим количеством альфа #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"
      ... />

В макете Activity 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