Skip to content

PopupMenuButton wrapped with a local ScrollbarTheme doesn't update the scrollbar in the popup menu.  #120964

@TahaTesser

Description

@TahaTesser

Similar to #120869

In this code samplePopupMenuButton is wrapped with a local ScrollbarTheme which specifies green thumb color and a global ScrollbarTheme which specifies red thumb color.

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: PopupMenuButton<SampleItem>(
            child: const Text('Show PopupMenu'),
            onSelected: (SampleItem item) {},
            itemBuilder: (BuildContext context) => <PopupMenuEntry<SampleItem>>[
              for (int i = 0; i < 10; i++)
                PopupMenuItem<SampleItem>(
                  value: SampleItem.itemOne,
                  child: Text('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),
                ),
              ],
            ),
          ),
        ],
      )),
    );
  }
}

Expected Results

Screenshot 2023-02-17 at 11 51 39

Actual Results

Screenshot 2023-02-17 at 11 51 15

flutter doctor -v
[✓] Flutter (Channel master, 3.8.0-13.0.pre.74, on macOS 13.2.1 22D68 darwin-arm64, locale en-EE)
    • Flutter version 3.8.0-13.0.pre.74 on channel master at /Users/tahatesser/Code/flutter
    • Upstream repository git@github.com:NevercodeHQ/flutter.git
    • FLUTTER_GIT_URL = git@github.com:NevercodeHQ/flutter.git
    • Framework revision 298d8c76ba (4 hours ago), 2023-02-16 21:28:30 -0800Engine revision 6e92c0c284
    • Dart version 3.0.0 (build 3.0.0-245.0.dev)
    • DevTools version 2.21.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
    • Android SDK at /Users/tahatesser/Code/android-sdk
    • Platform android-33, build-tools 33.0.1ANDROID_SDK_ROOT = /Users/tahatesser/Code/android-sdk
    • Java binary at: /Users/tahatesser/Code/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment Temurin-16.0.2+7 (build 16.0.2+7)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
    • Xcode at /Applications/Xcode.app/Contents/DeveloperBuild 14C18
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[!] Android StudioAndroid Studio at /Applications/Android Studio Preview.app/ContentsFlutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutterDart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dartUnable to find bundled Java version.
    • Try updating or re-installing Android Studio.

[✓] VS Code (version 1.75.1)
    • VS Code at /Applications/Visual Studio Code.app/ContentsFlutter extension version 3.58.0

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 13.2.1 22D68 darwin-arm64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 110.0.5481.100

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

Metadata

Metadata

Assignees

Labels

f: material designflutter/packages/flutter/material repository.found in release: 3.7Found to occur in 3.7found in release: 3.8Found to occur in 3.8frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work on

Type

No type

Projects

Status

Done (PR merged)

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions