Scrollbar overhaul & more

.github/workflows/dart_code_metrics.yaml

@@ -9,7 +9,7 @@ jobs:
       - uses: actions/checkout@v3
 
       - name: Run Dart Code Metrics
-        uses: dart-code-checker/dart-code-metrics-action@v2
+        uses: dart-code-checker/dart-code-metrics-action@v3
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}
           pull_request_comment: true

CHANGELOG.md

@@ -1,5 +1,14 @@
 ## [1.10.0]
+🚨 Breaking Changes 🚨
+* `MacosScrollbar` has been completely overhauled and now resembles the native macOS scrollbar in appearance and
+  behavior. Previously, it wrapped the material scrollbar, and now creates a custom scrollbar that extends
+  `RawScrollbar`. This resulted in the removal of several material-based properties for the scrollbar, and
+  `ContentArea.builder` is once again a `ScrollableWidgetBuilder`! 🎉
+* Removed material-based scrollbar properties from `MacosScrollbarThemeData`
+
+Other changes:
 * Added implementation of `MacosDisclosureButton`
+* Fixed a bug where `CapacityIndicator` only worked correctly for splits = 10
 
 ## [1.9.1]
 * Adds optional `initialDate` to `MacosDatePicker`
@@ -10,19 +19,16 @@
 ## [1.8.0]
 🚨 Breaking Changes 🚨
 * `ContentArea.builder` has been changed from a `ScrollableWidgetBuilder` to a `WidgetBuilder` due to
-changes in Flutter 3.7. The `MacosScrollBar` widget needs to undergo radical changes in order to achieve the
+changes in Flutter 3.7. The `MacosScrollbar` widget needs to undergo radical changes in order to achieve the
 native macOS scrollbar look and feel in the future, so this will be revisited at that time.
 
