Add `InheritedTheme` support to `ScrollbarTheme` #120970

TahaTesser · 2023-02-17T13:05:53Z

fixes #120869
fixes #120964

code sample

import 'package:flutter/material.dart';

enum SampleItem { itemOne, itemTwo, itemThree }

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        useMaterial3: true,
        scrollbarTheme: const ScrollbarThemeData(
          thumbColor: MaterialStatePropertyAll<Color?>(Colors.red),
        ),
      ),
      home: const Example(),
    );
  }
}

class Example extends StatelessWidget {
  const Example({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('ScrollbarTheme Sample'),
      ),
      body: ScrollbarTheme(
        data: const ScrollbarThemeData(
          thumbColor: MaterialStatePropertyAll<Color?>(Colors.green),
        ),
        child: Center(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              const SizedBox(height: 20),
              MenuBar(
                children: <Widget>[
                  SubmenuButton(
                    menuStyle: const MenuStyle(
                      maximumSize: MaterialStatePropertyAll<Size?>(
                        Size.fromHeight(
                          600,
                        ),
                      ),
                    ),
                    menuChildren: <Widget>[
                      for (int i = 0; i < 10; i++)
                        MenuItemButton(
                          style: const ButtonStyle(
                            minimumSize:
                                MaterialStatePropertyAll<Size>(Size.fromHeight(200)),
                          ),
                          onPressed: () => print('pressed item $i'),
                          child: Text(
                            'MenuBar Item $i',
                          ),
                        ),
                    ],
                    child: const Text(
                      'MenuBar',
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 20),
              PopupMenuButton<SampleItem>(
                child: const Text('Show PopupMenu'),
                onSelected: (SampleItem item) {},
                itemBuilder: (BuildContext context) =>
                    <PopupMenuEntry<SampleItem>>[
                  for (int i = 0; i < 10; i++)
                    PopupMenuItem<SampleItem>(
                      height: 200,
                      value: SampleItem.itemOne,
                      child: Text('Popup Item $i'),
                    ),
                ],
              ),
            ],
          ),
        ),
      ),
       bottomSheet: BottomAppBar(
          child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          // RichText Widget with "Expected Results:" in black and "Green Scrollbar" in green.
          RichText(
            text: const TextSpan(
              text: 'Expected Results: ',
              style: TextStyle(color: Colors.black),
              children: <TextSpan>[
                TextSpan(
                  text: 'Green Scrollbar',
                  style: TextStyle(color: Colors.green),
                ),
              ],
            ),
          ),
          // RichText Widget with "Expected Results:" in black and "Red Scrollbar" in red.
          RichText(
            text: const TextSpan(
              text: 'Actual Results: ',
              style: TextStyle(color: Colors.black),
              children: <TextSpan>[
                TextSpan(
                  text: 'Red Scrollbar',
                  style: TextStyle(color: Colors.red),
                ),
              ],
            ),
          ),
        ],
      )),
    );
  }
}

Description

When wrapping widgets like MenuBar or PopupMenuButton (that have a secondary route) with a local ScrollbarTheme, the scrollbar inside the menus doesn't update.

Expected Results

`MenuBar`	`PopupMenuButton`

Actual Results

`MenuBar`	`PopupMenuButton`

Pre-launch Checklist

