The EdgeEffect class provides a standard way to draw overscroll effects at the edges of scrollable containers. The EdgeEffectCompat class from the support library wraps it so that it can be used across multiple platform versions in a backwards compatible way. I’ve had my eye on this particular class for a while, and I finally got a chance to use it when we were working on improving the accessibility support for the video/screenshot gallery section on app details pages.

For a number of design requirements we have implemented our own custom scrolling component for the section that displays the application screenshots and the optional video trailer. The downside of doing custom scrolling handling is that you have to take over pretty much everything, including accessibility. This has been the last major piece that was lacking proper support in that area, and the latest Play Store release has finally closed that gap. And while we were in that section, I also fixed the missing overscroll indication.

• You get proper overscroll effects for “free” when you’re using the core views, such as ScrollView or ViewPager. And if you’re doing a custom scrolling implementation, EdgeEffectCompat is your friend. Here’s what you need to do in order to do it properly:
• For every edge that should show overscroll, define its own EdgeEffectCompat object.
• Call setWillNotDraw(false) on your container.
• For MotionEffect.ACTION_MOVE, call EdgeEffectCompat.onPull() when you detect overscroll at the matching edge.  If that method returns true on at least one object, call invalidate() on your container.
• For MotionEffect.ACTION_UP and MotionEffect.ACTION_CANCEL, call EdgeEffectCompat.onRelease(). If that method returns true on at least one object, call invalidate() on your container.
• Override draw() method, and after calling super.draw() go over all EdgeEffectCompat objects. For each one that returns false from its isFinished(), apply the matching chain of transformations (rotate, translate), call EdgeEffectCompat.setSize() and EdgeEffectCompat.draw(). If at least one draw() method returns true, call invalidate() on your container as the last line of your draw() method.

There’s the usual hand-waving involved here, and the source of ViewPager provides a complete example of doing custom overscroll draws. The two more complicated points are about updating the objects only during dragging, and about applying the correct sequence of transformations depending on which edge you’re drawing.