How to animate ripple effect from center position to full diameter

Question

I am trying to create an image button effect using the ripple. I however want the ripple effect to start from the center of my image button icon and fill the image button. Is it possible to have the ripple effect animate from center to full circle. Like a white circle animates in size from 0 to the diameter of the circle?

Answer 1

As it's stated in the documentation for the RippleDrawable you can set the anchoring point using setHotspot method.

By default View sets the hotspot to the current touch coordinates when pressed:

private void setPressed(boolean pressed, float x, float y) {
        if (pressed) {
            drawableHotspotChanged(x, y);
        }

        setPressed(pressed);
    }

And ImageView passes this hotspot to its content:

 public void drawableHotspotChanged(float x, float y) {
    super.drawableHotspotChanged(x, y);

    if (mDrawable != null) {
        mDrawable.setHotspot(x, y);
    }
}

So one way of getting the ripple effect starting from center is to extend ImageView and always set the hotspot to the center. There are other ways of course, eg one can try to extend RippleDrawable and override setHotspot there.