TF-2975 Change the layout main screen in mobile app
This commit is contained in:
@@ -30,13 +30,13 @@ class SearchBarView extends StatelessWidget {
|
||||
onTap: onOpenSearchViewAction,
|
||||
mouseCursor: SystemMouseCursors.text,
|
||||
splashColor: Colors.transparent,
|
||||
borderRadius: const BorderRadius.all(Radius.circular(12)),
|
||||
borderRadius: const BorderRadius.all(Radius.circular(10)),
|
||||
child: Container(
|
||||
alignment: Alignment.center,
|
||||
height: 40,
|
||||
height: 44,
|
||||
width: double.infinity,
|
||||
decoration: const BoxDecoration(
|
||||
borderRadius: BorderRadius.all(Radius.circular(12)),
|
||||
borderRadius: BorderRadius.all(Radius.circular(10)),
|
||||
color: AppColor.colorBgSearchBar
|
||||
),
|
||||
child: Row(
|
||||
@@ -45,6 +45,7 @@ class SearchBarView extends StatelessWidget {
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: imagePaths.icSearchBar,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconColor: AppColor.colorTextBody,
|
||||
onTapActionCallback: onOpenSearchViewAction
|
||||
),
|
||||
Expanded(
|
||||
|
||||
+7
-5
@@ -19,16 +19,18 @@ class MobileAppBarThreadWidgetStyle {
|
||||
return const EdgeInsets.symmetric(horizontal: 32, vertical: 8);
|
||||
}
|
||||
}
|
||||
static const EdgeInsetsGeometry mailboxMenuPadding = EdgeInsets.all(5);
|
||||
static const EdgeInsetsGeometry titlePadding = EdgeInsets.symmetric(horizontal: 16);
|
||||
|
||||
static const TextStyle editButtonStyle = TextStyle(
|
||||
fontSize: 17,
|
||||
color: AppColor.primaryColor
|
||||
);
|
||||
static const TextStyle emailCounterTitleStyle = TextStyle(
|
||||
fontSize: 17,
|
||||
color: AppColor.primaryColor
|
||||
);
|
||||
|
||||
static const TextStyle titleTextStyle = TextStyle(
|
||||
fontSize: 21,
|
||||
color: Colors.black,
|
||||
fontWeight: FontWeight.bold
|
||||
);
|
||||
static Color getFilterButtonColor(FilterMessageOption option) {
|
||||
return option == FilterMessageOption.all
|
||||
? AppColor.colorFilterMessageDisabled
|
||||
|
||||
@@ -718,10 +718,6 @@ class ThreadController extends BaseController with EmailActionController {
|
||||
}
|
||||
}
|
||||
|
||||
void enableSelectionEmail() {
|
||||
mailboxDashBoardController.currentSelectMode.value = SelectMode.ACTIVE;
|
||||
}
|
||||
|
||||
void setSelectAllEmailAction() {
|
||||
final newEmailList = mailboxDashBoardController.emailsInCurrentMailbox
|
||||
.map((email) => email.toSelectedEmail(selectMode: SelectMode.ACTIVE))
|
||||
|
||||
@@ -74,7 +74,6 @@ class ThreadView extends GetWidget<ThreadController>
|
||||
filterOption: controller.mailboxDashBoardController.filterMessageOption.value,
|
||||
openMailboxAction: controller.openMailboxLeftMenu,
|
||||
cancelEditThreadAction: controller.cancelSelectEmail,
|
||||
editThreadAction: controller.enableSelectionEmail,
|
||||
emailSelectionAction: (actionType, selectionEmail) {
|
||||
return controller.pressEmailSelectionAction(
|
||||
context,
|
||||
|
||||
@@ -11,7 +11,6 @@ import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/web_a
|
||||
|
||||
typedef OnPopupMenuFilterEmailAction = void Function(FilterMessageOption, RelativeRect);
|
||||
typedef OnContextMenuFilterEmailAction = void Function(FilterMessageOption);
|
||||
typedef OnEditThreadAction = void Function();
|
||||
typedef OnOpenMailboxMenuActionClick = void Function();
|
||||
typedef OnCancelEditThreadAction = void Function();
|
||||
typedef OnEmailSelectionAction = void Function(EmailActionType, List<PresentationEmail>);
|
||||
@@ -20,7 +19,6 @@ class AppBarThreadWidget extends StatelessWidget {
|
||||
final OnPopupMenuFilterEmailAction? onPopupMenuFilterEmailAction;
|
||||
final OnContextMenuFilterEmailAction? onContextMenuFilterEmailAction;
|
||||
final OnOpenMailboxMenuActionClick openMailboxAction;
|
||||
final OnEditThreadAction editThreadAction;
|
||||
final OnCancelEditThreadAction cancelEditThreadAction;
|
||||
final OnEmailSelectionAction emailSelectionAction;
|
||||
final PresentationMailbox? mailboxSelected;
|
||||
@@ -35,7 +33,6 @@ class AppBarThreadWidget extends StatelessWidget {
|
||||
required this.selectMode,
|
||||
required this.filterOption,
|
||||
required this.openMailboxAction,
|
||||
required this.editThreadAction,
|
||||
required this.cancelEditThreadAction,
|
||||
required this.emailSelectionAction,
|
||||
this.onPopupMenuFilterEmailAction,
|
||||
@@ -52,7 +49,6 @@ class AppBarThreadWidget extends StatelessWidget {
|
||||
selectMode: selectMode,
|
||||
filterOption: filterOption,
|
||||
openMailboxAction: openMailboxAction,
|
||||
editThreadAction: editThreadAction,
|
||||
cancelEditThreadAction: cancelEditThreadAction,
|
||||
emailSelectionAction: emailSelectionAction,
|
||||
onPopupMenuFilterEmailAction: onPopupMenuFilterEmailAction,
|
||||
@@ -66,7 +62,6 @@ class AppBarThreadWidget extends StatelessWidget {
|
||||
selectMode: selectMode,
|
||||
filterOption: filterOption,
|
||||
openMailboxAction: openMailboxAction,
|
||||
editThreadAction: editThreadAction,
|
||||
cancelEditThreadAction: cancelEditThreadAction,
|
||||
onPopupMenuFilterEmailAction: onPopupMenuFilterEmailAction,
|
||||
onContextMenuFilterEmailAction: onContextMenuFilterEmailAction,
|
||||
|
||||
+85
@@ -0,0 +1,85 @@
|
||||
|
||||
import 'package:core/presentation/resources/image_paths.dart';
|
||||
import 'package:core/presentation/utils/responsive_utils.dart';
|
||||
import 'package:core/presentation/views/button/tmail_button_widget.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:model/email/presentation_email.dart';
|
||||
import 'package:model/mailbox/presentation_mailbox.dart';
|
||||
import 'package:model/mailbox/select_mode.dart';
|
||||
import 'package:tmail_ui_user/features/mailbox/presentation/extensions/presentation_mailbox_extension.dart';
|
||||
import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/styles/app_bar/mobile_app_bar_thread_widget_style.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/app_bar_thread_widget.dart';
|
||||
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
|
||||
class DefaultMobileAppBarThreadWidget extends StatelessWidget {
|
||||
final _imagePaths = Get.find<ImagePaths>();
|
||||
final _responsiveUtils = Get.find<ResponsiveUtils>();
|
||||
|
||||
final PresentationMailbox? mailboxSelected;
|
||||
final List<PresentationEmail> listEmailSelected;
|
||||
final SelectMode selectMode;
|
||||
final FilterMessageOption filterOption;
|
||||
final OnOpenMailboxMenuActionClick openMailboxAction;
|
||||
final OnPopupMenuFilterEmailAction? onPopupMenuFilterEmailAction;
|
||||
final OnContextMenuFilterEmailAction? onContextMenuFilterEmailAction;
|
||||
final OnCancelEditThreadAction cancelEditThreadAction;
|
||||
|
||||
DefaultMobileAppBarThreadWidget({
|
||||
super.key,
|
||||
required this.listEmailSelected,
|
||||
required this.mailboxSelected,
|
||||
required this.selectMode,
|
||||
required this.filterOption,
|
||||
required this.openMailboxAction,
|
||||
required this.cancelEditThreadAction,
|
||||
this.onPopupMenuFilterEmailAction,
|
||||
this.onContextMenuFilterEmailAction,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(builder: (context, constraints) {
|
||||
return Container(
|
||||
color: MobileAppBarThreadWidgetStyle.backgroundColor,
|
||||
padding: MobileAppBarThreadWidgetStyle.getPadding(context, _responsiveUtils),
|
||||
constraints: const BoxConstraints(minHeight: MobileAppBarThreadWidgetStyle.minHeight),
|
||||
child: Row(
|
||||
children: [
|
||||
TMailButtonWidget.fromIcon(
|
||||
key: const Key('mobile_mailbox_menu_button'),
|
||||
icon: _imagePaths.icMenuDrawer,
|
||||
backgroundColor: Colors.transparent,
|
||||
padding: MobileAppBarThreadWidgetStyle.mailboxMenuPadding,
|
||||
maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
|
||||
tooltipMessage: AppLocalizations.of(context).openFolderMenu,
|
||||
onTapActionCallback: openMailboxAction,
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: MobileAppBarThreadWidgetStyle.titlePadding,
|
||||
child: Text(
|
||||
mailboxSelected?.getDisplayName(context) ?? '',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: MobileAppBarThreadWidgetStyle.titleTextStyle
|
||||
),
|
||||
),
|
||||
),
|
||||
TMailButtonWidget.fromIcon(
|
||||
key: const Key('mobile_filter_message_button'),
|
||||
icon: _imagePaths.icFilter,
|
||||
iconColor: MobileAppBarThreadWidgetStyle.getFilterButtonColor(filterOption),
|
||||
backgroundColor: Colors.transparent,
|
||||
maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
|
||||
tooltipMessage: AppLocalizations.of(context).filter_messages,
|
||||
onTapActionCallback: () => onContextMenuFilterEmailAction?.call(filterOption),
|
||||
onTapActionAtPositionCallback: (position) => onPopupMenuFilterEmailAction?.call(filterOption, position),
|
||||
),
|
||||
]
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
+26
-74
@@ -1,40 +1,29 @@
|
||||
|
||||
import 'package:core/presentation/resources/image_paths.dart';
|
||||
import 'package:core/presentation/utils/responsive_utils.dart';
|
||||
import 'package:core/presentation/views/button/tmail_button_widget.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:model/email/presentation_email.dart';
|
||||
import 'package:model/mailbox/presentation_mailbox.dart';
|
||||
import 'package:model/mailbox/select_mode.dart';
|
||||
import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/styles/app_bar/mobile_app_bar_thread_widget_style.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/app_bar_thread_widget.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/title_app_bar_thread_widget.dart';
|
||||
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/default_mobile_app_bar_thread_widget.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/selection_mobile_app_bar_thread_widget.dart';
|
||||
|
||||
class MobileAppBarThreadWidget extends StatelessWidget {
|
||||
final _imagePaths = Get.find<ImagePaths>();
|
||||
final _responsiveUtils = Get.find<ResponsiveUtils>();
|
||||
|
||||
final PresentationMailbox? mailboxSelected;
|
||||
final List<PresentationEmail> listEmailSelected;
|
||||
final SelectMode selectMode;
|
||||
final FilterMessageOption filterOption;
|
||||
final OnOpenMailboxMenuActionClick openMailboxAction;
|
||||
final OnEditThreadAction editThreadAction;
|
||||
final OnPopupMenuFilterEmailAction? onPopupMenuFilterEmailAction;
|
||||
final OnContextMenuFilterEmailAction? onContextMenuFilterEmailAction;
|
||||
final OnCancelEditThreadAction cancelEditThreadAction;
|
||||
|
||||
MobileAppBarThreadWidget({
|
||||
const MobileAppBarThreadWidget({
|
||||
super.key,
|
||||
required this.listEmailSelected,
|
||||
required this.mailboxSelected,
|
||||
required this.selectMode,
|
||||
required this.filterOption,
|
||||
required this.openMailboxAction,
|
||||
required this.editThreadAction,
|
||||
required this.cancelEditThreadAction,
|
||||
this.onPopupMenuFilterEmailAction,
|
||||
this.onContextMenuFilterEmailAction,
|
||||
@@ -42,66 +31,29 @@ class MobileAppBarThreadWidget extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(builder: (context, constraints) {
|
||||
return Container(
|
||||
color: MobileAppBarThreadWidgetStyle.backgroundColor,
|
||||
padding: MobileAppBarThreadWidgetStyle.getPadding(context, _responsiveUtils),
|
||||
constraints: const BoxConstraints(minHeight: MobileAppBarThreadWidgetStyle.minHeight),
|
||||
child: Stack(
|
||||
alignment: AlignmentDirectional.center,
|
||||
children: [
|
||||
if (selectMode == SelectMode.INACTIVE)
|
||||
PositionedDirectional(
|
||||
start: 0,
|
||||
child: TMailButtonWidget.fromText(
|
||||
key: const Key('selection_thread_button'),
|
||||
text: AppLocalizations.of(context).edit,
|
||||
textStyle: MobileAppBarThreadWidgetStyle.editButtonStyle,
|
||||
backgroundColor: Colors.transparent,
|
||||
maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
|
||||
maxLines: 1,
|
||||
tooltipMessage: AppLocalizations.of(context).edit,
|
||||
onTapActionCallback: editThreadAction,
|
||||
),
|
||||
)
|
||||
else
|
||||
PositionedDirectional(
|
||||
start: 0,
|
||||
child: TMailButtonWidget(
|
||||
key: const Key('cancel_selection_thread_button'),
|
||||
text: '${listEmailSelected.length}',
|
||||
icon: _imagePaths.icBack,
|
||||
iconColor: MobileAppBarThreadWidgetStyle.backButtonColor,
|
||||
textStyle: MobileAppBarThreadWidgetStyle.emailCounterTitleStyle,
|
||||
backgroundColor: Colors.transparent,
|
||||
onTapActionCallback: cancelEditThreadAction,
|
||||
),
|
||||
),
|
||||
Center(
|
||||
child: TitleAppBarThreadWidget(
|
||||
key: const Key('title_app_bar_thread'),
|
||||
mailboxSelected: mailboxSelected,
|
||||
filterOption: filterOption,
|
||||
maxWidth: constraints.maxWidth - MobileAppBarThreadWidgetStyle.titleOffset,
|
||||
openMailboxAction: openMailboxAction,
|
||||
),
|
||||
),
|
||||
PositionedDirectional(
|
||||
end: 0,
|
||||
child: TMailButtonWidget.fromIcon(
|
||||
key: const Key('filter_message_button'),
|
||||
icon: _imagePaths.icFilter,
|
||||
iconColor: MobileAppBarThreadWidgetStyle.getFilterButtonColor(filterOption),
|
||||
backgroundColor: Colors.transparent,
|
||||
maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
|
||||
tooltipMessage: AppLocalizations.of(context).filter_messages,
|
||||
onTapActionCallback: () => onContextMenuFilterEmailAction?.call(filterOption),
|
||||
onTapActionAtPositionCallback: (position) => onPopupMenuFilterEmailAction?.call(filterOption, position),
|
||||
),
|
||||
),
|
||||
]
|
||||
),
|
||||
if (selectMode == SelectMode.ACTIVE) {
|
||||
return SelectionMobileAppBarThreadWidget(
|
||||
key: const Key('selection_mobile_app_bar_thread_widget'),
|
||||
listEmailSelected: listEmailSelected,
|
||||
mailboxSelected: mailboxSelected,
|
||||
selectMode: selectMode,
|
||||
filterOption: filterOption,
|
||||
cancelEditThreadAction: cancelEditThreadAction,
|
||||
onPopupMenuFilterEmailAction: onPopupMenuFilterEmailAction,
|
||||
onContextMenuFilterEmailAction: onContextMenuFilterEmailAction,
|
||||
);
|
||||
});
|
||||
} else {
|
||||
return DefaultMobileAppBarThreadWidget(
|
||||
key: const Key('default_mobile_app_bar_thread_widget'),
|
||||
listEmailSelected: listEmailSelected,
|
||||
mailboxSelected: mailboxSelected,
|
||||
selectMode: selectMode,
|
||||
filterOption: filterOption,
|
||||
openMailboxAction: openMailboxAction,
|
||||
cancelEditThreadAction: cancelEditThreadAction,
|
||||
onPopupMenuFilterEmailAction: onPopupMenuFilterEmailAction,
|
||||
onContextMenuFilterEmailAction: onContextMenuFilterEmailAction,
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+72
@@ -0,0 +1,72 @@
|
||||
|
||||
import 'package:core/presentation/resources/image_paths.dart';
|
||||
import 'package:core/presentation/utils/responsive_utils.dart';
|
||||
import 'package:core/presentation/views/button/tmail_button_widget.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:model/email/presentation_email.dart';
|
||||
import 'package:model/mailbox/presentation_mailbox.dart';
|
||||
import 'package:model/mailbox/select_mode.dart';
|
||||
import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/styles/app_bar/mobile_app_bar_thread_widget_style.dart';
|
||||
import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/app_bar_thread_widget.dart';
|
||||
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
|
||||
class SelectionMobileAppBarThreadWidget extends StatelessWidget {
|
||||
final _imagePaths = Get.find<ImagePaths>();
|
||||
final _responsiveUtils = Get.find<ResponsiveUtils>();
|
||||
|
||||
final PresentationMailbox? mailboxSelected;
|
||||
final List<PresentationEmail> listEmailSelected;
|
||||
final SelectMode selectMode;
|
||||
final FilterMessageOption filterOption;
|
||||
final OnPopupMenuFilterEmailAction? onPopupMenuFilterEmailAction;
|
||||
final OnContextMenuFilterEmailAction? onContextMenuFilterEmailAction;
|
||||
final OnCancelEditThreadAction cancelEditThreadAction;
|
||||
|
||||
SelectionMobileAppBarThreadWidget({
|
||||
super.key,
|
||||
required this.listEmailSelected,
|
||||
required this.mailboxSelected,
|
||||
required this.selectMode,
|
||||
required this.filterOption,
|
||||
required this.cancelEditThreadAction,
|
||||
this.onPopupMenuFilterEmailAction,
|
||||
this.onContextMenuFilterEmailAction,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(builder: (context, constraints) {
|
||||
return Container(
|
||||
color: MobileAppBarThreadWidgetStyle.backgroundColor,
|
||||
padding: MobileAppBarThreadWidgetStyle.getPadding(context, _responsiveUtils),
|
||||
constraints: const BoxConstraints(minHeight: MobileAppBarThreadWidgetStyle.minHeight),
|
||||
child: Row(
|
||||
children: [
|
||||
TMailButtonWidget(
|
||||
key: const Key('mobile_cancel_selection_thread_button'),
|
||||
text: '${listEmailSelected.length}',
|
||||
icon: _imagePaths.icBack,
|
||||
iconColor: MobileAppBarThreadWidgetStyle.backButtonColor,
|
||||
textStyle: MobileAppBarThreadWidgetStyle.emailCounterTitleStyle,
|
||||
backgroundColor: Colors.transparent,
|
||||
onTapActionCallback: cancelEditThreadAction,
|
||||
),
|
||||
const Spacer(),
|
||||
TMailButtonWidget.fromIcon(
|
||||
key: const Key('mobile_filter_message_button'),
|
||||
icon: _imagePaths.icFilter,
|
||||
iconColor: MobileAppBarThreadWidgetStyle.getFilterButtonColor(filterOption),
|
||||
backgroundColor: Colors.transparent,
|
||||
maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
|
||||
tooltipMessage: AppLocalizations.of(context).filter_messages,
|
||||
onTapActionCallback: () => onContextMenuFilterEmailAction?.call(filterOption),
|
||||
onTapActionAtPositionCallback: (position) => onPopupMenuFilterEmailAction?.call(filterOption, position),
|
||||
),
|
||||
]
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -15,7 +15,6 @@ class WebAppBarThreadWidget extends StatelessWidget {
|
||||
final SelectMode selectMode;
|
||||
final FilterMessageOption filterOption;
|
||||
final OnOpenMailboxMenuActionClick openMailboxAction;
|
||||
final OnEditThreadAction editThreadAction;
|
||||
final OnCancelEditThreadAction cancelEditThreadAction;
|
||||
final OnEmailSelectionAction emailSelectionAction;
|
||||
final OnPopupMenuFilterEmailAction? onPopupMenuFilterEmailAction;
|
||||
@@ -28,7 +27,6 @@ class WebAppBarThreadWidget extends StatelessWidget {
|
||||
required this.selectMode,
|
||||
required this.filterOption,
|
||||
required this.openMailboxAction,
|
||||
required this.editThreadAction,
|
||||
required this.cancelEditThreadAction,
|
||||
required this.emailSelectionAction,
|
||||
this.onPopupMenuFilterEmailAction,
|
||||
|
||||
Reference in New Issue
Block a user