diff --git a/core/lib/core.dart b/core/lib/core.dart index ec36fbcdf..155213921 100644 --- a/core/lib/core.dart +++ b/core/lib/core.dart @@ -93,6 +93,8 @@ export 'presentation/views/toast/toast_position.dart'; export 'presentation/views/toast/tmail_toast.dart'; export 'presentation/views/bottom_popup/full_screen_action_sheet_builder.dart'; export 'presentation/views/checkbox/labeled_checkbox.dart'; +export 'presentation/views/checkbox/default_labeled_checkbox.dart'; +export 'presentation/views/checkbox/custom_icon_labeled_checkbox.dart'; export 'presentation/views/container/tmail_container_widget.dart'; export 'presentation/views/clipper/side_arrow_clipper.dart'; export 'presentation/views/avatar/gradient_circle_avatar_icon.dart'; diff --git a/core/lib/presentation/utils/theme_utils.dart b/core/lib/presentation/utils/theme_utils.dart index 25cf93c0d..fa5c27f93 100644 --- a/core/lib/presentation/utils/theme_utils.dart +++ b/core/lib/presentation/utils/theme_utils.dart @@ -261,6 +261,15 @@ class ThemeUtils { color: AppColor.textPrimary, ); + static const TextStyle textStyleM3BodyMedium3 = TextStyle( + fontFamily: ConstantsUI.fontApp, + fontWeight: FontWeight.w400, + letterSpacing: 0.25, + fontSize: 14, + height: 20 / 14, + color: AppColor.m3SurfaceBackground, + ); + static TextStyle textStyleAppShortcut() => const TextStyle( fontFamily: ConstantsUI.fontApp, fontWeight: FontWeight.normal, diff --git a/core/lib/presentation/views/checkbox/custom_icon_labeled_checkbox.dart b/core/lib/presentation/views/checkbox/custom_icon_labeled_checkbox.dart new file mode 100644 index 000000000..35eb98ca6 --- /dev/null +++ b/core/lib/presentation/views/checkbox/custom_icon_labeled_checkbox.dart @@ -0,0 +1,44 @@ +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/views/checkbox/labeled_checkbox.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; + +class CustomIconLabeledCheckbox extends LabeledCheckbox { + + final String svgIconPath; + final String selectedSvgIconPath; + final FocusNode focusNode; + + const CustomIconLabeledCheckbox({ + super.key, + required super.label, + required super.onChanged, + required this.svgIconPath, + required this.selectedSvgIconPath, + required this.focusNode, + super.value, + super.gap = 16.0, + }); + + @override + Widget get buildCheckboxWidget => FocusableActionDetector( + focusNode: focusNode, + autofocus: false, + child: Material( + type: MaterialType.transparency, + child: InkWell( + canRequestFocus: true, + focusColor: AppColor.colorMailboxHovered, + borderRadius: const BorderRadius.all(Radius.circular(20)), + onTap: () => onChanged(!(value)), + child: SvgPicture.asset( + value ? selectedSvgIconPath : svgIconPath, + width: 20, + height: 20, + colorFilter: AppColor.primaryColor.asFilter(), + fit: BoxFit.fill, + ), + ), + ), + ); +} diff --git a/core/lib/presentation/views/checkbox/default_labeled_checkbox.dart b/core/lib/presentation/views/checkbox/default_labeled_checkbox.dart new file mode 100644 index 000000000..ada14c125 --- /dev/null +++ b/core/lib/presentation/views/checkbox/default_labeled_checkbox.dart @@ -0,0 +1,28 @@ +import 'package:core/presentation/views/checkbox/labeled_checkbox.dart'; +import 'package:flutter/material.dart'; + +class DefaultLabeledCheckbox extends LabeledCheckbox { + + final Color activeColor; + final FocusNode focusNode; + + const DefaultLabeledCheckbox({ + super.key, + required super.label, + required super.onChanged, + required this.activeColor, + required this.focusNode, + super.value, + super.gap, + super.textStyle, + }); + + @override + Widget get buildCheckboxWidget => Checkbox( + value: value, + activeColor: activeColor, + visualDensity: VisualDensity.compact, + focusNode: focusNode, + onChanged: onChanged, + ); +} diff --git a/core/lib/presentation/views/checkbox/labeled_checkbox.dart b/core/lib/presentation/views/checkbox/labeled_checkbox.dart index b2a511491..56df1b223 100644 --- a/core/lib/presentation/views/checkbox/labeled_checkbox.dart +++ b/core/lib/presentation/views/checkbox/labeled_checkbox.dart @@ -1,60 +1,49 @@ +import 'package:core/presentation/utils/theme_utils.dart'; import 'package:flutter/material.dart'; +typedef OnChangedAction = void Function(bool? value); + class LabeledCheckbox extends StatelessWidget { - const LabeledCheckbox({Key? key, + const LabeledCheckbox({ + Key? key, required this.label, - this.contentPadding, - this.value, - this.onChanged, - this.activeColor, - this.fontSize = 16, + required this.onChanged, + this.value = false, this.gap = 4.0, - this.bold = false, - this.focusNode, + this.textStyle, }) : super(key: key); final String label; - final EdgeInsets? contentPadding; - final bool? value; - final Function(bool?)? onChanged; - final Color? activeColor; - final double fontSize; + final bool value; + final OnChangedAction onChanged; final double gap; - final bool bold; - final FocusNode? focusNode; + final TextStyle? textStyle; @override Widget build(BuildContext context) { return InkWell( - onTap: () => onChanged?.call(!(value ?? false)), - child: Padding( - padding: contentPadding ?? const EdgeInsets.all(0), - child: Row( - mainAxisSize: MainAxisSize.min, - children: [ - Checkbox( - value: value, - activeColor: activeColor, - visualDensity: VisualDensity.compact, - focusNode: focusNode, - onChanged: onChanged, - ), - SizedBox( - width: gap, - ), - Flexible( - child: Text( - label, - style: TextStyle( - fontSize: fontSize, - fontWeight: bold ? FontWeight.bold : FontWeight.normal, - color: Colors.black - ), - ), - ), - ], - ), + onTap: () => onChanged(!(value)), + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + buildCheckboxWidget, + buildGapWidget, + buildLabelWidget, + ], ), ); } -} \ No newline at end of file + + Widget get buildCheckboxWidget => Checkbox( + value: value, + visualDensity: VisualDensity.compact, + onChanged: onChanged, + ); + + Widget get buildGapWidget => SizedBox(width: gap); + + Widget get buildLabelWidget => Text( + label, + style: textStyle ?? ThemeUtils.textStyleM3BodyMedium3, + ); +} diff --git a/lib/features/email_recovery/presentation/widgets/check_box_has_attachment_widget.dart b/lib/features/email_recovery/presentation/widgets/check_box_has_attachment_widget.dart index efbc919b1..a730eb433 100644 --- a/lib/features/email_recovery/presentation/widgets/check_box_has_attachment_widget.dart +++ b/lib/features/email_recovery/presentation/widgets/check_box_has_attachment_widget.dart @@ -1,5 +1,5 @@ import 'package:core/presentation/extensions/color_extension.dart'; -import 'package:core/presentation/views/checkbox/labeled_checkbox.dart'; +import 'package:core/presentation/views/checkbox/default_labeled_checkbox.dart'; import 'package:flutter/material.dart'; import 'package:tmail_ui_user/features/base/isolate/background_isolate_binary_messenger/background_isolate_binary_messenger_mobile.dart'; import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; @@ -8,16 +8,16 @@ typedef OnChangedHasAttachment = void Function(bool? value); class CheckBoxHasAttachmentWidget extends StatelessWidget { final bool hasAttachmentValue; - final FocusNode? currentFocusNode; + final FocusNode currentFocusNode; final FocusNode? nextFocusNode; - final OnChangedHasAttachment? onChanged; + final OnChangedHasAttachment onChanged; const CheckBoxHasAttachmentWidget({ super.key, required this.hasAttachmentValue, - this.currentFocusNode, + required this.currentFocusNode, + required this.onChanged, this.nextFocusNode, - this.onChanged, }); @override @@ -29,10 +29,9 @@ class CheckBoxHasAttachmentWidget extends StatelessWidget { nextFocusNode?.requestFocus(); } }, - child: LabeledCheckbox( + child: DefaultLabeledCheckbox( label: AppLocalizations.of(context).hasAttachment, focusNode: currentFocusNode, - contentPadding: EdgeInsets.zero, value: hasAttachmentValue, activeColor: AppColor.primaryColor, onChanged: onChanged, diff --git a/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart b/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart index 28a2373bc..8be60fbbc 100644 --- a/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart +++ b/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart @@ -1,7 +1,7 @@ import 'package:core/presentation/extensions/color_extension.dart'; import 'package:core/presentation/utils/responsive_utils.dart'; import 'package:core/presentation/views/button/icon_button_web.dart'; -import 'package:core/presentation/views/checkbox/labeled_checkbox.dart'; +import 'package:core/presentation/views/checkbox/custom_icon_labeled_checkbox.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:get/get.dart'; @@ -24,12 +24,9 @@ class AdvancedSearchFilterFormBottomView extends GetWidget KeyboardListener( - focusNode: FocusNode(), - onKeyEvent: (event) { - if (event is KeyDownEvent && - event.logicalKey == LogicalKeyboardKey.tab) { - nextFocusNode?.requestFocus(); - } - }, - child: LabeledCheckbox( - label: AppLocalizations.of(context).hasAttachment, - focusNode: currentFocusNode, - contentPadding: EdgeInsets.zero, - value: controller.hasAttachment.value, - activeColor: AppColor.primaryColor, - onChanged: controller.onHasAttachmentCheckboxChanged, - ), + () => CustomIconLabeledCheckbox( + label: AppLocalizations.of(context).hasAttachment, + svgIconPath: controller.imagePaths.icCheckboxUnselected, + selectedSvgIconPath: controller.imagePaths.icCheckboxSelected, + focusNode: currentFocusNode, + value: controller.hasAttachment.value, + onChanged: controller.onHasAttachmentCheckboxChanged, ), ); }