selectableItemBackgroundBorderless issue in ConstraintLayout

Question

selectableItemBackgroundBorderless is not working if ImageButton or Button is placed inside a View with a background, but selectableItemBackground still works.

Xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="match_parent"
    android:background="@color/colorAccent">

    <View
        android:id="@+id/view"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:background="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:visibility="visible"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0" />


    <android.support.v7.widget.AppCompatImageButton
        android:id="@+id/previous_ib"
        android:layout_width="42dp"
        android:layout_height="42dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="32dp"
        android:layout_marginTop="8dp"
        android:background="?selectableItemBackgroundBorderless"
        android:contentDescription="@string/app_name"
        android:scaleType="centerInside"
        android:src="@drawable/ic_action_previous"
        app:layout_constraintBottom_toBottomOf="@+id/play_ib"
        app:layout_constraintEnd_toStartOf="@+id/play_ib"
        app:layout_constraintTop_toTopOf="@+id/play_ib" />


    <android.support.v7.widget.AppCompatImageButton
        android:id="@+id/play_ib"
        android:layout_width="68dp"
        android:layout_height="68dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:background="?selectableItemBackgroundBorderless"
        android:contentDescription="@string/app_name"
        android:scaleType="centerInside"
        android:src="@drawable/ic_action_play"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/view" />


    <android.support.v7.widget.AppCompatImageButton
        android:id="@+id/next_ib"
        android:layout_width="42dp"
        android:layout_height="42dp"
        android:layout_marginBottom="8dp"
        android:layout_marginStart="32dp"
        android:layout_marginTop="8dp"
        android:background="?selectableItemBackgroundBorderless"
        android:contentDescription="@string/app_name"
        android:scaleType="centerInside"
        android:src="@drawable/ic_action_next"
        app:layout_constraintBottom_toBottomOf="@+id/play_ib"
        app:layout_constraintStart_toEndOf="@+id/play_ib"
        app:layout_constraintTop_toTopOf="@+id/play_ib" />

</android.support.constraint.ConstraintLayout>

This is what I am trying to do. But the ripple effects are gone.

Answer 1

Until this issue got fixed, one solution is to use android:background="?actionBarItemBackground" that creates circular ripple effect and also works in constraint layout.