-Other changes
+Other changes:
 * Per Flutter 3.7.0: Replace deprecated `MacosTextField.toolbarOptions` with `MacosTextField.contextMenuBuilder`
 * Ensure the color panel releases when it is closed
 * Avoid render overflows in the `Sidebar` when the window height is resized below a certain threshold ([#325](https://github.com/GroovinChip/macos_ui/issues/325))
-* Update `MacosScrollBar.thumbVisibility` with the latest change introduced in Flutter 3.7
+* Update `MacosScrollbar.thumbVisibility` with the latest change introduced in Flutter 3.7
 * Update `README.md` to address issues [#325](https://github.com/GroovinChip/macos_ui/issues/325) & [#332](https://github.com/GroovinChip/macos_ui/issues/332)
 
-* Fixed a bug where `CapacityIndicator` only worked correctly for splits = 10
-
-
 ## [1.7.6]
 * Fixed a bug where `MacosPopupButton` would report that a `ScrollController` was not attached to any views
 
@@ -244,7 +250,7 @@ leading widget, and the font size of the item's label widget according to the gi
 * Added `==` and `hashCode` to various classes
 
 ## [0.7.1]
-* Add generics support to `MacosRadioButton` - Thank you [Sacha Arbonel](https://github.com/sachaarbonel)!
+* Add generics support to `MacosRadioButton` - Thank you, [Sacha Arbonel](https://github.com/sachaarbonel)!
 
 ## [0.7.0+2]
 * Add note in docs that a `Builder` is required for manual sidebar toggling to work.
@@ -301,7 +307,7 @@ leading widget, and the font size of the item's label widget according to the gi
   * `Switch` -> `MacosSwitch`
 
 ## [0.2.4]
-* Fix textfield prefix icon alignment
+* Fix text field prefix icon alignment
 
 ## [0.2.3]
 * Add `canvasColor` to `MacosThemeData`. `Scaffold` now uses this as its default background color.
@@ -333,7 +339,7 @@ leading widget, and the font size of the item's label widget according to the gi
 * Updated the theme api
   * Properties in `MacosThemeData` and in `Typography` can't be null
   * Renamed `DynamicColorX` to `MacosDynamicColor`
-  * Added the method `lerp` on all theme datas.
+  * Added the method `lerp` on all theme data classes.
 
 ## [0.1.1]
 * Implemented `Label` ([#61](https://github.com/GroovinChip/macos_ui/issues/61))

README.md

@@ -9,7 +9,7 @@ Guides, codelabs, and other documentation can be found at https://macosui.dev
 [![pub package](https://img.shields.io/pub/v/macos_ui.svg)](https://pub.dev/packages/macos_ui)
 [![pub package](https://img.shields.io/pub/publisher/macos_ui.svg)](https://pub.dev/packages/macos_ui)  
 
-[![Flutter Analysis](https://github.com/GroovinChip/macos_ui/actions/workflows/flutter_analysis.yml/badge.svg)](https://github.com/GroovinChip/macos_ui/actions/workflows/flutter_analysis.yml)
+[![Flutter Analysis](https://github.com/GroovinChip/macos_ui/actions/workflows/flutter_analysis.yml/badge.svg?branch=stable)](https://github.com/GroovinChip/macos_ui/actions/workflows/flutter_analysis.yml)
 [![Pana Analysis](https://github.com/GroovinChip/macos_ui/actions/workflows/pana_analysis.yml/badge.svg)](https://github.com/GroovinChip/macos_ui/actions/workflows/pana_analysis.yml)
 [![codecov](https://github.com/GroovinChip/macos_ui/actions/workflows/codecov.yaml/badge.svg)](https://github.com/GroovinChip/macos_ui/actions/workflows/codecov.yaml)
 [![codecov](https://codecov.io/gh/GroovinChip/macos_ui/branch/dev/graph/badge.svg?token=1SZGEVVMCH)](https://codecov.io/gh/GroovinChip/macos_ui)

analysis_options.yaml

@@ -8,7 +8,8 @@ analyzer:
   plugins:
     - dart_code_metrics
   exclude:
-    - starter_app/**
+    - test/mock_canvas.dart
+    - test/recording_canvas.dart
 
 dart_code_metrics:
   metrics:
@@ -25,3 +26,12 @@ dart_code_metrics:
         order:
           - constructors
           - public_fields
+          - private-fields
+        widgets-order:
+          - const fields
+          - init-state-method
+          - did-change-dependencies-method
+          - did-update-widget-method
+          - private-methods
+          - dispose-method
+          - build-method

example/lib/main.dart

@@ -171,11 +171,11 @@ class _WidgetGalleryState extends State<WidgetGallery> {
             ],
           ),
           minWidth: 200,
-          builder: (context, _) {
+          builder: (context, scrollController) {
             return SidebarItems(
               currentIndex: pageIndex,
               onChanged: (i) => setState(() => pageIndex = i),
-              scrollController: ScrollController(),
+              scrollController: scrollController,
               itemSize: SidebarItemSize.large,
               items: [
                 const SidebarItem(

example/lib/pages/buttons_page.dart

@@ -71,9 +71,9 @@ class _ButtonsPageState extends State<ButtonsPage> {
           },
         ),
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return SingleChildScrollView(
-              // controller: _,
+              controller: scrollController,
               padding: const EdgeInsets.all(20),
               child: Column(
                 children: [
@@ -168,7 +168,7 @@ class _ButtonsPageState extends State<ButtonsPage> {
                                   ),
                                   children: [
                                     ContentArea(
-                                      builder: (context) {
+                                      builder: (context, _) {
                                         return Center(
                                           child: PushButton(
                                             buttonSize: ButtonSize.large,

example/lib/pages/colors_page.dart

@@ -28,7 +28,7 @@ class _ColorsPageState extends State<ColorsPage> {
       ),
       children: [
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return SingleChildScrollView(
               padding: const EdgeInsets.all(20),
               child: Column(

example/lib/pages/dialogs_page.dart

@@ -29,7 +29,7 @@ class _DialogsPageState extends State<DialogsPage> {
       ),
       children: [
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return SingleChildScrollView(
               padding: const EdgeInsets.all(20),
               child: Center(

example/lib/pages/fields_page.dart

@@ -28,7 +28,7 @@ class _FieldsPageState extends State<FieldsPage> {
       ),
       children: [
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return SingleChildScrollView(
               padding: const EdgeInsets.all(20),
               child: Column(

example/lib/pages/indicators_page.dart

@@ -33,7 +33,7 @@ class _IndicatorsPageState extends State<IndicatorsPage> {
       ),
       children: [
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return SingleChildScrollView(
               padding: const EdgeInsets.all(20),
               child: Column(

example/lib/pages/selectors_page.dart

@@ -28,9 +28,8 @@ class _SelectorsPageState extends State<SelectorsPage> {
       ),
       children: [
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return SingleChildScrollView(
-              // controller: scrollController,
               padding: const EdgeInsets.all(20),
               child: Column(
                 children: [

example/lib/pages/tabview_page.dart

@@ -22,7 +22,7 @@ class _TabViewPageState extends State<TabViewPage> {
       ),
       children: [
         ContentArea(
-          builder: (context) {
+          builder: (context, scrollController) {
             return Padding(
               padding: const EdgeInsets.all(24.0),
               child: MacosTabView(

example/lib/pages/toolbar_page.dart

@@ -156,26 +156,28 @@ class _ToolbarPageState extends State<ToolbarPage> {
         ],
       ),
       children: [
-        ContentArea(builder: (context) {
-          return SingleChildScrollView(
-            padding: const EdgeInsets.all(30),
-            child: Center(
-              child: Column(
-                children: const [
-                  Text(
-                    "The toolbar appears below the title bar of the macOS app or integrates with it.",
-                    textAlign: TextAlign.center,
-                  ),
-                  SizedBox(height: 20.0),
-                  Text(
-                    "It provides convenient access to frequently used commands and features.",
-                    textAlign: TextAlign.center,
-                  ),
-                ],
+        ContentArea(
+          builder: (context, scrollController) {
+            return SingleChildScrollView(
+              padding: const EdgeInsets.all(30),
+              child: Center(
+                child: Column(
+                  children: const [
+                    Text(
+                      "The toolbar appears below the title bar of the macOS app or integrates with it.",
+                      textAlign: TextAlign.center,
+                    ),
+                    SizedBox(height: 20.0),
+                    Text(
+                      "It provides convenient access to frequently used commands and features.",
+                      textAlign: TextAlign.center,
+                    ),
+                  ],
+                ),
               ),
-            ),
-          );
-        }),
+            );
+          },
+        ),
       ],
     );
   }

lib/macos_ui.dart

@@ -37,7 +37,7 @@ export 'src/indicators/capacity_indicators.dart';
 export 'src/indicators/progress_indicators.dart';
 export 'src/indicators/rating_indicator.dart';
 export 'src/indicators/relevance_indicator.dart';
-export 'src/indicators/scrollbar.dart';
+export 'src/layout/scrollbar.dart';
 export 'src/indicators/slider.dart';
 export 'src/labels/label.dart';
 export 'src/labels/tooltip.dart';

lib/src/buttons/back_button.dart

@@ -88,12 +88,6 @@ class MacosBackButtonState extends State<MacosBackButton>
     _opacityTween.end = 1.0;
   }
 
-  @override
-  void dispose() {
-    _animationController.dispose();
-    super.dispose();
-  }
-
   @visibleForTesting
   bool buttonHeldDown = false;
 
@@ -129,6 +123,12 @@ class MacosBackButtonState extends State<MacosBackButton>
     });
   }
 
+  @override
+  void dispose() {
+    _animationController.dispose();
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     final bool enabled = widget.enabled;

lib/src/buttons/disclosure_button.dart

@@ -88,12 +88,6 @@ class MacosDisclosureButtonState extends State<MacosDisclosureButton>
     _opacityTween.end = 1.0;
   }
 
-  @override
-  void dispose() {
-    _animationController.dispose();
-    super.dispose();
-  }
-
   @visibleForTesting
   bool buttonHeldDown = false;
 
@@ -129,6 +123,12 @@ class MacosDisclosureButtonState extends State<MacosDisclosureButton>
     });
   }
 
+  @override
+  void dispose() {
+    _animationController.dispose();
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     final bool enabled = widget.enabled;

lib/src/buttons/help_button.dart

@@ -114,12 +114,6 @@ class HelpButtonState extends State<HelpButton>
     _opacityTween.end = widget.pressedOpacity ?? 1.0;
   }
 
-  @override
-  void dispose() {
-    _animationController.dispose();
-    super.dispose();
-  }
-
   @visibleForTesting
   bool buttonHeldDown = false;
 
@@ -155,6 +149,12 @@ class HelpButtonState extends State<HelpButton>
     });
   }
 
+  @override
+  void dispose() {
+    _animationController.dispose();
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     final bool enabled = widget.enabled;

lib/src/buttons/icon_button.dart

@@ -161,12 +161,6 @@ class MacosIconButtonState extends State<MacosIconButton>
     _opacityTween.end = widget.pressedOpacity ?? 1.0;
   }
 
-  @override
-  void dispose() {
-    _animationController.dispose();
-    super.dispose();
-  }
-
   @visibleForTesting
   bool buttonHeldDown = false;
 
@@ -202,6 +196,12 @@ class MacosIconButtonState extends State<MacosIconButton>
     });
   }
 
+  @override
+  void dispose() {
+    _animationController.dispose();
+    super.dispose();
+  }
+
   @override
   Widget build(BuildContext context) {
     final bool enabled = widget.enabled;