More gallery improvements

example/.metadata

@@ -1,10 +1,30 @@
 # This file tracks properties of this Flutter project.
 # Used by Flutter tool to assess capabilities and perform upgrades etc.
 #
-# This file should be version controlled and should not be manually edited.
+# This file should be version controlled.
 
 version:
-  revision: 4d7946a68d26794349189cf21b3f68cc6fe61dcb
+  revision: 796c8ef79279f9c774545b3771238c3098dbefab
   channel: stable
 
 project_type: app
+
+# Tracks metadata for the flutter migrate command
+migration:
+  platforms:
+    - platform: root
+      create_revision: 796c8ef79279f9c774545b3771238c3098dbefab
+      base_revision: 796c8ef79279f9c774545b3771238c3098dbefab
+    - platform: macos
+      create_revision: 796c8ef79279f9c774545b3771238c3098dbefab
+      base_revision: 796c8ef79279f9c774545b3771238c3098dbefab
+
+  # User provided section
+
+  # List of Local paths (relative to this file) that should be
+  # ignored by the migrate tool.
+  #
+  # Files that are not part of the templates will be ignored by default.
+  unmanaged_files:
+    - 'lib/main.dart'
+    - 'ios/Runner.xcodeproj/project.pbxproj'

example/lib/pages/buttons_page.dart

@@ -1,6 +1,7 @@
+import 'package:example/widgets/widget_text_title1.dart';
+import 'package:example/widgets/widget_text_title2.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:google_fonts/google_fonts.dart';
 import 'package:macos_ui/macos_ui.dart';
 import 'package:provider/provider.dart';
 
@@ -813,57 +814,3 @@ const languages = [
   'Romanian',
   'Dutch'
 ];
-
-class WidgetTextTitle1 extends StatelessWidget {
-  const WidgetTextTitle1({super.key, required this.widgetName});
-
-  final String widgetName;
-
-  @override
-  Widget build(BuildContext context) {
-    return DecoratedBox(
-      decoration: BoxDecoration(
-        color: MacosColors.systemGrayColor.withOpacity(0.5),
-        borderRadius: BorderRadius.circular(4.0),
-      ),
-      child: Padding(
-        padding: const EdgeInsets.symmetric(
-          horizontal: 6.0,
-        ),
-        child: Text(
-          widgetName,
-          style: MacosTypography.of(context)
-              .title1
-              .copyWith(fontFamily: GoogleFonts.jetBrainsMono().fontFamily),
-        ),
-      ),
-    );
-  }
-}
-
-class WidgetTextTitle2 extends StatelessWidget {
-  const WidgetTextTitle2({super.key, required this.widgetName});
-
-  final String widgetName;
-
-  @override
-  Widget build(BuildContext context) {
-    return DecoratedBox(
-      decoration: BoxDecoration(
-        color: MacosColors.systemGrayColor.withOpacity(0.5),
-        borderRadius: BorderRadius.circular(4.0),
-      ),
-      child: Padding(
-        padding: const EdgeInsets.symmetric(
-          horizontal: 6.0,
-        ),
-        child: Text(
-          widgetName,
-          style: MacosTypography.of(context)
-              .title2
-              .copyWith(fontFamily: GoogleFonts.jetBrainsMono().fontFamily),
-        ),
-      ),
-    );
-  }
-}

example/lib/pages/fields_page.dart

@@ -1,4 +1,6 @@
+import 'package:example/widgets/widget_text_title1.dart';
 import 'package:flutter/cupertino.dart' hide OverlayVisibilityMode;
