dart - How to remove scroll glow?

Question

By default, flutter adds a glowing effect on ListView/GridView/... to overscrolls on android phones

I would like to remove this effect entirely or on one specific scrollable. I know that I can change ScrollPhysics to change between Bounce/Clamp. But this doesn't actually remove the glow effect.

What can I do ?

Answer 1

The glow effect comes from GlowingOverscrollIndicator added by ScrollBehavior

To remove this effect, you need to specify a custom ScrollBehavior. For that, simply wrap any given part of your application into a ScrollConfiguration with the desired ScrollBehavior.

The following ScrollBehavior will remove the glow effect entirely :

class MyBehavior extends ScrollBehavior {
  @override
  Widget buildViewportChrome(
      BuildContext context, Widget child, AxisDirection axisDirection) {
    return child;
  }
}

To remove the glow on the whole application, you can add it right under MaterialApp :

MaterialApp(
  builder: (context, child) {
    return ScrollConfiguration(
      behavior: MyBehavior(),
      child: child,
    );
  },
  home: new MyHomePage(),
);

To remove it on a specific ListView, instead wrap only the desired ListView :

ScrollConfiguration(
  behavior: MyBehavior(),
  child: ListView(
    ...
  ),
)

---

This is also valid if you want to change the effect. Like adding a fade when reaching borders of the scroll view.