I read the Contributor Guide and followed the process outlined there for submitting PRs.
I read the Tree Hygiene wiki page, which explains my responsibilities.
I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
I signed the CLA.
I listed at least one issue that this PR fixes in the description above.
I updated/added relevant documentation (doc comments with ///).
I added new tests to check the change I am making, or this PR is test-exempt.
All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

Piinks

Nice, I did not know about InheritedTheme - TIL! Thanks! LGTM.

…tter#120970)

…lutter#120970)

* df98689 2be7253c9 Roll Fuchsia Linux SDK from q7u2WyX2BSRBIzyTW... to yT4JLKTCWWwbRwB0l... (flutter/engine#39679) (flutter/flutter#120898) * cacef57 [flutter_tools] Skip over "Resolving dependencies..." text in integration tests (flutter/flutter#120077) * 34102ca Migrate channels to pkg:integration _test (flutter/flutter#120833) * df13ea2 Roll Flutter Engine from 2be7253c9b10 to e4cb80e22ee1 (2 revisions) (flutter/flutter#120903) * a2e65f7 Roll Flutter Engine from e4cb80e22ee1 to 4a90fbcd6901 (2 revisions) (flutter/flutter#120911) * e00241a Enable Windows plugin tests (flutter/flutter#119345) * 09ad9f3 Document ScrollPhysics invariant requiring ballistic motion (flutter/flutter#120400) * 6029de2 Update switch template (flutter/flutter#120919) * 229d70e Roll Flutter Engine from 4a90fbcd6901 to bddfc1c4dcaa (5 revisions) (flutter/flutter#120920) * 206c6ae roll packages (flutter/flutter#120922) * 9fcaaeb Roll Flutter Engine from bddfc1c4dcaa to 6602fc753525 (3 revisions) (flutter/flutter#120928) * 00c0a07 Increase Linux docs_test timeout (flutter/flutter#120899) * e29a799 946b29198 [dart:ui] Introduce `PlatformDispatcher.implicitView` (flutter/engine#39553) (flutter/flutter#120939) * 081cd57 650db7a72 [macOS] Eliminate mirrors support (flutter/engine#39694) (flutter/flutter#120943) * 875e48c 52a4fb4c5 Roll Skia from b1800a8b9595 to d0df677ffd5e (13 revisions) (flutter/engine#39699) (flutter/flutter#120947) * 78d058f 6e92c0c28 Roll Fuchsia Mac SDK from xl9Y8o-9FDyvPogki... to haDvcC5VzWVdQs9Rs... (flutter/engine#39700) (flutter/flutter#120950) * 298d8c7 Revert "Remove references to Observatory (#118577)" (flutter/flutter#120929) * 674254c Always use the testbed in web_test.dart so `environment` is populated. (flutter/flutter#120984) * c4d40cc Modify the updateChildren method deep copy _children (flutter/flutter#120773) * 9367641 clean up (flutter/flutter#120934) * 51712b9 Roll Plugins from d699b4a91381 to 8f3419be5e0e (7 revisions) (flutter/flutter#120993) * c3587c6 Add `InheritedTheme` support to `ScrollbarTheme` (flutter/flutter#120970) * 08b409a Roll Flutter Engine from 6e92c0c28410 to bd37a3992b50 (16 revisions) (flutter/flutter#121004) * f785136 [web] Temporarily disable a line boundary test (flutter/flutter#121005) * 9fe5567 Print sub process that failed to run in tool (flutter/flutter#120999) * 6205c11 Remove "note that" in our documentation (as per style guide) (flutter/flutter#120842) * 1daa0be Fix scrollable to clear inner semantics node if it does not use two p… (flutter/flutter#120996) * 7f19b74 0a27673d7 Roll Skia from 02890036028e to 0e444e355607 (9 revisions) (flutter/engine#39723) (flutter/flutter#121008) * 48d2dfc e7fde3f72 [web] Make glassPaneElement and glassPaneShadow non-nullable (flutter/engine#39692) (flutter/flutter#121009) * 6104505 2b2780185 Roll Skia from 0e444e355607 to 4b79e398dfe0 (5 revisions) (flutter/engine#39725) (flutter/flutter#121016) * f99f472 Remove the deprecated accentColor from ThemeData (flutter/flutter#120932) * 2b4c960 Remove more references to dart:ui.window (flutter/flutter#120994) * 0fa6527 Roll Flutter Engine from 2b2780185dd5 to a37e27b77008 (2 revisions) (flutter/flutter#121020) * 9281114 Roll Flutter Engine from a37e27b77008 to 2fdce9a96367 (2 revisions) (flutter/flutter#121023) * 4dd555d Roll Flutter Engine from 2fdce9a96367 to 9a3c3e462fce (3 revisions) (flutter/flutter#121025) * 66dce65 Roll Flutter Engine from 9a3c3e462fce to 3777ed51774f (2 revisions) (flutter/flutter#121029) * a5b53a6 a9db42c3e Roll Skia from 733a19f6a625 to 2f05923f825e (3 revisions) (flutter/engine#39744) (flutter/flutter#121030) * 0be7c3f Roll Flutter Engine from a9db42c3edc2 to c22c64812243 (2 revisions) (flutter/flutter#121041)

…lutter#120970)

* 674254c03 Always use the testbed in web_test.dart so `environment` is populated. (flutter/flutter#120984) * c4d40cc15 Modify the updateChildren method deep copy _children (flutter/flutter#120773) * 9367641ce clean up (flutter/flutter#120934) * 51712b90a Roll Plugins from d699b4a to 8f3419b (7 revisions) (flutter/flutter#120993) * c3587c62e Add `InheritedTheme` support to `ScrollbarTheme` (flutter/flutter#120970) * 08b409ab0 Roll Flutter Engine from 6e92c0c28410 to bd37a3992b50 (16 revisions) (flutter/flutter#121004) * f78513685 [web] Temporarily disable a line boundary test (flutter/flutter#121005) * 9fe556705 Print sub process that failed to run in tool (flutter/flutter#120999) * 6205c110d Remove "note that" in our documentation (as per style guide) (flutter/flutter#120842) * 1daa0be4f Fix scrollable to clear inner semantics node if it does not use two p… (flutter/flutter#120996) * 7f19b7485 0a27673d7 Roll Skia from 02890036028e to 0e444e355607 (9 revisions) (flutter/engine#39723) (flutter/flutter#121008) * 48d2dfc72 e7fde3f72 [web] Make glassPaneElement and glassPaneShadow non-nullable (flutter/engine#39692) (flutter/flutter#121009) * 610450523 2b2780185 Roll Skia from 0e444e355607 to 4b79e398dfe0 (5 revisions) (flutter/engine#39725) (flutter/flutter#121016) * f99f47280 Remove the deprecated accentColor from ThemeData (flutter/flutter#120932) * 2b4c96088 Remove more references to dart:ui.window (flutter/flutter#120994) * 0fa652752 Roll Flutter Engine from 2b2780185dd5 to a37e27b77008 (2 revisions) (flutter/flutter#121020) * 9281114fb Roll Flutter Engine from a37e27b77008 to 2fdce9a96367 (2 revisions) (flutter/flutter#121023) * 4dd555d32 Roll Flutter Engine from 2fdce9a96367 to 9a3c3e462fce (3 revisions) (flutter/flutter#121025) * 66dce657f Roll Flutter Engine from 9a3c3e462fce to 3777ed51774f (2 revisions) (flutter/flutter#121029) * a5b53a6d2 a9db42c3e Roll Skia from 733a19f6a625 to 2f05923f825e (3 revisions) (flutter/engine#39744) (flutter/flutter#121030) * 0be7c3f30 Roll Flutter Engine from a9db42c3edc2 to c22c64812243 (2 revisions) (flutter/flutter#121041)

…tter#120970)

…r#7194) * 674254c03 Always use the testbed in web_test.dart so `environment` is populated. (flutter/flutter#120984) * c4d40cc15 Modify the updateChildren method deep copy _children (flutter/flutter#120773) * 9367641ce clean up (flutter/flutter#120934) * 51712b90a Roll Plugins from d699b4a to 8f3419b (7 revisions) (flutter/flutter#120993) * c3587c62e Add `InheritedTheme` support to `ScrollbarTheme` (flutter/flutter#120970) * 08b409ab0 Roll Flutter Engine from 6e92c0c28410 to bd37a3992b50 (16 revisions) (flutter/flutter#121004) * f78513685 [web] Temporarily disable a line boundary test (flutter/flutter#121005) * 9fe556705 Print sub process that failed to run in tool (flutter/flutter#120999) * 6205c110d Remove "note that" in our documentation (as per style guide) (flutter/flutter#120842) * 1daa0be4f Fix scrollable to clear inner semantics node if it does not use two p… (flutter/flutter#120996) * 7f19b7485 0a27673d7 Roll Skia from 02890036028e to 0e444e355607 (9 revisions) (flutter/engine#39723) (flutter/flutter#121008) * 48d2dfc72 e7fde3f72 [web] Make glassPaneElement and glassPaneShadow non-nullable (flutter/engine#39692) (flutter/flutter#121009) * 610450523 2b2780185 Roll Skia from 0e444e355607 to 4b79e398dfe0 (5 revisions) (flutter/engine#39725) (flutter/flutter#121016) * f99f47280 Remove the deprecated accentColor from ThemeData (flutter/flutter#120932) * 2b4c96088 Remove more references to dart:ui.window (flutter/flutter#120994) * 0fa652752 Roll Flutter Engine from 2b2780185dd5 to a37e27b77008 (2 revisions) (flutter/flutter#121020) * 9281114fb Roll Flutter Engine from a37e27b77008 to 2fdce9a96367 (2 revisions) (flutter/flutter#121023) * 4dd555d32 Roll Flutter Engine from 2fdce9a96367 to 9a3c3e462fce (3 revisions) (flutter/flutter#121025) * 66dce657f Roll Flutter Engine from 9a3c3e462fce to 3777ed51774f (2 revisions) (flutter/flutter#121029) * a5b53a6d2 a9db42c3e Roll Skia from 733a19f6a625 to 2f05923f825e (3 revisions) (flutter/engine#39744) (flutter/flutter#121030) * 0be7c3f30 Roll Flutter Engine from a9db42c3edc2 to c22c64812243 (2 revisions) (flutter/flutter#121041)

Add InheritedTheme support to ScrollbarTheme

8661233

flutter-dashboard bot added f: material design flutter/packages/flutter/material repository. f: scrolling Viewports, list views, slivers, etc. framework flutter/packages/flutter repository. See also f: labels. labels Feb 17, 2023

TahaTesser requested review from Piinks and gspencergoog February 17, 2023 13:05

Piinks approved these changes Feb 17, 2023

View reviewed changes

Piinks added the autosubmit Merge PR when tree becomes green via auto submit App label Feb 17, 2023

auto-submit bot merged commit c3587c6 into flutter:master Feb 17, 2023

TahaTesser deleted the scrollbar_theme_inherited_theme branch February 17, 2023 20:21

This was referenced Feb 18, 2023

Roll Flutter from 170539f83dc8 to 0be7c3f30d64 (38 revisions) flutter/packages#3225

Merged

Roll Flutter from 298d8c76ba78 to 0be7c3f30d64 (21 revisions) flutter/plugins#7193

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 18, 2023

c3587c6 Add InheritedTheme support to ScrollbarTheme (flutter/flu…

fe236d5

…tter#120970)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 18, 2023

c3587c62e Add InheritedTheme support to ScrollbarTheme (flutter/f…

a8d45ca

…lutter#120970)

engine-flutter-autoroll mentioned this pull request Feb 18, 2023

Roll Flutter from 298d8c76ba78 to 0be7c3f30d64 (21 revisions) flutter/plugins#7194

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 18, 2023

c3587c62e Add InheritedTheme support to ScrollbarTheme (flutter/f…

80d4d4a

…lutter#120970)

HansMuller mentioned this pull request Mar 2, 2023

Flutter Framework Team: Notable Commits #121415

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 10, 2023

c3587c6 Add InheritedTheme support to ScrollbarTheme (flutter/flu…

70fcf81

…tter#120970)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 10, 2023

c3587c6 Add InheritedTheme support to ScrollbarTheme (flutter/flu…

78c358f

…tter#120970)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add `InheritedTheme` support to `ScrollbarTheme` #120970

Add `InheritedTheme` support to `ScrollbarTheme` #120970

Uh oh!

TahaTesser commented Feb 17, 2023 •

edited

Loading

Uh oh!

Piinks left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Add InheritedTheme support to ScrollbarTheme #120970

Add InheritedTheme support to ScrollbarTheme #120970

Uh oh!

Conversation

TahaTesser commented Feb 17, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Expected Results

Actual Results

Pre-launch Checklist

Uh oh!

Piinks left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Add `InheritedTheme` support to `ScrollbarTheme` #120970

Add `InheritedTheme` support to `ScrollbarTheme` #120970

TahaTesser commented Feb 17, 2023 •

edited

Loading