+import 'package:flutter/material.dart';
 import 'package:macos_ui/macos_ui.dart';
 
 class FieldsPage extends StatefulWidget {
@@ -43,7 +45,10 @@ class _FieldsPageState extends State<FieldsPage> {
             return SingleChildScrollView(
               padding: const EdgeInsets.all(20),
               child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
+                  const WidgetTextTitle1(widgetName: 'MacosTextField'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
                   const SizedBox(
                     width: 300.0,
                     child: MacosTextField(
@@ -95,6 +100,8 @@ class _FieldsPageState extends State<FieldsPage> {
                     ),
                   ),
                   const SizedBox(height: 20),
+                  const WidgetTextTitle1(widgetName: 'MacosSearchField'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
                   SizedBox(
                     width: 300.0,
                     child: MacosSearchField(
@@ -136,17 +143,6 @@ class _FieldsPageState extends State<FieldsPage> {
             );
           },
         ),
-        ResizablePane(
-          minSize: 180,
-          startSize: 200,
-          windowBreakpoint: 800,
-          resizableSide: ResizableSide.left,
-          builder: (_, __) {
-            return const Center(
-              child: Text('Resizable Pane'),
-            );
-          },
-        ),
       ],
     );
   }

example/lib/pages/indicators_page.dart

@@ -1,3 +1,4 @@
+import 'package:example/widgets/widget_text_title1.dart';
 import 'package:macos_ui/macos_ui.dart';
 // ignore: implementation_imports
 import 'package:macos_ui/src/library.dart';
@@ -48,47 +49,98 @@ class _IndicatorsPageState extends State<IndicatorsPage> {
             return SingleChildScrollView(
               padding: const EdgeInsets.all(20),
               child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
-                  CapacityIndicator(
-                    value: capacitorValue,
-                    onChanged: (v) => setState(() => capacitorValue = v),
-                    splits: 20,
-                    discrete: true,
+                  const WidgetTextTitle1(widgetName: 'CapacityIndicator'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
+                  Row(
+                    children: [
+                      const Text('Standard'),
+                      const SizedBox(width: 8),
+                      Expanded(
+                        child: CapacityIndicator(
+                          value: capacitorValue,
+                          onChanged: (v) => setState(() => capacitorValue = v),
+                        ),
+                      ),
+                    ],
                   ),
-                  const SizedBox(height: 20),
-                  CapacityIndicator(
-                    value: capacitorValue,
-                    onChanged: (v) => setState(() => capacitorValue = v),
+                  const SizedBox(height: 16),
+                  Row(
+                    children: [
+                      const Text('Discrete'),
+                      const SizedBox(width: 8),
+                      Expanded(
+                        child: CapacityIndicator(
+                          value: capacitorValue,
+                          onChanged: (v) => setState(() => capacitorValue = v),
+                          splits: 20,
+                          discrete: true,
+                        ),
+                      ),
+                    ],
                   ),
                   const SizedBox(height: 20),
-                  MacosSlider(
-                    value: sliderValue,
-                    onChanged: (v) => setState(() => sliderValue = v),
+                  const WidgetTextTitle1(widgetName: 'MacosSlider'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
+                  Row(
+                    children: [
+                      const Text('Standard'),
+                      const SizedBox(width: 8),
+                      Expanded(
+                        child: MacosSlider(
+                          value: sliderValue,
+                          onChanged: (v) => setState(() => sliderValue = v),
+                        ),
+                      ),
+                    ],
                   ),
-                  const SizedBox(height: 20),
-                  MacosSlider(
-                    value: sliderValue,
-                    discrete: true,
-                    onChanged: (v) => setState(() => sliderValue = v),
+                  const SizedBox(height: 16),
+                  Row(
+                    children: [
+                      const Text('Discrete'),
+                      const SizedBox(width: 8),
+                      Expanded(
+                        child: MacosSlider(
+                          value: sliderValue,
+                          discrete: true,
+                          onChanged: (v) => setState(() => sliderValue = v),
+                        ),
+                      ),
+                    ],
                   ),
                   const SizedBox(height: 20),
+                  const WidgetTextTitle1(widgetName: 'RatingIndicator'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
                   RatingIndicator(
                     value: ratingValue,
                     onChanged: (v) => setState(() => ratingValue = v),
                   ),
                   const SizedBox(height: 20),
-                  const ProgressCircle(),
+                  const WidgetTextTitle1(widgetName: 'ProgressCircle'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
+                  const Row(
+                    children: [
+                      Text('Indeterminate'),
+                      SizedBox(width: 8),
+                      ProgressCircle(),
+                    ],
+                  ),
+                  const Row(
+                    children: [
+                      Text('Determinate'),
+                      SizedBox(width: 8),
+                      ProgressCircle(value: 50),
+                    ],
+                  ),
                   const SizedBox(height: 20),
+                  const WidgetTextTitle1(widgetName: 'RelevanceIndicator'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
+                  const SizedBox(height: 8),
                   const RelevanceIndicator(
                     value: 25,
                     amount: 50,
                   ),
-                  const SizedBox(height: 20),
-                  const Label(
-                    icon: MacosIcon(CupertinoIcons.tag),
-                    text: SelectableText('A determinate progress circle: '),
-                    child: ProgressCircle(value: 50),
-                  ),
                 ],
               ),
             );

example/lib/pages/selectors_page.dart

@@ -1,4 +1,7 @@
+import 'package:example/widgets/widget_text_title1.dart';
+import 'package:example/widgets/widget_text_title2.dart';
 import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
 import 'package:macos_ui/macos_ui.dart';
 
 class SelectorsPage extends StatefulWidget {
@@ -44,20 +47,40 @@ class _SelectorsPageState extends State<SelectorsPage> {
               controller: scrollController,
               padding: const EdgeInsets.all(20),
               child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
+                  Text(
+                    'Date & Time Pickers',
+                    style: MacosTypography.of(context).title1,
+                  ),
+                  Divider(color: MacosTheme.of(context).dividerColor),
                   Row(
-                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                     crossAxisAlignment: CrossAxisAlignment.start,
                     children: [
-                      MacosDatePicker(
-                        onDateChanged: (date) => debugPrint('$date'),
+                      Column(
+                        children: [
+                          const WidgetTextTitle2(widgetName: 'MacosDatePicker'),
+                          const SizedBox(height: 12),
+                          MacosDatePicker(
+                            onDateChanged: (date) => debugPrint('$date'),
+                          ),
+                        ],
                       ),
-                      MacosTimePicker(
-                        onTimeChanged: (time) => debugPrint('$time'),
+                      const SizedBox(width: 50),
+                      Column(
+                        children: [
+                          const WidgetTextTitle2(widgetName: 'MacosTimePicker'),
+                          const SizedBox(height: 12),
+                          MacosTimePicker(
+                            onTimeChanged: (time) => debugPrint('$time'),
+                          ),
+                        ],
                       ),
                     ],
                   ),
-                  const SizedBox(height: 50),
+                  const SizedBox(height: 20),
+                  const WidgetTextTitle1(widgetName: 'MacosColorWell'),
+                  Divider(color: MacosTheme.of(context).dividerColor),
                   MacosColorWell(
                     onColorSelected: (color) => debugPrint('$color'),
                   ),

example/lib/widgets/widget_text_title1.dart

@@ -0,0 +1,30 @@
+import 'package:flutter/cupertino.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:macos_ui/macos_ui.dart';
+
+class WidgetTextTitle1 extends StatelessWidget {
+  const WidgetTextTitle1({super.key, required this.widgetName});
+
+  final String widgetName;
+
+  @override
+  Widget build(BuildContext context) {
+    return DecoratedBox(
+      decoration: BoxDecoration(
+        color: MacosColors.systemGrayColor.withOpacity(0.5),
+        borderRadius: BorderRadius.circular(4.0),
+      ),
+      child: Padding(
+        padding: const EdgeInsets.symmetric(
+          horizontal: 6.0,
+        ),
+        child: Text(
+          widgetName,
+          style: MacosTypography.of(context)
+              .title1
+              .copyWith(fontFamily: GoogleFonts.jetBrainsMono().fontFamily),
+        ),
+      ),
+    );
+  }
+}

example/lib/widgets/widget_text_title2.dart

@@ -0,0 +1,30 @@
+import 'package:flutter/cupertino.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:macos_ui/macos_ui.dart';
+
+class WidgetTextTitle2 extends StatelessWidget {
+  const WidgetTextTitle2({super.key, required this.widgetName});
+
+  final String widgetName;
+
+  @override
+  Widget build(BuildContext context) {
+    return DecoratedBox(
+      decoration: BoxDecoration(
+        color: MacosColors.systemGrayColor.withOpacity(0.5),
+        borderRadius: BorderRadius.circular(4.0),
+      ),
+      child: Padding(
+        padding: const EdgeInsets.symmetric(
+          horizontal: 6.0,
+        ),
+        child: Text(
+          widgetName,
+          style: MacosTypography.of(context)
+              .title2
+              .copyWith(fontFamily: GoogleFonts.jetBrainsMono().fontFamily),
+        ),
+      ),
+    );
+  }
+}