Improved View Switcher and other improvements (#47)

* Improve view switcher * `start` and `end` parameter are now List<Widget> in HeaderBar * Shrink drawer size to match libadwaita in scaffold Co-authored-by: jesusrp98 <[email protected]>
gtk-flutter · Jan 9, 2022 · 6971921 · 6971921
1 parent fd87c44
commit 6971921
Show file tree

Hide file tree

Showing 8 changed files with 191 additions and 162 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,19 +1,26 @@
 ## 1.0.0-rc.2
 
-- Add `AdwComboRow`, `AdwAvatar`
-- Improve Headerbar and Header Button
-- Update Sidebar theming to look more closer to libadwaita one
+**BREAKING**
+- `AdwHeaderBarMinimal` is now `AdwHeaderBar.minimal`
+- The `start` and `end` parameter of `AdwHeaderBar` are now `List<Widget>` instead of `Widget`
+- `AdwTextButton` is now `AdwButton.flat`
+- The `height` and `expanded` properties of ViewSwitcher are now deprecated
+
+**Other Changes**
+- Add `AdwComboRow`, `AdwAvatar`, `AdwButton`(`.pill`, `.circular`, `.flat`)
+- Improve Header Button
+- Update Sidebar Theming
+- Update View Switcher theming
 - Remove Scroll errors from example app by improving `AdwClamp`
-- Deprecate `AdwHeaderBarMinimal`, Now use `AdwHeaderBar.minimal`
 
 ## 1.0.0-rc.1
 
 - Added the following widgets:
-    - `AdwScaffold`
-    - `AdwTextField`
-    - `AdwTextButton`
-    - `AdwViewStack`
-    - `WindowResizeListener`
+  - `AdwScaffold`
+  - `AdwTextField`
+  - `AdwTextButton`
+  - `AdwViewStack`
+  - `WindowResizeListener`
 - Fix Window buttons null error
 - Update Example
 - Update `AdwActionRow` & `AdwStackSidebar`
@@ -27,8 +34,8 @@
 - Add `AdwPreferenceGroup` and `AdwActionRow` from libadwaita.
 - Add `AdwStackSidebar` which is basically `GtkStackSidebar`
 - `AdwHeaderBar` parameter's
-    - Replace leading with start
-    - Replace trailing with end
-    - Replace center with title
+  - Replace leading with start
+  - Replace trailing with end
+  - Replace center with title
 
 For older Changelog visit: https://pub.dev/packages/gtk/changelog
diff --git a/example/lib/flap/flap_home_page.dart b/example/lib/flap/flap_home_page.dart
@@ -52,21 +52,19 @@ class _FlapHomePageState extends State<FlapHomePage> {
         AdwHeaderBar.bitsdojo(
           appWindow: appWindow,
           windowDecor: windowDecor,
-          start: Row(
-            children: [
-              Builder(builder: (context) {
-                return AdwHeaderButton(
-                  icon: const Icon(Icons.view_sidebar, size: 15),
-                  isActive: _flapController.isOpen,
-                  onPressed: () => _flapController.toggle(),
-                );
-              }),
-              AdwHeaderButton(
-                icon: const Icon(Icons.nightlight_round, size: 15),
-                onPressed: changeTheme,
-              ),
-            ],
-          ),
+          start: [
+            Builder(builder: (context) {
+              return AdwHeaderButton(
+                icon: const Icon(Icons.view_sidebar, size: 15),
+                isActive: _flapController.isOpen,
+                onPressed: () => _flapController.toggle(),
+              );
+            }),
+            AdwHeaderButton(
+              icon: const Icon(Icons.nightlight_round, size: 15),
+              onPressed: changeTheme,
+            ),
+          ],
           title: const Text("AdwFlap Demo"),
         ),
         Expanded(

diff --git a/example/lib/home_page.dart b/example/lib/home_page.dart
@@ -57,47 +57,43 @@ class _MyHomePageState extends State<MyHomePage> {
         AdwHeaderBar.bitsdojo(
           appWindow: appWindow,
           windowDecor: windowDecor,
-          start: Row(
-            children: [
-              Builder(
-                builder: (context) {
-                  return AdwHeaderButton(
-                    icon: const Icon(Icons.view_sidebar, size: 15),
-                    isActive: _flapController.isOpen,
-                    onPressed: () {
-                      _flapController.toggle();
-                    },
-                  );
-                },
-              ),
-              AdwHeaderButton(
-                icon: const Icon(Icons.nightlight_round, size: 15),
-                onPressed: changeTheme,
-              ),
-            ],
-          ),
+          start: [
+            Builder(
+              builder: (context) {
+                return AdwHeaderButton(
+                  icon: const Icon(Icons.view_sidebar, size: 15),
+                  isActive: _flapController.isOpen,
+                  onPressed: () {
+                    _flapController.toggle();
+                  },
+                );
+              },
+            ),
+            AdwHeaderButton(
+              icon: const Icon(Icons.nightlight_round, size: 15),
+              onPressed: changeTheme,
+            ),
+          ],
           title: const Text("Libadwaita Demo"),
-          end: Row(
-            children: [
-              AdwPopupMenu(
-                body: Column(
-                  mainAxisSize: MainAxisSize.min,
-                  children: [
-                    ListTile(
-                      onTap: () {
-                        counter.value = 0;
-                        Navigator.of(context).pop();
-                      },
-                      title: const Text(
-                        'Reset Counter',
-                        style: TextStyle(fontSize: 15),
-                      ),
+          end: [
+            AdwPopupMenu(
+              body: Column(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  ListTile(
+                    onTap: () {
+                      counter.value = 0;
+                      Navigator.of(context).pop();
+                    },
+                    title: const Text(
+                      'Reset Counter',
+                      style: TextStyle(fontSize: 15),
                     ),
-                  ],
-                ),
+                  ),
+                ],
               ),
-            ],
-          ),
+            ),
+          ],
         ),
         Expanded(
           child: AdwScaffold(

diff --git a/example/pubspec.lock b/example/pubspec.lock
@@ -172,6 +172,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "0.12.11"
+  material_color_utilities:
+    dependency: transitive
+    description:
+      name: material_color_utilities
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.1.2"
   meta:
     dependency: transitive
     description:
@@ -302,7 +309,7 @@ packages:
       name: test_api
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "0.4.3"
+    version: "0.4.8"
   typed_data:
     dependency: transitive
     description:

diff --git a/lib/src/widgets/adw/header_bar.dart b/lib/src/widgets/adw/header_bar.dart
@@ -7,13 +7,13 @@ import 'package:libadwaita/libadwaita.dart';
 
 class AdwHeaderBar extends StatefulWidget {
   /// The leading widget for the headerbar
-  final Widget start;
+  final List<Widget> start;
 
   /// The center widget for the headerbar
   final Widget title;
 
   /// The trailing widget for the headerbar
-  final Widget end;
+  final List<Widget> end;
 
   final Widget? minimizeBtn;
 
@@ -49,9 +49,9 @@ class AdwHeaderBar extends StatefulWidget {
     dynamic themeType,
     this.onDoubleTap,
     this.onHeaderDrag,
-    this.start = const SizedBox(),
+    this.start = const [],
     this.title = const SizedBox(),
-    this.end = const SizedBox(),
+    this.end = const [],
     this.padding = const EdgeInsets.only(left: 3, right: 5),
     this.titlebarSpace = 4,
     this.height = 51,
@@ -85,9 +85,9 @@ class AdwHeaderBar extends StatefulWidget {
     Key? key,
     this.onDoubleTap,
     this.onHeaderDrag,
-    this.start = const SizedBox(),
+    this.start = const [],
     this.title = const SizedBox(),
-    this.end = const SizedBox(),
+    this.end = const [],
     this.padding = const EdgeInsets.only(left: 3, right: 5),
     this.titlebarSpace = 4,
     this.height = 51,
@@ -108,9 +108,9 @@ class AdwHeaderBar extends StatefulWidget {
 
     /// The appWindow object from bitsdojo_window package
     required appWindow,
-    this.start = const SizedBox(),
+    this.start = const [],
     this.title = const SizedBox(),
-    this.end = const SizedBox(),
+    this.end = const [],
     this.padding = const EdgeInsets.only(left: 3, right: 5),
     this.titlebarSpace = 4,
     this.height = 51,
@@ -141,9 +141,9 @@ class AdwHeaderBar extends StatefulWidget {
 
     /// The appWindow object from bitsdojo_window package
     required appWindow,
-    this.start = const SizedBox(),
+    this.start = const [],
     this.title = const SizedBox(),
-    this.end = const SizedBox(),
+    this.end = const [],
     this.padding = const EdgeInsets.only(left: 3, right: 5),
     this.titlebarSpace = 4,
     this.height = 51,
@@ -169,9 +169,9 @@ class AdwHeaderBar extends StatefulWidget {
 
     /// The Window.of(context) object from nativeshell package
     required window,
-    this.start = const SizedBox(),
+    this.start = const [],
     this.title = const SizedBox(),
-    this.end = const SizedBox(),
+    this.end = const [],
     this.padding = const EdgeInsets.only(left: 3, right: 5),
     this.titlebarSpace = 4,
     this.height = 51,
@@ -194,9 +194,9 @@ class AdwHeaderBar extends StatefulWidget {
 
     /// The Window.of(context) object from nativeshell package
     required window,
-    this.start = const SizedBox(),
+    this.start = const [],
     this.title = const SizedBox(),
-    this.end = const SizedBox(),
+    this.end = const [],
     this.padding = const EdgeInsets.only(left: 3, right: 5),
     this.titlebarSpace = 4,
     this.height = 51,
@@ -292,14 +292,22 @@ class _AdwHeaderBarState extends State<AdwHeaderBar> {
                                 SizedBox(width: widget.titlebarSpace),
                               for (var i in sep[0].split(','))
                                 if (windowButtons[i] != null) windowButtons[i]!,
-                              widget.start,
+                              ...widget.start.map(
+                                (e) => Padding(
+                                    padding: const EdgeInsets.only(right: 5),
+                                    child: e),
+                              ),
                             ],
                           ),
                           middle: widget.title,
                           trailing: Row(
                             mainAxisSize: MainAxisSize.min,
                             children: [
-                              widget.end,
+                              ...widget.end.map(
+                                (e) => Padding(
+                                    padding: const EdgeInsets.only(left: 5),
+                                    child: e),
+                              ),
                               if (hasWindowControls &&
                                   sep[1].split(',').isNotEmpty)
                                 SizedBox(width: widget.titlebarSpace),

diff --git a/lib/src/widgets/adw/new/scaffold.dart b/lib/src/widgets/adw/new/scaffold.dart
@@ -10,13 +10,17 @@ class AdwScaffold extends StatefulWidget {
   /// Remove this when ViewSwitcher becomes adaptive
   final Widget? bottomNavigationBar;
 
-  const AdwScaffold({
+  AdwScaffold({
     Key? key,
     required this.body,
     this.flapController,
-    this.drawer,
+    Widget? drawer,
     this.bottomNavigationBar,
-  }) : super(key: key);
+  })  :
+
+        /// Use less width to match libadwaita
+        drawer = drawer != null ? SizedBox(width: 200, child: drawer) : null,
+        super(key: key);
 
   @override
   _AdwScaffoldState createState() => _AdwScaffoldState();