Fix MacosPulldownButton menu panel appearance to better match MacOS 15.x

macosui · Mar 1, 2025 · b828655 · b828655
1 parent 4da96e4
commit b828655
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 12 deletions.
diff --git a/lib/src/buttons/pulldown_button.dart b/lib/src/buttons/pulldown_button.dart
@@ -201,8 +201,15 @@ class _MacosPulldownMenuState extends State<_MacosPulldownMenu> {
         child: IntrinsicWidth(
           child: MacosOverlayFilter(
             color: MacosPulldownButtonTheme.of(context)
-                .pulldownColor
-                ?.withValues(alpha: 0.25),
+              .pulldownColor
+              // BP CHANGE
+              // REPLACE
+              // ?.withValues(alpha: 0.25),            
+              // WITH
+              ?.withValues(alpha: 0.85),
+              // REASON: lightening default dark color at MacosThemeData.pulldownColor init 
+              // makes lightening here via super-low alpha unnecessary, thereby eliminating
+              // the non-macOS-15.x severe transparency effect.
             borderRadius: _kBorderRadius,
             child: Padding(
               padding: const EdgeInsets.all(6.0),

diff --git a/lib/src/layout/toolbar/toolbar_overflow_menu.dart b/lib/src/layout/toolbar/toolbar_overflow_menu.dart
@@ -27,7 +27,14 @@ class ToolbarOverflowMenu extends StatelessWidget {
         child: MacosOverlayFilter(
           color: MacosPulldownButtonTheme.of(context)
               .pulldownColor
-              ?.withValues(alpha: 0.25),
+              // BP CHANGE THIS
+              // REPLACE
+              // ?.withValues(alpha: 0.25),            
+              // WITH
+              ?.withValues(alpha: 0.85),
+              // REASON: lightening default dark color at MacosThemeData.pulldownColor init 
+              // makes lightening here via super-low alpha unnecessary, thereby eliminating
+              // the non-macOS-15.x severe transparency effect.
           borderRadius: _kBorderRadius,
           child: Padding(
             padding: const EdgeInsets.all(6.0),

diff --git a/lib/src/theme/macos_colors.dart b/lib/src/theme/macos_colors.dart
@@ -376,6 +376,16 @@ class MacosColors {
     darkColor: Color.fromRGBO(255, 255, 255, 0.1),
   );
 
+  // BP CHANGE
+  // ADD
+  // Text color for pulldown menus (e.g. ToolBarPullDownButton)
+  // (these colors derived from light/dark toolbar pulldown menus in Apple Pages app)
+  static const pulldownMenuTextColor = CupertinoDynamicColor.withBrightness(
+    color: Color.fromRGBO(37, 37, 37, 1.0),
+    darkColor: Color.fromRGBO(229, 229, 229, 1.0),
+  );
+  // END
+
   /// The accent color selected by the user in system preferences.
   ///
   /// No dark variant.

diff --git a/lib/src/theme/macos_theme.dart b/lib/src/theme/macos_theme.dart
@@ -304,8 +304,17 @@ class MacosThemeData extends Equatable with Diagnosticable {
           ? const Color.fromRGBO(255, 255, 255, 0.247)
           : const Color.fromRGBO(255, 255, 255, 1),
       pulldownColor: isDark
-          ? const Color.fromRGBO(30, 30, 30, 1)
-          : const Color.fromRGBO(242, 242, 247, 1),
+          // BP CHANGE
+          // REPLACE
+          // ? const Color.fromRGBO(30, 30, 30, 1)
+          // : const Color.fromRGBO(242, 242, 247, 1),
+          // WITH
+          ? const Color.fromRGBO(80, 80, 80, 1)
+          : const Color.fromRGBO(235, 235, 235, 1),
+          // REASON: dark color is much too dark, and requires ligtening with a very-low
+          //   alpha value that gives the result a severely non-macOS-15.x transparency 
+          //   effect for pulldown menu panes.
+          //   Change requires darkening light color to match MacOS-15.x appearance.
       iconColor: isDark
           ? const Color.fromRGBO(255, 255, 255, 0.7)
           : const Color.fromRGBO(0, 0, 0, 0.7),

diff --git a/lib/src/theme/overlay_filter.dart b/lib/src/theme/overlay_filter.dart
@@ -51,7 +51,12 @@ class MacosOverlayFilter extends StatelessWidget {
                     CupertinoColors.systemGrey.color,
                     CupertinoColors.black,
                   )
-                  .withValues(alpha: 0.25),
+                  // BP CHANGE
+                  // REPLACE
+                  // .withValues(alpha: 0.25),
+                  // WITH
+                  .withValues(alpha: 0.15),
+                  // REASON: shadow density is excessive. Lighter is closer to mac OS.
               offset: const Offset(0, 4),
               spreadRadius: 4.0,
               blurRadius: 8.0,
@@ -67,13 +72,24 @@ class MacosOverlayFilter extends StatelessWidget {
         ),
         child: ClipRRect(
           borderRadius: borderRadius,
-          child: BackdropFilter(
-            filter: ImageFilter.blur(
-              sigmaX: 20.0,
-              sigmaY: 20.0,
-            ),
+
+          // BP CHANGE
+          // REPLACE
+          // child: BackdropFilter(
+          //   filter: ImageFilter.blur(
+          //     sigmaX: 20.0,
+          //     sigmaY: 20.0,
+          //   ),
+          //   child: child,
+          // ),
+          // WITH
             child: child,
-          ),
+          // REASON: this blur is insane, and nothing like actual mac appearance in 15.x 
+          // Is this a leftover from an earlier macos "glassy" appearance standard?
+          // The blur severely severely alters the pulldown menu panel appearance from 
+          // macOS 15.x appearance in Apple's apps (pages, etc).
+          // Does not belong if standard is "look like 15.x"
+
         ),
       ),
     );