From 4c5c29c947c79774dde96eb6ab79c744fdc47843 Mon Sep 17 00:00:00 2001 From: jasmeet0817 Date: Sun, 23 Jan 2022 22:35:03 +0100 Subject: [PATCH] refactor:Smooth buttons a bit (#998) * refactor:Smooth buttons * Format: * Format: * Format: * Format: * Format: Co-authored-by: Jasmeet Singh --- .../smooth_product_card_not_found.dart | 21 ++------ .../pages/product/add_new_product_page.dart | 19 ++----- .../lib/buttons/smooth_action_button.dart | 20 +++---- .../smooth_large_button_with_icon.dart | 53 +++++++++++++++++++ .../lib/buttons/smooth_simple_button.dart | 24 ++------- 5 files changed, 71 insertions(+), 66 deletions(-) create mode 100644 packages/smooth_ui_library/lib/buttons/smooth_large_button_with_icon.dart diff --git a/packages/smooth_app/lib/cards/product_cards/smooth_product_card_not_found.dart b/packages/smooth_app/lib/cards/product_cards/smooth_product_card_not_found.dart index 039111a69a6..98c47da4687 100644 --- a/packages/smooth_app/lib/cards/product_cards/smooth_product_card_not_found.dart +++ b/packages/smooth_app/lib/cards/product_cards/smooth_product_card_not_found.dart @@ -3,7 +3,7 @@ import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:provider/provider.dart'; import 'package:smooth_app/pages/product/add_new_product_page.dart'; import 'package:smooth_app/themes/theme_provider.dart'; -import 'package:smooth_ui_library/buttons/smooth_simple_button.dart'; +import 'package:smooth_ui_library/buttons/smooth_large_button_with_icon.dart'; import 'package:smooth_ui_library/util/ui_helpers.dart'; class SmoothProductCardNotFound extends StatelessWidget { @@ -52,24 +52,11 @@ class SmoothProductCardNotFound extends StatelessWidget { ), Padding( padding: const EdgeInsets.only(top: LARGE_SPACE), - child: SmoothSimpleButton( + child: SmoothLargeButtonWithIcon( text: appLocalizations.add_product_information_button_label, - minWidth: double.infinity, - borderRadius: - const BorderRadius.all(Radius.circular(SMALL_SPACE)), + icon: Icons.add, padding: const EdgeInsets.symmetric(vertical: LARGE_SPACE), - buttonColor: themeProvider.darkTheme - ? Colors.grey - : const Color(0xffeaf5fb), - textColor: themeProvider.darkTheme - ? Theme.of(context).colorScheme.onPrimary - : Colors.blue, - icon: Icon( - Icons.add, - color: themeProvider.darkTheme - ? Theme.of(context).colorScheme.onPrimary - : Colors.blue, - ), + isDarkMode: themeProvider.darkTheme, onPressed: () { Navigator.push( context, diff --git a/packages/smooth_app/lib/pages/product/add_new_product_page.dart b/packages/smooth_app/lib/pages/product/add_new_product_page.dart index cf9e64a802d..3fe94d282cb 100644 --- a/packages/smooth_app/lib/pages/product/add_new_product_page.dart +++ b/packages/smooth_app/lib/pages/product/add_new_product_page.dart @@ -2,7 +2,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:provider/provider.dart'; import 'package:smooth_app/themes/theme_provider.dart'; -import 'package:smooth_ui_library/buttons/smooth_simple_button.dart'; +import 'package:smooth_ui_library/buttons/smooth_large_button_with_icon.dart'; import 'package:smooth_ui_library/util/ui_helpers.dart'; class AddNewProductPage extends StatelessWidget { @@ -52,21 +52,10 @@ class AddNewProductPage extends StatelessWidget { final ThemeProvider themeProvider = context.watch(); return Padding( padding: const EdgeInsets.only(top: VERY_LARGE_SPACE), - child: SmoothSimpleButton( + child: SmoothLargeButtonWithIcon( text: text, - minWidth: double.infinity, - borderRadius: const BorderRadius.all(Radius.circular(SMALL_SPACE)), - buttonColor: - themeProvider.darkTheme ? Colors.grey : const Color(0xffeaf5fb), - textColor: themeProvider.darkTheme - ? Theme.of(context).colorScheme.onPrimary - : Colors.blue, - icon: Icon( - Icons.camera_alt, - color: themeProvider.darkTheme - ? Theme.of(context).colorScheme.onPrimary - : Colors.blue, - ), + icon: Icons.camera_alt, + isDarkMode: themeProvider.darkTheme, onPressed: () { Navigator.push( context, diff --git a/packages/smooth_ui_library/lib/buttons/smooth_action_button.dart b/packages/smooth_ui_library/lib/buttons/smooth_action_button.dart index 27454282ce7..a783532d50b 100644 --- a/packages/smooth_ui_library/lib/buttons/smooth_action_button.dart +++ b/packages/smooth_ui_library/lib/buttons/smooth_action_button.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; +import 'package:smooth_ui_library/buttons/smooth_simple_button.dart'; class SmoothActionButton extends StatelessWidget { const SmoothActionButton({ @@ -16,22 +17,15 @@ class SmoothActionButton extends StatelessWidget { @override Widget build(BuildContext context) { final ThemeData themeData = Theme.of(context); - return MaterialButton( - color: themeData.colorScheme.primary, - child: Padding( - padding: const EdgeInsets.all(10), - child: Text( - text, - style: themeData.textTheme.bodyText2! - .copyWith(color: themeData.colorScheme.onPrimary), - ), + return SmoothSimpleButton( + child: Text( + text, + style: themeData.textTheme.bodyText2! + .copyWith(color: themeData.colorScheme.onPrimary), ), + onPressed: onPressed, height: height, minWidth: minWidth, - shape: const RoundedRectangleBorder( - borderRadius: BorderRadius.all(Radius.circular(15.0)), - ), - onPressed: () => onPressed(), ); } } diff --git a/packages/smooth_ui_library/lib/buttons/smooth_large_button_with_icon.dart b/packages/smooth_ui_library/lib/buttons/smooth_large_button_with_icon.dart new file mode 100644 index 00000000000..802249db29d --- /dev/null +++ b/packages/smooth_ui_library/lib/buttons/smooth_large_button_with_icon.dart @@ -0,0 +1,53 @@ +import 'package:flutter/material.dart'; +import 'package:smooth_ui_library/buttons/smooth_simple_button.dart'; +import 'package:smooth_ui_library/util/ui_helpers.dart'; + +class SmoothLargeButtonWithIcon extends StatelessWidget { + const SmoothLargeButtonWithIcon({ + required this.text, + required this.icon, + required this.onPressed, + required this.isDarkMode, + this.padding, + }); + + final String text; + final IconData icon; + final VoidCallback onPressed; + final bool isDarkMode; + final EdgeInsets? padding; + + @override + Widget build(BuildContext context) { + final ThemeData themeData = Theme.of(context); + return SmoothSimpleButton( + child: Row( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Icon( + icon, + color: isDarkMode + ? Theme.of(context).colorScheme.onPrimary + : Colors.blue, + ), + const Spacer(), + Text( + text, + textAlign: TextAlign.center, + style: themeData.textTheme.bodyText2!.copyWith( + color: isDarkMode + ? Theme.of(context).colorScheme.onPrimary + : Colors.blue, + ), + ), + const Spacer(), + ], + ), + minWidth: double.infinity, + borderRadius: const BorderRadius.all(Radius.circular(SMALL_SPACE)), + padding: padding ?? const EdgeInsets.all(10), + buttonColor: isDarkMode ? Colors.grey : const Color(0xffeaf5fb), + onPressed: onPressed, + ); + } +} diff --git a/packages/smooth_ui_library/lib/buttons/smooth_simple_button.dart b/packages/smooth_ui_library/lib/buttons/smooth_simple_button.dart index 2784b2c9823..91f763bce14 100644 --- a/packages/smooth_ui_library/lib/buttons/smooth_simple_button.dart +++ b/packages/smooth_ui_library/lib/buttons/smooth_simple_button.dart @@ -2,26 +2,22 @@ import 'package:flutter/material.dart'; class SmoothSimpleButton extends StatelessWidget { const SmoothSimpleButton({ - required this.text, + required this.child, required this.onPressed, this.minWidth = 15, this.height = 20, this.borderRadius = const BorderRadius.all(Radius.circular(15.0)), this.padding = const EdgeInsets.all(10), this.buttonColor, - this.textColor, - this.icon, }); - final String text; + final Widget child; final VoidCallback onPressed; final double minWidth; final double height; final BorderRadius borderRadius; final EdgeInsets padding; final Color? buttonColor; - final Color? textColor; - final Widget? icon; @override Widget build(BuildContext context) { @@ -30,21 +26,7 @@ class SmoothSimpleButton extends StatelessWidget { color: buttonColor ?? themeData.colorScheme.primary, child: Padding( padding: padding, - child: Row( - mainAxisAlignment: MainAxisAlignment.start, - children: [ - if (icon != null) icon!, - const Spacer(), - Text( - text, - textAlign: TextAlign.center, - style: themeData.textTheme.bodyText2!.copyWith( - color: textColor ?? themeData.colorScheme.onPrimary, - ), - ), - const Spacer(), - ], - ), + child: child, ), height: height, minWidth: minWidth,