OverScrollGlowColor always blue on Android

Issue #8 resolved
Albert-Jan Plate created an issue

Seems like the app uses a different styling property compared to the default theme of the app, which results in a different overscroll glow color compared to the rest of the app.

When looking into the ThemeData class of Flutter, the following explanation can be found for the accent color:

  /// The foreground color for widgets (knobs, text, overscroll edge effect, etc).
  /// Accent color is also known as the secondary color.
  /// The theme's [colorScheme] property contains [ColorScheme.secondary], as
  /// well as a color that contrasts well with the secondary color called
  /// [ColorScheme.onSecondary]. It might be simpler to just configure an app's
  /// visuals in terms of the theme's [colorScheme].
  final Color accentColor;

and also:

 The [accentColor], sometimes called the secondary color, and,
  ///    if the accent color is specified, its brightness
  ///    ([accentColorBrightness]), so that the right contrasting text
  ///    color will be used over the accent color.

However, setting the secondary color using the following code, doesn’t change the color of the overscroll effect.

colorScheme: Theme.of(context).brightness == Brightness.light
          ? ColorScheme.light(
              primary: Colors.blue.shade50,
              onPrimary: Colors.grey.shade900,
              secondary: Theme.of(context).accentColor,
              onSecondary: Theme.of(context).accentColor,
              background: Colors.transparent,
              onBackground: Colors.black)
          : ColorScheme.dark(
              primary: Colors.white,
              onPrimary: Colors.white,
              secondary: Theme.of(context).accentColor,
              onSecondary: Theme.of(context).accentColor,
              background: Colors.transparent,
              onBackground: Colors.white70),

PS: I’m sorry to bother you with such a nitty pitty issue, but I’m too perfectionistic, sorry 😅


Comments (4)

  1. Albert-Jan Plate reporter

    Managed to fix it up manually in the source code with the following code:

    return ScrollConfiguration(
                    behavior: ScrollBehavior(),
                    child: GlowingOverscrollIndicator(
                        axisDirection: AxisDirection.down,
                        color: Theme
                        child: ListView(
                            padding: EdgeInsets.zero,
                            children: _controller.children.map((
                                    Node node) {
                                return TreeNode(node: node);

    Although a more general styling would be better fitting I believe.

  2. Kevin Armstrong

    Hi Albert-Jan, I understand wanting to get it exactly the way you want it. I’m very much the same. I actually just refactored the code to use a parent theme if it exists. This will eliminate the need for a parent widget to control the overscroll color but instead allow you to do it through theming and changing the accent Color as you did in your example.

    I just need a few minutes to run my unit tests and upload the changes.

  3. Albert-Jan Plate reporter

    This is awesome! Thank you very much for the quick reply and fix! You’re the best 🙂

  4. Log in to comment