How to trigger ripple effect on Android Lollipop, in specific location within the view, without triggering touches events?

Question

This is a short question:

Suppose I have a View with the RippleDrawable as background.

Is there an easy way to trigger the ripple from a specific position without triggering any touch or click events?

Answer 1

Thank you guys! Your answers help with my problem, but I had to build a solution from multiple answers.

My problem was with transparent RecyclerView item (header) and buttons behind it. You may see this situation on picture:

For click on followers/liked/subscriptions buttons I had to add View.OnTouchListener for RecyclerView header:

class ProfileHeaderHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {

    private val clickView: View = itemView.findViewById(R.id.profile_header_view)

    fun bind(callback: View.OnTouchListener) {
        clickView.setOnTouchListener(callback)
    }

    fun unbind() {
        clickView.setOnTouchListener(null)
    }
}

And inside Fragment simulate button click and ripple effect:

/**
 * [View.performClick] should call inside [onTouch].
 */
override fun onTouch(view: View?, ev: MotionEvent?): Boolean {
    if (ev == null) return true

    val followersContainer = followersContainer ?: return true
    val likeContainer = likeContainer ?: return true
    val subscriptionsContainer = subscriptionsContainer ?: return true
    
    when {
        ev.onView(followersContainer) -> if (followersContainer.isClick(ev)) {
            followersContainer.performClick()
        }
        ev.onView(likeContainer) -> if (likeContainer.isClick(ev)) {
            likeContainer.performClick()
        }
        ev.onView(subscriptionsContainer) -> if (subscriptionsContainer.isClick(ev)) {
            subscriptionsContainer.performClick()
        }
    }

    return true
}

/**
 * [MotionEvent.ACTION_UP] - user make click (remove ripple)
 * [MotionEvent.ACTION_DOWN] - user start click (show ripple)
 * [MotionEvent.ACTION_CANCEL] - user move touch outside of [View] (remove ripple)
 */
private fun View.isClick(ev: MotionEvent): Boolean {        
    when (ev.action) {
        MotionEvent.ACTION_UP -> {
            changeRippleState(ev, isTouch = false)
            return true
        }
        MotionEvent.ACTION_DOWN -> changeRippleState(ev, isTouch = true)
        MotionEvent.ACTION_CANCEL -> changeRippleState(ev, isTouch = false)
    }
    
    return false
}

/**
 * [this] show have android:background with ripple drawable (?attr/selectableItemBackground).
 */
private fun View.changeRippleState(ev: MotionEvent, isTouch: Boolean) {
    val rippleDrawable = background as? RippleDrawable ?: return

    /**
     * For emulate click position.
     */
    rippleDrawable.setHotspot(ev.rawX, ev.rawY)
    isPressed = isTouch
}

I check another way to set press state for RippleDrawable and it's also works:

rippleDrawable.state = if (isTouch) {
    intArrayOf(android.R.attr.state_pressed, android.R.attr.state_enabled)
} else {
    intArrayOf()
}

Extension for check MotionEvent happen inside View or outside:

fun MotionEvent?.onView(view: View?): Boolean {
    if (view == null || this == null) return false

    return Rect().apply {
        view.getGlobalVisibleRect(this)
    }.contains(rawX.toInt(), rawY.toInt())
}

Answer 2

I used the following Kotlin variant of Luke's code to manually show and hide a ripple when swiping cells out of a RecyclerView:

fun View.showRipple() {
    if (Build.VERSION.SDK_INT >= 21 && background is RippleDrawable) {
        background.state = intArrayOf(android.R.attr.state_pressed, android.R.attr.state_enabled)
    }
}

fun View.hideRipple() {
    if (Build.VERSION.SDK_INT >= 21 && background is RippleDrawable) {
        background.state = intArrayOf()
    }
}

Answer 3

Here is combination of Nikola's setHotSpot() and https://stackoverflow.com/a/25415471/1474113

private void forceRipple(View view, int x, int y) {
    Drawable background = view.getBackground();
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP && background instanceof RippleDrawable) {
        background.setHotspot(x, y);
    }
    view.setPressed(true);
    // For a quick ripple, you can immediately set false.
    view.setPressed(false);
}

Answer 4

I incorporated/combined the answers from @Xaver Kapeller and @Nikola Despotoski above:

protected void forceRippleAnimation(View view)
{
    Drawable background = view.getBackground();

    if(Build.VERSION.SDK_INT >= 21 && background instanceof RippleDrawable)
    {
        final RippleDrawable rippleDrawable = (RippleDrawable) background;

        rippleDrawable.setState(new int[]{android.R.attr.state_pressed, android.R.attr.state_enabled});

        Handler handler = new Handler();

        handler.postDelayed(new Runnable()
        {
            @Override public void run()
            {
                rippleDrawable.setState(new int[]{});
            }
        }, 200);
    }
}

To programmatically force a ripple effect on command, simply call forceRippleAnimation(), passing the View you want to ripple as a parameter.

Answer 5

Yes there is! In order to trigger a ripple programatically you have to set the state of the RippleDrawable with setState(). Calling setVisible() does NOT work!

---

The Solution

To show the ripple you have to set the state to pressed and enabled at the same time:

rippleDrawable.setState(new int[] { android.R.attr.state_pressed, android.R.attr.state_enabled });

The ripple will be shown as long as those states are set. When you want to hide the ripple again set the state to an empty int[]:

rippleDrawable.setState(new int[] {  });

You can set the point from which the ripple emanates by calling setHotspot().

---

How it works

I have debugged a lot and studied the source code of RippleDrawable up and down until I realised that the ripple is actually triggered in onStateChange(). Calling setVisible() has no effect and never causes any ripple to actually appear.

The relevant part of the source code of RippleDrawable is this:

@Override
protected boolean onStateChange(int[] stateSet) {
    final boolean changed = super.onStateChange(stateSet);

    boolean enabled = false;
    boolean pressed = false;
    boolean focused = false;

    for (int state : stateSet) {
        if (state == R.attr.state_enabled) {
            enabled = true;
        }
        if (state == R.attr.state_focused) {
            focused = true;
        }
        if (state == R.attr.state_pressed) {
            pressed = true;
        }
    }

    setRippleActive(enabled && pressed);
    setBackgroundActive(focused || (enabled && pressed));

    return changed;
}

As you can see if both the enabled and pressed attribute are set then both the ripple and background will be activated and the ripple will be displayed. Additionally as long as you set the focused state the background will be activated as well. With this you can trigger the ripple and have the background change color independently.

If you are interested you can view the entire source code of RippleDrawable here.

Answer 6

First, you need to get the drawable from the View.

private void forceRippleAnimation(View v, float x, float y){
   Drawable background = v.getBackground();
   if(background instanceof RippleDrawable){
     RippleDrawable ripple = (RippleDrawable)background;
     ripple.setHotspot(x, y);
     ripple.setVisible (true, true);
   }

}

Method setHotspot(x,y); is used to set from where the ripple animation will start, otherwise if not set, the RippleDrawable will take the Rect where it resides (i.e the Rect of the View where it is set as background) and will start the ripple effect from the center.

setVisible(true, true) will make the drawable visible and last argument will force animation regardless of the current drawable state.