Change FAB Color and shape (#323)

* Change FAB Color and shape Fixes #294 Fixes #282 * Example: fix onPressed
ubuntu · Mar 15, 2023 · c1377fd · c1377fd
1 parent be03ce8
commit c1377fd
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 9 deletions.
diff --git a/example/lib/view/controls_view.dart b/example/lib/view/controls_view.dart
@@ -179,10 +179,24 @@ class _ControlsViewState extends State<ControlsView>
                     ),
                     Padding(
                       padding: const EdgeInsets.all(8.0),
-                      child: Row(
+                      child: Wrap(
+                        spacing: 10,
+                        runSpacing: 10,
                         children: [
                           FloatingActionButton(
-                            onPressed: () => {incrementCounter()},
+                            onPressed: incrementCounter,
+                            child: const Icon(Icons.plus_one),
+                          ),
+                          FloatingActionButton.extended(
+                            onPressed: incrementCounter,
+                            label: const Text('Yay! +1 ❤️ for Yaru'),
+                          ),
+                          FloatingActionButton.small(
+                            onPressed: incrementCounter,
+                            child: const Icon(Icons.plus_one),
+                          ),
+                          FloatingActionButton.large(
+                            onPressed: incrementCounter,
                             child: const Icon(Icons.plus_one),
                           ),
                         ],

diff --git a/lib/src/themes/common_themes.dart b/lib/src/themes/common_themes.dart
@@ -329,15 +329,17 @@ ProgressIndicatorThemeData _createProgressIndicatorTheme(
 }
 
 FloatingActionButtonThemeData _getFloatingActionButtonThemeData(
-  ColorScheme colorScheme,
-) {
+  ColorScheme colorScheme, [
+  Color? buttonColor,
+]) {
   const elevation = 3.0;
+  final bg = buttonColor ?? colorScheme.primary;
 
   return FloatingActionButtonThemeData(
-    backgroundColor: colorScheme.surface
-        .scale(lightness: colorScheme.isLight ? -0.10 : 0.20),
-    foregroundColor: colorScheme.onSurface,
-    shape: CircleBorder(
+    backgroundColor: bg,
+    foregroundColor: contrastColor(bg),
+    shape: RoundedRectangleBorder(
+      borderRadius: BorderRadius.circular(30),
       side: colorScheme.isHighContrast
           ? BorderSide(color: colorScheme.outlineVariant)
           : BorderSide.none,
@@ -404,7 +406,8 @@ ThemeData createYaruTheme({
     radioTheme: _getRadioThemeData(colorScheme),
     primaryColorDark: colorScheme.isDark ? colorScheme.primary : null,
     appBarTheme: _createAppBarTheme(colorScheme),
-    floatingActionButtonTheme: _getFloatingActionButtonThemeData(colorScheme),
+    floatingActionButtonTheme:
+        _getFloatingActionButtonThemeData(colorScheme, elevatedButtonColor),
     bottomNavigationBarTheme: BottomNavigationBarThemeData(
       selectedItemColor: colorScheme.primary,
       unselectedItemColor: colorScheme.onSurface.withOpacity(0.8),