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 buildOverscrollIndicator( BuildContext context, Widget child, ScrollableDetails details) { 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.
Or
You don't need to build your own custom ScrollBehavior class. Instead, just wrap your scrollable widget in a ScrollConfiguration widget and set the behavior property to:
const ScrollBehavior().copyWith(overscroll: false).
Full code example:
ScrollConfiguration( behavior: const ScrollBehavior().copyWith(overscroll: false), child: PageView( physics: const PageScrollPhysics(), controller: model.pageController, children: [ PageOne(), PageTwo(), PageThree(), PageFour(), ], ), ),