1

This is my XML:

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.instantbits.rippletest.MainActivity"
    tools:showIn="@layout/activity_main">
   <android.support.v7.widget.AppCompatImageButton
       android:layout_width="48dp"
       android:layout_height="48dp"
       android:layout_marginStart="8dp"
       android:layout_marginTop="8dp"
       android:background="?attr/selectableItemBackgroundBorderless"
       app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintTop_toTopOf="parent"
       app:srcCompat="@drawable/ic_arrow_drop_down_circle_black_24dp"
       android:id="@+id/b1"/>
   <View
       android:id="@+id/view"
       android:layout_width="60dp"
       android:layout_height="60dp"
       android:layout_marginStart="8dp"
       android:background="@color/colorAccent"
       app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintTop_toBottomOf="@+id/b1"/>
   <android.support.v7.widget.AppCompatImageButton
       android:id="@+id/b2"
       android:layout_width="48dp"
       android:layout_height="48dp"
       android:layout_marginBottom="8dp"
       android:layout_marginEnd="8dp"
       android:layout_marginStart="8dp"
       android:layout_marginTop="8dp"
       android:background="?attr/selectableItemBackgroundBorderless"
       app:layout_constraintBottom_toBottomOf="@+id/view"
       app:layout_constraintEnd_toEndOf="@+id/view"
       app:layout_constraintStart_toStartOf="@+id/view"
       app:layout_constraintTop_toTopOf="@+id/view"
       app:srcCompat="@drawable/ic_arrow_drop_down_circle_black_24dp"/>

</android.support.constraint.ConstraintLayout>

Basically I have a View with a background and a ImageButton on top of it. I also have another identical ImageButton without a View behind it. The top ImageButton without the View behind it shows the ripple just fine. The ImageButton with the View behind it only shows the end of the ripple outside the View with the background.

How can I fix this?

casolorz
  • 8,486
  • 19
  • 93
  • 200
  • It is showing the ripple as expected, just that it is not visible because of the color of the view's background. And since the bg is white outside you're able to see it – Veneet Reddy Nov 21 '17 at 21:05
  • So I can't have rippled inside views that sit on top of other views if that those other views have backgrounds? – casolorz Nov 21 '17 at 21:21
  • I though that just because the bg was a bright color it wasn't visible to the naked eye, I tried with white and you were right, seems the ripple is behind the `View`. No idea why this happens. Wierd. – Veneet Reddy Nov 21 '17 at 21:26
  • I guess I didn't show it here but I changed my ripple color to be purple to make sure I can see it. – casolorz Nov 21 '17 at 22:01
  • Hey I found this, may be related: https://stackoverflow.com/questions/31948189/material-ripple-effect-hidden-by-other-view-in-layout – Veneet Reddy Nov 27 '17 at 08:00
  • Yeah that kind of fixes it, thanks. Basically I put my `ImageButton` inside a `LinearLayout` that is transparent. If you want to make an answer I'll gladly mark it is answered. – casolorz Nov 27 '17 at 16:52

0 Answers0