eduvia/workavia-mail-front
11
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

TF-467 Apply new UI for mailbox browser

Browse Source
This commit is contained in:
dab246
2022-04-08 20:09:35 +07:00
committed by Dat H. Pham
parent 706ce81c03
commit 09be1eb833
15 changed files with 382 additions and 453 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/images/ic_menu_drawer.svg
+3
View File
@@ -0,0 +1,3 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M23.3333 19.8334C23.9777 19.8334 24.5 20.3557 24.5 21C24.5 21.6444 23.9777 22.1667 23.3333 22.1667H4.66667C4.02233 22.1667 3.5 21.6444 3.5 21C3.5 20.3557 4.02233 19.8334 4.66667 19.8334H23.3333ZM23.3333 15.1667C23.9777 15.1667 24.5 15.689 24.5 16.3334C24.5 16.9777 23.9777 17.5 23.3333 17.5H4.66667C4.02233 17.5 3.5 16.9777 3.5 16.3334C3.5 15.689 4.02233 15.1667 4.66667 15.1667H23.3333ZM23.3333 10.5C23.9777 10.5 24.5 11.0224 24.5 11.6667C24.5 12.311 23.9777 12.8334 23.3333 12.8334H4.66667C4.02233 12.8334 3.5 12.311 3.5 11.6667C3.5 11.0224 4.02233 10.5 4.66667 10.5H23.3333ZM23.3333 5.83337C23.9777 5.83337 24.5 6.35571 24.5 7.00004C24.5 7.64437 23.9777 8.16671 23.3333 8.16671H4.66667C4.02233 8.16671 3.5 7.64437 3.5 7.00004C3.5 6.35571 4.02233 5.83337 4.66667 5.83337H23.3333Z" fill="#99A2AD"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 912 B

core/lib/presentation/extensions/color_extension.dart
+1
View File
@@ -107,6 +107,7 @@ extension AppColor on Color {
static const colorAvatar = Color(0xFFDE5E5E);
static const colorFocusButton = Color(0x14818C99);
static const colorBorderEmailAddressInvalid = Color(0xFFFF3347);
static const colorBgMailboxSelected = Color(0xFF99E4E8EC);
static const mapGradientColor = [
[Color(0xFF21D4FD), Color(0xFFB721FF)],
core/lib/presentation/resources/image_paths.dart
+1
View File
@@ -87,6 +87,7 @@ class ImagePaths {
String get icEmpty => _getImagePath('ic_empty.svg');
String get icNotConnection => _getImagePath('ic_not_connection.svg');
String get icDeleteTrash => _getImagePath('ic_delete_trash.svg');
String get icMenuDrawer => _getImagePath('ic_menu_drawer.svg');
String _getImagePath(String imageName) {
return AssetsPaths.images + imageName;
core/lib/presentation/utils/responsive_utils.dart
+1 -1
View File
@@ -9,7 +9,7 @@ class ResponsiveUtils {
final int minTabletLargeWidth = 900;
final double defaultSizeDrawerWidthMobileTablet = 375;
final double defaultSizeDrawerWidthWeb = 320;
final double defaultSizeDrawerWidthWeb = 262;
final double _loginTextFieldWidthSmallScreen = 280.0;
final double _loginTextFieldWidthLargeScreen = 320.0;
core/lib/presentation/views/button/icon_button_web.dart
+1 -1
View File
@@ -20,7 +20,7 @@ Widget buildIconWeb({
icon: icon,
iconSize: iconSize,
padding: iconPadding ?? EdgeInsets.all(8.0),
splashRadius: splashRadius ?? 20,
splashRadius: splashRadius ?? 15,
tooltip: tooltip ?? '',
onPressed: onTap)
);
core/lib/presentation/views/search/search_bar_view.dart
+12 -20
View File
@@ -1,6 +1,8 @@
import 'package:core/core.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_svg/flutter_svg.dart';
typedef OnOpenSearchViewAction = Function();
@@ -61,30 +63,20 @@ class SearchBarView {
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
_buildSearchButton(),
Expanded(child: Text(
_hintTextSearch ?? '',
maxLines: 1,
style: TextStyle(fontSize: 17, color: AppColor.colorHintSearchBar)))
buildIconWeb(
splashRadius: 12,
icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 16, height: 16, fit: BoxFit.fill),
onTap: () => _onOpenSearchViewAction?.call()),
Expanded(child:
Transform(transform: Matrix4.translationValues(-5, 0.0, 0.0),
child: Text(
_hintTextSearch ?? '',
maxLines: 1,
style: TextStyle(fontSize: kIsWeb ? 15 : 17, color: AppColor.colorHintSearchBar))))
]
)
)
),
);
}
Widget _buildSearchButton() {
return Material(
color: Colors.transparent,
shape: CircleBorder(),
child: Padding(
padding: EdgeInsets.only(left: 2),
child: IconButton(
splashRadius: 20,
icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 18, height: 18, fit: BoxFit.fill),
onPressed: () => _onOpenSearchViewAction?.call()
)
)
);
}
}
lib/features/base/base_mailbox_controller.dart
+9
View File
@@ -14,6 +14,8 @@ abstract class BaseMailboxController extends BaseController {
final folderMailboxTree = MailboxTree(MailboxNode.root()).obs;
final defaultMailboxTree = MailboxTree(MailboxNode.root()).obs;
final listMailboxNodeSelected = <MailboxNode>[].obs;
final listPresentationMailboxSelected = <PresentationMailbox>[].obs;
List<PresentationMailbox> allMailboxes = <PresentationMailbox>[];
@@ -55,6 +57,13 @@ abstract class BaseMailboxController extends BaseController {
? SelectMode.ACTIVE
: SelectMode.INACTIVE;
if (newSelectMode == SelectMode.INACTIVE) {
listMailboxNodeSelected.removeWhere((mailboxNode) => mailboxNode.item.id == mailboxNodeSelected.item.id);
} else {
listMailboxNodeSelected.add(mailboxNodeSelected);
}
if (defaultMailboxTree.value.updateSelectedNode(mailboxNodeSelected, newSelectMode) != null) {
log('selectMailboxNode() refresh defaultMailboxTree');
defaultMailboxTree.refresh();
lib/features/mailbox/presentation/mailbox_controller.dart
+32 -8
View File
@@ -2,6 +2,7 @@ import 'dart:async';
import 'package:core/core.dart';
import 'package:dartz/dartz.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
@@ -168,6 +169,8 @@ class MailboxController extends BaseMailboxController {
_openMailboxEventController.stream.throttleTime(Duration(milliseconds: 800)).listen((event) {
_handleOpenMailbox(event.buildContext, event.presentationMailbox);
});
_initCollapseMailboxCategories();
}
@override
@@ -225,6 +228,16 @@ class MailboxController extends BaseMailboxController {
@override
void onError(error) {}
void _initCollapseMailboxCategories() {
if (currentContext != null) {
if (kIsWeb && (_responsiveUtils.isMobile(currentContext!)) || _responsiveUtils.isTablet(currentContext!)) {
mailboxCategoriesExpandMode.value = MailboxCategoriesExpandMode(
defaultMailbox: ExpandMode.COLLAPSE,
folderMailbox: ExpandMode.COLLAPSE);
}
}
}
void getAllMailboxAction(AccountId accountId) async {
consumeState(_getAllMailboxInteractor.execute(accountId));
}
@@ -367,12 +380,13 @@ class MailboxController extends BaseMailboxController {
void enableSearch() {
_cancelSelectMailbox();
listMailboxNodeSelected.clear();
searchState.value = searchState.value.enableSearchState();
}
void disableSearch(BuildContext context) {
_cancelSelectMailbox();
listPresentationMailboxSelected.clear();
listMailboxSearched.clear();
searchState.value = searchState.value.disableSearchState();
searchQuery.value = SearchQuery.initial();
@@ -384,10 +398,12 @@ class MailboxController extends BaseMailboxController {
searchQuery.value = SearchQuery.initial();
searchFocus.requestFocus();
listMailboxSearched.clear();
listPresentationMailboxSelected.clear();
}
void searchMailbox(String value) {
searchQuery.value = SearchQuery(value);
listPresentationMailboxSelected.clear();
_searchMailboxAction(allMailboxes, searchQuery.value);
}
@@ -418,13 +434,17 @@ class MailboxController extends BaseMailboxController {
bool isSelectionEnabled() => currentSelectMode.value == SelectMode.ACTIVE;
void selectMailbox(BuildContext context, PresentationMailbox mailboxSelected) {
if (isSearchActive()) {
listMailboxSearched.value = listMailboxSearched
.map((mailbox) => mailbox.id == mailboxSelected.id
? mailbox.toggleSelectPresentationMailbox()
: mailbox)
.toList();
void selectMailboxSearched(BuildContext context, PresentationMailbox mailboxSelected) {
listMailboxSearched.value = listMailboxSearched
.map((mailbox) => mailbox.id == mailboxSelected.id ? mailbox.toggleSelectPresentationMailbox() : mailbox)
.toList();
if (kIsWeb) {
if (mailboxSelected.selectMode == SelectMode.ACTIVE) {
listPresentationMailboxSelected.removeWhere((mailbox) => mailbox.id == mailboxSelected.id);
} else {
listPresentationMailboxSelected.add(mailboxSelected);
}
}
}
@@ -438,6 +458,10 @@ class MailboxController extends BaseMailboxController {
folderMailboxTree.value.updateNodesUIMode(SelectMode.INACTIVE, ExpandMode.COLLAPSE);
}
currentSelectMode.value = SelectMode.INACTIVE;
if (kIsWeb) {
listPresentationMailboxSelected.clear();
listMailboxNodeSelected.clear();
}
}
List<PresentationMailbox> get listMailboxSelected {
lib/features/mailbox/presentation/mailbox_view.dart
+1 -1
View File
@@ -418,7 +418,7 @@ class MailboxView extends GetWidget<MailboxController> {
allSelectMode: controller.currentSelectMode.value,
lastMailbox: controller.listMailboxSearched.last)
..addOnOpenMailboxAction((mailbox) => controller.openMailbox(context, mailbox))
..addOnSelectMailboxActionClick((mailbox) => controller.selectMailbox(context, mailbox)))
..addOnSelectMailboxActionClick((mailbox) => controller.selectMailboxSearched(context, mailbox)))
.build())
)
));
lib/features/mailbox/presentation/mailbox_view_web.dart
+210 -333
View File
@@ -6,6 +6,7 @@ import 'package:get/get.dart';
import 'package:model/model.dart';
import 'package:package_info_plus/package_info_plus.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/mailbox_controller.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_categories.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/bottom_bar_selection_mailbox_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart';
@@ -21,195 +22,102 @@ class MailboxView extends GetWidget<MailboxController> {
@override
Widget build(BuildContext context) {
return _buildBodyMailbox(context);
}
Widget _buildBodyMailbox(BuildContext context) {
return SafeArea(
top: _responsiveUtils.isMobile(context) ? true : false,
bottom: false,
left: false,
right: false,
child: ClipRRect(
borderRadius: BorderRadius.only(
topRight: Radius.circular(_responsiveUtils.isMobile(context) ? 14 : 0),
topLeft: Radius.circular(_responsiveUtils.isMobile(context) ? 14 : 0)),
child: Drawer(
child: Scaffold(
backgroundColor: _responsiveUtils.isDesktop(context) ? AppColor.colorBgDesktop : Colors.white,
body: Column(
children: [
if (_responsiveUtils.isDesktop(context))
Container(
color: Colors.white,
padding: EdgeInsets.only(left: 20, top: 20, bottom: 24),
child: (SloganBuilder(arrangedByHorizontal: true)
..setSloganText(AppLocalizations.of(context).app_name)
..setSloganTextAlign(TextAlign.center)
..setSloganTextStyle(TextStyle(color: Colors.black, fontSize: 25, fontWeight: FontWeight.bold))
..setSizeLogo(28)
..setLogo(_imagePaths.icLogoTMail))
.build()),
if (!_responsiveUtils.isDesktop(context)) _buildHeaderMailbox(context),
if (_responsiveUtils.isDesktop(context))
Row(children: [
Expanded(child: Container(
padding: EdgeInsets.only(top: 16, left: 20),
color: AppColor.colorBgDesktop,
alignment: Alignment.centerLeft,
child: (ButtonBuilder(_imagePaths.icCompose)
..key(Key('button_compose_email'))
..decoration(BoxDecoration(borderRadius: BorderRadius.circular(25), color: AppColor.colorTextButton))
..paddingIcon(EdgeInsets.only(right: 8))
..iconColor(Colors.white)
..maxWidth(140)
..size(20)
..radiusSplash(10)
..padding(EdgeInsets.symmetric(vertical: 13))
..textStyle(TextStyle(fontSize: 15, color: Colors.white, fontWeight: FontWeight.w500))
..onPressActionClick(() => controller.mailboxDashBoardController.composeEmailAction())
..text(AppLocalizations.of(context).compose, isVertical: false))
.build())
),
Obx(() {
if (controller.isSearchActive()) {
return controller.listMailboxSearched.isNotEmpty
? Padding(
padding: EdgeInsets.only(top: 16),
child: _buildEditMailboxButton(context, controller.isSelectionEnabled()))
: SizedBox.shrink();
} else {
return Padding(
padding: EdgeInsets.only(top: 16),
child: _buildEditMailboxButton(context, controller.isSelectionEnabled()));
}
})
]),
Obx(() => !controller.isSearchActive() && _responsiveUtils.isDesktop(context)
? Row(children: [
Expanded(child: _buildSearchBarWidget(context)),
buildIconWeb(
icon: SvgPicture.asset(_imagePaths.icAddNewFolder, color: AppColor.colorTextButton, fit: BoxFit.fill),
tooltip: AppLocalizations.of(context).new_mailbox,
onTap: () => controller.goToCreateNewMailboxView()),
])
: SizedBox.shrink()),
Obx(() => controller.isSearchActive() ? _buildInputSearchFormWidget(context) : SizedBox.shrink()),
Expanded(child: Obx(() => Container(
color: _responsiveUtils.isDesktop(context)
? Colors.transparent
: controller.isSearchActive() ? Colors.white : AppColor.colorBgMailbox,
child: RefreshIndicator(
color: AppColor.primaryColor,
onRefresh: () async => controller.refreshAllMailbox(),
child: controller.isSearchActive()
? _buildListMailboxSearched(context, controller.listMailboxSearched)
: _buildListMailbox(context)),
))),
Obx(() => controller.isSelectionEnabled()
? _buildOptionSelectionMailbox(context)
: SizedBox.shrink()),
]
),
)
)
)
);
}
Widget _buildHeaderMailbox(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: EdgeInsets.only(
top: _responsiveUtils.isMobile(context) ? 14 : 30,
bottom: 10),
child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [
!_responsiveUtils.isDesktop(context) && !_responsiveUtils.isTabletLarge(context)
? _buildCloseScreenButton(context)
: SizedBox(width: 50),
return Drawer(
child: Scaffold(
backgroundColor: Colors.white,
body: Column(
children: [
_buildLogoApp(context),
if (!_responsiveUtils.isDesktop(context)) Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2),
Expanded(child: Container(
padding: EdgeInsets.zero,
color: _responsiveUtils.isDesktop(context) ? AppColor.colorBgDesktop : Colors.white,
child: Column(children: [
if (_responsiveUtils.isDesktop(context)) _buildComposerButton(context),
SizedBox(height: 16),
Obx(() => controller.isSearchActive() ? _buildInputSearchFormWidget(context) : SizedBox.shrink()),
Expanded(child: Obx(() => Container(
color: _responsiveUtils.isDesktop(context) ? AppColor.colorBgDesktop : Colors.white,
padding: EdgeInsets.zero,
child: RefreshIndicator(
color: AppColor.primaryColor,
onRefresh: () async => controller.refreshAllMailbox(),
child: controller.isSearchActive()
? _buildListMailboxSearched(context, controller.listMailboxSearched)
: _buildListMailbox(context)),
))),
]),
)),
Obx(() {
if (controller.isSearchActive()) {
return controller.listMailboxSearched.isNotEmpty
? SizedBox(width: controller.isSelectionEnabled() ? 49 : 40)
return controller.listPresentationMailboxSelected.isNotEmpty
? _buildOptionSelectionMailbox(context)
: SizedBox.shrink();
} else {
return SizedBox(width: controller.isSelectionEnabled() ? 49 : 40);
return controller.listMailboxNodeSelected.isNotEmpty
? _buildOptionSelectionMailbox(context)
: SizedBox.shrink();
}
}),
Expanded(child: Text(
AppLocalizations.of(context).folders,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 20, color: AppColor.colorNameEmail, fontWeight: FontWeight.w700))),
Obx(() {
if (controller.isSearchActive()) {
return controller.listMailboxSearched.isNotEmpty
? _buildEditMailboxButton(context, controller.isSelectionEnabled())
: SizedBox(width: 25);
} else {
return _buildEditMailboxButton(context, controller.isSelectionEnabled());
}
}),
_buildAddNewFolderButton(context),
])),
Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2),
]
);
}
Widget _buildCloseScreenButton(BuildContext context) {
return Padding(
padding: EdgeInsets.only(left: 16, right: 16),
child: IconButton(
key: Key('mailbox_close_button'),
onPressed: () => controller.closeMailboxScreen(context),
icon: SvgPicture.asset(_imagePaths.icCloseMailbox, width: 30, height: 30, fit: BoxFit.fill)));
}
Widget _buildAddNewFolderButton(BuildContext context) {
return Padding(
padding: EdgeInsets.only(right: 10),
child: IconButton(
key: Key('create_new_mailbox_button'),
onPressed: () => controller.goToCreateNewMailboxView(),
icon: SvgPicture.asset(_imagePaths.icAddNewFolder, width: 30, height: 30, fit: BoxFit.fill)));
}
Widget _buildEditMailboxButton(BuildContext context, bool isSelectionEnabled) {
return Material(
shape: CircleBorder(),
color: Colors.transparent,
child: TextButton(
child: Text(
!isSelectionEnabled ? AppLocalizations.of(context).edit : AppLocalizations.of(context).cancel,
style: TextStyle(fontSize: 17, color: AppColor.colorTextButton)),
onPressed: () => !isSelectionEnabled
? controller.enableSelectionMailbox()
: controller.disableSelectionMailbox()
]
),
)
);
}
Widget _buildUserInformationWidget(BuildContext context) {
return Padding(
padding: EdgeInsets.only(left: 16, top: 8.0, right: 16),
child: Obx(() => (UserInformationWidgetBuilder(
_imagePaths,
context,
controller.mailboxDashBoardController.userProfile.value)
..addOnLogoutAction(() => controller.mailboxDashBoardController.logoutAction()))
.build()));
Widget _buildLogoApp(BuildContext context) {
return Container(
color: Colors.white,
padding: EdgeInsets.only(
top: _responsiveUtils.isDesktop(context) ? 25 : 16,
bottom: _responsiveUtils.isDesktop(context) ? 25 : 16,
left: _responsiveUtils.isDesktop(context) ? 32 : 16),
child: Row(children: [
(SloganBuilder(arrangedByHorizontal: true)
..setSloganText(AppLocalizations.of(context).app_name)
..setSloganTextAlign(TextAlign.center)
..setSloganTextStyle(TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold))
..setSizeLogo(24)
..setLogo(_imagePaths.icLogoTMail))
.build(),
Obx(() {
if (controller.mailboxDashBoardController.appInformation.value != null) {
return _buildVersionInformation(context, controller.mailboxDashBoardController.appInformation.value!);
} else {
return SizedBox.shrink();
}
}),
])
);
}
Widget _buildComposerButton(BuildContext context) {
return Container(
padding: EdgeInsets.only(top: 16, right: 16, left: 20),
color: AppColor.colorBgDesktop,
alignment: Alignment.centerLeft,
child: (ButtonBuilder(_imagePaths.icCompose)
..key(Key('button_compose_email'))
..decoration(BoxDecoration(borderRadius: BorderRadius.circular(25), color: AppColor.colorTextButton))
..paddingIcon(EdgeInsets.only(right: 8))
..iconColor(Colors.white)
..maxWidth(140)
..size(20)
..radiusSplash(10)
..padding(EdgeInsets.symmetric(vertical: 13))
..textStyle(TextStyle(fontSize: 15, color: Colors.white, fontWeight: FontWeight.w500))
..onPressActionClick(() => controller.mailboxDashBoardController.composeEmailAction())
..text(AppLocalizations.of(context).compose, isVertical: false))
.build());
}
Widget _buildSearchBarWidget(BuildContext context) {
return Padding(
padding: EdgeInsets.only(top: _responsiveUtils.isDesktop(context) ? 16 : 12, bottom: 16, left: 16, right: 16),
padding: EdgeInsets.only(top: 16, bottom: 16, right: 4, left: _responsiveUtils.isDesktop(context) ? 0 : 12),
child: (SearchBarView(_imagePaths)
..hintTextSearch(AppLocalizations.of(context).hint_search_mailboxes)
..addOnOpenSearchViewAction(() => controller.enableSearch()))
.build());
..hintTextSearch(AppLocalizations.of(context).hint_search_mailboxes)
..addOnOpenSearchViewAction(() => controller.enableSearch()))
.build());
}
Widget _buildLoadingView() {
@@ -231,222 +139,191 @@ class MailboxView extends GetWidget<MailboxController> {
key: PageStorageKey('mailbox_list'),
primary: false,
shrinkWrap: true,
padding: EdgeInsets.zero,
padding: EdgeInsets.only(
right: _responsiveUtils.isDesktop(context) ? 8 : 0,
left: _responsiveUtils.isDesktop(context) ? 20 : 0),
children: [
Obx(() => (controller.isSelectionEnabled() && _responsiveUtils.isMobileDevice(context) && _responsiveUtils.isLandscape(context))
|| _responsiveUtils.isDesktop(context) ? SizedBox.shrink() : _buildUserInformationWidget(context)),
Obx(() => (controller.isSelectionEnabled() && _responsiveUtils.isMobileDevice(context) && _responsiveUtils.isLandscape(context))
|| _responsiveUtils.isDesktop(context) ? SizedBox.shrink() : _buildLineSpaceUserInformation()),
if (!_responsiveUtils.isDesktop(context)) _buildSearchBarWidget(context),
_buildLoadingView(),
Obx(() => controller.defaultMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(14),
color: Colors.white),
margin: EdgeInsets.only(left: 16, right: 16, top: 4),
child: _buildDefaultMailbox(context))
: SizedBox.shrink()),
Obx(() => controller.folderMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? Padding(
padding: EdgeInsets.only(left: 25, top: 26, bottom: 12),
child: Text(
AppLocalizations.of(context).folders,
maxLines: 1,
style: TextStyle(fontSize: 20, color: AppColor.colorNameEmail, fontWeight: FontWeight.w600)))
: SizedBox.shrink()),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(14),
color: Colors.white),
margin: EdgeInsets.only(left: 16, right: 16, bottom: 30),
child: _buildFolderMailbox(context),
),
Obx(() {
if (controller.mailboxDashBoardController.appInformation.value != null) {
return _buildVersionInformation(context, controller.mailboxDashBoardController.appInformation.value!);
} else {
if ((controller.isSelectionEnabled()
&& _responsiveUtils.isMobile(context)
&& _responsiveUtils.isLandscape(context))
|| _responsiveUtils.isDesktop(context)) {
return SizedBox.shrink();
}
return _buildUserInformation(context);
}),
_buildLoadingView(),
Obx(() => controller.defaultMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? _buildMailboxCategory(context, MailboxCategories.exchange, controller.defaultMailboxTree.value.root)
: SizedBox.shrink()),
SizedBox(height: 8),
Obx(() => controller.folderMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? Column(children: [
Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2),
SizedBox(height: 8),
])
: SizedBox.shrink()),
Obx(() => controller.folderMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? _buildMailboxCategory(context, MailboxCategories.folders, controller.folderMailboxTree.value.root)
: SizedBox.shrink()),
Obx(() => !controller.isSearchActive()
? Row(children: [
Expanded(child: _buildSearchBarWidget(context)),
Padding(
padding: EdgeInsets.only(right: 8),
child: buildIconWeb(
icon: SvgPicture.asset(_imagePaths.icAddNewFolder, color: AppColor.colorTextButton, fit: BoxFit.fill),
tooltip: AppLocalizations.of(context).new_mailbox,
onTap: () => controller.goToCreateNewMailboxView())),
])
: SizedBox.shrink()),
]
);
}
Widget _buildLineSpaceUserInformation() {
Widget _buildUserInformation(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(vertical: 10),
child: Column(children: [
Padding(
padding: EdgeInsets.only(left: 16, bottom: 10),
child: (UserInformationWidgetBuilder(_imagePaths, context, controller.mailboxDashBoardController.userProfile.value)
..addOnLogoutAction(() => controller.mailboxDashBoardController.logoutAction()))
.build()),
Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2)
]),
);
}
Widget _buildHeaderMailboxCategory(BuildContext context, MailboxCategories categories) {
return Padding(
padding: EdgeInsets.only(top: 16),
child: Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2));
padding: EdgeInsets.only(left: _responsiveUtils.isDesktop(context) ? 12 : 16, right: _responsiveUtils.isDesktop(context) ? 4 : 12),
child: Row(children: [
Expanded(child: Text(categories.getTitle(context),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(fontSize: 17, color: Colors.black, fontWeight: FontWeight.bold))),
buildIconWeb(
splashRadius: 12,
icon: SvgPicture.asset(
categories.getExpandMode(controller.mailboxCategoriesExpandMode.value) == ExpandMode.EXPAND
? _imagePaths.icExpandFolder
: _imagePaths.icCollapseFolder,
color: AppColor.primaryColor, fit: BoxFit.fill),
tooltip: AppLocalizations.of(context).collapse,
onTap: () => controller.toggleMailboxCategories(categories))
]));
}
Widget _buildDefaultMailbox(BuildContext context) {
return Obx(() => controller.defaultMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? Transform(
transform: Matrix4.translationValues(-4.0, 0.0, 0.0),
child: Padding(
padding: EdgeInsets.only(top: 10, bottom: 10),
child: TreeView(
startExpanded: false,
key: Key('default_mailbox_list'),
children: _buildListChildTileWidget(context, controller.defaultMailboxTree.value.root)))
)
: SizedBox.shrink()
);
Widget _buildBodyMailboxCategory(BuildContext context, MailboxCategories categories, MailboxNode mailboxNode) {
final lastNode = mailboxNode.childrenItems?.last;
return Container(
margin: EdgeInsets.zero,
padding: EdgeInsets.only(right: _responsiveUtils.isDesktop(context) ? 8 : 16, left: _responsiveUtils.isDesktop(context) ? 0 : 12),
child: TreeView(
key: Key('${categories.keyValue}_mailbox_list'),
children: _buildListChildTileWidget(context, mailboxNode, lastNode: lastNode)));
}
Widget _buildFolderMailbox(BuildContext context) {
return Obx(() => controller.folderMailboxTree.value.root.childrenItems?.isNotEmpty ?? false
? Transform(
transform: Matrix4.translationValues(-4.0, 0.0, 0.0),
child: Padding(
padding: EdgeInsets.only(top: 10, bottom: 10),
child: TreeView(
startExpanded: false,
key: Key('folder_mailbox_list'),
children: _buildListChildTileWidget(context, controller.folderMailboxTree.value.root)))
)
: SizedBox.shrink()
);
Widget _buildMailboxCategory(BuildContext context, MailboxCategories categories, MailboxNode mailboxNode) {
return Column(children: [
_buildHeaderMailboxCategory(context, categories),
AnimatedContainer(
duration: Duration(milliseconds: 400),
child: categories.getExpandMode(controller.mailboxCategoriesExpandMode.value) == ExpandMode.EXPAND
? _buildBodyMailboxCategory(context, categories, mailboxNode)
: Offstage())
]);
}
List<Widget> _buildListChildTileWidget(BuildContext context, MailboxNode parentNode) {
List<Widget> _buildListChildTileWidget(BuildContext context, MailboxNode parentNode, {MailboxNode? lastNode}) {
return parentNode.childrenItems
?.map((mailboxNode) => mailboxNode.hasChildren()
? Padding(
padding: EdgeInsets.only(left: 16),
child: TreeViewChild(
context,
key: Key('children_tree_mailbox_child'),
isExpanded: mailboxNode.expandMode == ExpandMode.EXPAND,
parent: Obx(() => (MailBoxFolderTileBuilder(
? TreeViewChild(
context,
_imagePaths,
mailboxNode,
allSelectMode: controller.currentSelectMode.value)
key: Key('children_tree_mailbox_child'),
isExpanded: mailboxNode.expandMode == ExpandMode.EXPAND,
parent: Obx(() => (MailBoxFolderTileBuilder(context, _imagePaths, mailboxNode, lastNode: lastNode,
mailboxNodeSelected: controller.mailboxDashBoardController.selectedMailbox.value)
..addOnOpenMailboxFolderClick((mailboxNode) => controller.openMailbox(context, mailboxNode.item))
..addOnExpandFolderActionClick((mailboxNode) => controller.toggleMailboxFolder(mailboxNode))
..addOnSelectMailboxFolderClick((mailboxNode) => controller.selectMailboxNode(mailboxNode)))
.build()),
children: _buildListChildTileWidget(context, mailboxNode)
).build()
: Obx(() => (MailBoxFolderTileBuilder(context, _imagePaths, mailboxNode, lastNode: lastNode,
mailboxNodeSelected: controller.mailboxDashBoardController.selectedMailbox.value)
..addOnOpenMailboxFolderClick((mailboxNode) => controller.openMailbox(context, mailboxNode.item))
..addOnExpandFolderActionClick((mailboxNode) => controller.toggleMailboxFolder(mailboxNode))
..addOnSelectMailboxFolderClick((mailboxNode) => controller.selectMailboxNode(mailboxNode)))
.build()),
children: _buildListChildTileWidget(context, mailboxNode)
).build())
: Padding(
padding: EdgeInsets.only(left: 16),
child: Obx(() => (MailBoxFolderTileBuilder(
context,
_imagePaths,
mailboxNode,
allSelectMode: controller.currentSelectMode.value)
..addOnOpenMailboxFolderClick((mailboxNode) => controller.openMailbox(context, mailboxNode.item))
..addOnSelectMailboxFolderClick((mailboxNode) => controller.selectMailboxNode(mailboxNode)))
.build(),
)
)
.build())
).toList() ?? <Widget>[];
}
Widget _buildInputSearchFormWidget(BuildContext context) {
return Padding(
padding: EdgeInsets.only(top: 16, bottom: 16),
padding: EdgeInsets.only(left: 8),
child: Row(
children: [
_buildBackSearchButton(context),
Expanded(child: (SearchAppBarWidget(
context,
_imagePaths,
_responsiveUtils,
controller.searchQuery.value,
controller.searchFocus,
controller.searchInputController,
hasBackButton: false,
hasSearchButton: true)
..addPadding(EdgeInsets.zero)
..setMargin(EdgeInsets.only(right: 16))
..addDecoration(BoxDecoration(borderRadius: BorderRadius.circular(12), color: AppColor.colorBgSearchBar))
..addIconClearText(SvgPicture.asset(_imagePaths.icClearTextSearch, width: 20, height: 20, fit: BoxFit.fill))
..setHintText(AppLocalizations.of(context).hint_search_mailboxes)
..addOnClearTextSearchAction(() => controller.clearSearchText())
..addOnTextChangeSearchAction((query) => controller.searchMailbox(query))
..addOnSearchTextAction((query) => controller.searchMailbox(query)))
.build())
buildIconWeb(
icon: SvgPicture.asset(_imagePaths.icBack, color: AppColor.colorTextButton, fit: BoxFit.fill),
onTap: () => controller.disableSearch(context)),
Expanded(child: (SearchAppBarWidget(context, _imagePaths, _responsiveUtils, controller.searchQuery.value,
controller.searchFocus, controller.searchInputController, hasBackButton: false, hasSearchButton: true)
..addPadding(EdgeInsets.zero)
..setMargin(EdgeInsets.only(right: 16))
..addDecoration(BoxDecoration(borderRadius: BorderRadius.circular(12), color: AppColor.colorBgSearchBar))
..addIconClearText(SvgPicture.asset(_imagePaths.icClearTextSearch, width: 20, height: 20, fit: BoxFit.fill))
..setHintText(AppLocalizations.of(context).hint_search_mailboxes)
..addOnClearTextSearchAction(() => controller.clearSearchText())
..addOnTextChangeSearchAction((query) => controller.searchMailbox(query))
..addOnSearchTextAction((query) => controller.searchMailbox(query)))
.build())
]
)
);
}
Widget _buildBackSearchButton(BuildContext context) {
return Padding(
padding: EdgeInsets.only(left: 5),
child: Material(
shape: CircleBorder(),
color: Colors.transparent,
child: IconButton(
splashRadius: 20,
color: AppColor.colorTextButton,
icon: SvgPicture.asset(_imagePaths.icBack, width: 20, height: 20, color: AppColor.colorTextButton, fit: BoxFit.fill),
onPressed: () => controller.disableSearch(context)
)
));
}
Widget _buildListMailboxSearched(BuildContext context, List<PresentationMailbox> listMailbox) {
return Container(
margin: _responsiveUtils.isDesktop(context)
? EdgeInsets.only(left: 16, right: 16)
: EdgeInsets.zero,
decoration: _responsiveUtils.isDesktop(context)
? BoxDecoration(borderRadius: BorderRadius.circular(14), color: Colors.white)
: null,
margin: EdgeInsets.zero,
color: _responsiveUtils.isDesktop(context) ? AppColor.colorBgDesktop : Colors.white,
child: ListView.builder(
padding: EdgeInsets.only(left: 16, right: 8),
key: Key('list_mailbox_searched'),
itemCount: listMailbox.length,
shrinkWrap: true,
primary: false,
itemBuilder: (context, index) => Obx(() => (MailboxSearchTileBuilder(
itemBuilder: (context, index) =>
Obx(() => (MailboxSearchTileBuilder(
_imagePaths,
listMailbox[index],
allSelectMode: controller.currentSelectMode.value,
lastMailbox: controller.listMailboxSearched.last)
..addOnOpenMailboxAction((mailbox) => controller.openMailbox(context, mailbox))
..addOnSelectMailboxActionClick((mailbox) => controller.selectMailbox(context, mailbox)))
..addOnSelectMailboxActionClick((mailbox) => controller.selectMailboxSearched(context, mailbox)))
.build()))
);
}
Widget _buildOptionSelectionMailbox(BuildContext context) {
if (_responsiveUtils.isDesktop(context)) {
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
boxShadow: [BoxShadow(color: AppColor.colorEmailAddressTag, spreadRadius: 1, blurRadius: 1, offset: Offset(0, 0.5))],
color: Colors.white),
margin: EdgeInsets.only(left: 10, bottom: 10, right: 10),
padding: EdgeInsets.all(8),
child: (BottomBarSelectionMailboxWidget(context, _imagePaths, controller.listMailboxSelected)
..addOnMailboxActionsClick((actions, listMailboxSelected) => controller.pressMailboxSelectionAction(context, actions, listMailboxSelected)))
.build(),
);
} else {
return Column(children: [
Divider(color: AppColor.lineItemListColor, height: 1, thickness: 0.2),
Padding(
padding: EdgeInsets.only(bottom: 30, top: 5),
child: (BottomBarSelectionMailboxWidget(context, _imagePaths, controller.listMailboxSelected)
return Column(children: [
Divider(color: AppColor.lineItemListColor, height: 1, thickness: 0.2),
Padding(
padding: EdgeInsets.symmetric(vertical: 16),
child: (BottomBarSelectionMailboxWidget(context, _imagePaths, controller.listMailboxSelected)
..addOnMailboxActionsClick((actions, listMailboxSelected) => controller.pressMailboxSelectionAction(context, actions, listMailboxSelected)))
.build()
)
]);
}
.build()
)
]);
}
Widget _buildVersionInformation(BuildContext context, PackageInfo packageInfo) {
return Container(
padding: EdgeInsets.symmetric(vertical: 16, horizontal: 16),
margin: EdgeInsets.only(bottom: 30),
padding: EdgeInsets.only(top: 4),
child: Text(
'${AppLocalizations.of(context).version} ${packageInfo.version}',
'v.${packageInfo.version}',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 16, color: AppColor.colorContentEmail, fontWeight: FontWeight.w500),
style: TextStyle(fontSize: 13, color: AppColor.colorContentEmail, fontWeight: FontWeight.w500),
),
);
}
lib/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart
+54 -18
View File
@@ -1,6 +1,8 @@
import 'package:core/core.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:model/model.dart';
import 'package:tmail_ui_user/features/mailbox/domain/extensions/presentation_mailbox_extension.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_displayed.dart';
@@ -13,17 +15,22 @@ typedef OnSelectMailboxFolderClick = void Function(MailboxNode);
class MailBoxFolderTileBuilder {
final _responsiveUtils = Get.find<ResponsiveUtils>();
final MailboxNode _mailboxNode;
final BuildContext _context;
final ImagePaths _imagePaths;
final SelectMode allSelectMode;
final MailboxDisplayed mailboxDisplayed;
final MailboxNode? lastNode;
final PresentationMailbox? mailboxNodeSelected;
OnExpandFolderActionClick? _onExpandFolderActionClick;
OnOpenMailboxFolderClick? _onOpenMailboxFolderClick;
OnSelectMailboxFolderClick? _onSelectMailboxFolderClick;
bool isHoverIcon = false;
MailBoxFolderTileBuilder(
this._context,
this._imagePaths,
@@ -32,6 +39,7 @@ class MailBoxFolderTileBuilder {
this.allSelectMode = SelectMode.INACTIVE,
this.mailboxDisplayed = MailboxDisplayed.mailbox,
this.lastNode,
this.mailboxNodeSelected,
}
);
@@ -55,20 +63,20 @@ class MailBoxFolderTileBuilder {
child: Container(
key: Key('mailbox_folder_tile'),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(0),
color: Colors.white
borderRadius: BorderRadius.circular(kIsWeb ? 10 : 0),
color: backgroundColorItem
),
padding: kIsWeb ? EdgeInsets.only(left: 8, right: 4) : EdgeInsets.zero,
child: MediaQuery(
data: MediaQueryData(padding: EdgeInsets.zero),
child: Column(children: [
ListTile(
hoverColor: Colors.transparent,
onTap: () => allSelectMode == SelectMode.ACTIVE
? _onSelectMailboxFolderClick?.call(_mailboxNode)
: _onOpenMailboxFolderClick?.call(_mailboxNode),
contentPadding: EdgeInsets.zero,
leading: allSelectMode == SelectMode.ACTIVE
? _buildSelectModeIcon()
: _buildMailboxIcon(),
leading: _buildLeadingIcon(),
title: _buildTitleFolderItem(),
trailing: _mailboxNode.hasChildren()
? Transform(
@@ -78,16 +86,16 @@ class MailBoxFolderTileBuilder {
_mailboxNode.expandMode == ExpandMode.EXPAND ? _imagePaths.icExpandFolder : _imagePaths.icCollapseFolder,
color: _mailboxNode.expandMode == ExpandMode.EXPAND ? AppColor.colorExpandMailbox : AppColor.colorCollapseMailbox,
fit: BoxFit.fill),
splashRadius: 15,
splashRadius: 10,
tooltip: _mailboxNode.expandMode == ExpandMode.EXPAND ? AppLocalizations.of(_context).collapse : AppLocalizations.of(_context).expand,
onTap: () => _onExpandFolderActionClick?.call(_mailboxNode)))
: _mailboxNode.item.getCountUnReadEmails().isNotEmpty
&& mailboxDisplayed == MailboxDisplayed.mailbox
&& !_mailboxNode.hasChildren()
? Padding(padding: EdgeInsets.only(right: 12), child: _buildCounter())
? SizedBox(width: 40)
: SizedBox.shrink()
),
if (lastNode?.item.id != _mailboxNode.item.id)
if (lastNode?.item.id != _mailboxNode.item.id && !kIsWeb)
Padding(
padding: EdgeInsets.only(left: allSelectMode == SelectMode.ACTIVE ? 50 : 35),
child: Divider(color: AppColor.lineItemListColor, height: 0.5, thickness: 0.2)),
@@ -97,6 +105,14 @@ class MailBoxFolderTileBuilder {
);
}
Widget _buildLeadingIcon() {
if (kIsWeb) {
return _mailboxNode.selectMode == SelectMode.ACTIVE ? _buildSelectModeIcon() : _buildMailboxIcon();
} else {
return allSelectMode == SelectMode.ACTIVE ? _buildSelectModeIcon() : _buildMailboxIcon();
}
}
Widget _buildTitleFolderItem() {
return Row(
children: [
@@ -112,8 +128,8 @@ class MailBoxFolderTileBuilder {
overflow: TextOverflow.ellipsis,
style: TextStyle(fontSize: 15, color: AppColor.colorNameEmail, fontWeight: FontWeight.normal),
))),
if (_mailboxNode.item.getCountUnReadEmails().isNotEmpty && mailboxDisplayed == MailboxDisplayed.mailbox && _mailboxNode.hasChildren())
Transform(transform: Matrix4.translationValues(30.0, 0.0, 0.0), child: _buildCounter())
if (_mailboxNode.item.getCountUnReadEmails().isNotEmpty && mailboxDisplayed == MailboxDisplayed.mailbox)
Transform(transform: Matrix4.translationValues(25.0, 0.0, 0.0), child: _buildCounter())
],
);
}
@@ -128,22 +144,42 @@ class MailBoxFolderTileBuilder {
}
Widget _buildMailboxIcon() {
return SvgPicture.asset(
'${_mailboxNode.item.getMailboxIcon(_imagePaths)}',
width: 28,
height: 28,
fit: BoxFit.fill
);
if (kIsWeb) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return InkWell(
onTap: () {},
onHover: (value) => setState(() => isHoverIcon = value),
child: isHoverIcon
? _buildSelectModeIcon()
: SvgPicture.asset('${_mailboxNode.item.getMailboxIcon(_imagePaths)}', width: 28, height: 28, fit: BoxFit.fill)
);
});
} else {
return SvgPicture.asset('${_mailboxNode.item.getMailboxIcon(_imagePaths)}', width: 28, height: 28, fit: BoxFit.fill);
}
}
Widget _buildSelectModeIcon() {
return Transform(
transform: Matrix4.translationValues(-10.0, 0.0, 0.0),
transform: Matrix4.translationValues(kIsWeb ? -8.0 : -10.0, 0.0, 0.0),
child: buildIconWeb(
icon: SvgPicture.asset(
_mailboxNode.selectMode == SelectMode.ACTIVE ? _imagePaths.icSelected : _imagePaths.icUnSelected,
width: kIsWeb ? 20 : 24,
height: kIsWeb ? 20 : 24,
fit: BoxFit.fill),
splashRadius: 15,
onTap: () => _onSelectMailboxFolderClick?.call(_mailboxNode)));
}
Color get backgroundColorItem {
if (kIsWeb) {
if (mailboxNodeSelected?.id == _mailboxNode.item.id) {
return AppColor.colorBgMailboxSelected;
}
return _responsiveUtils.isDesktop(_context) ? AppColor.colorBgDesktop : Colors.white;
} else {
return Colors.white;
}
}
}
lib/features/mailbox/presentation/widgets/mailbox_search_tile_builder.dart
+30 -16
View File
@@ -1,4 +1,5 @@
import 'package:core/core.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:model/model.dart';
@@ -14,6 +15,8 @@ class MailboxSearchTileBuilder {
final SelectMode allSelectMode;
final ImagePaths _imagePaths;
bool isHoverIcon = false;
OnOpenMailboxActionClick? _onOpenMailboxActionClick;
OnSelectMailboxActionClick? _onSelectMailboxActionClick;
@@ -42,10 +45,6 @@ class MailboxSearchTileBuilder {
child: Container(
key: Key('mailbox_list_tile'),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(0),
color: Colors.white
),
child: MediaQuery(
data: MediaQueryData(padding: EdgeInsets.zero),
child: Column(children: [
@@ -54,9 +53,7 @@ class MailboxSearchTileBuilder {
onTap: () => allSelectMode == SelectMode.ACTIVE
? _onSelectMailboxActionClick?.call(_presentationMailbox)
: _onOpenMailboxActionClick?.call(_presentationMailbox),
leading: allSelectMode == SelectMode.ACTIVE
? _buildSelectModeIcon()
: _buildMailboxIcon(),
leading: _buildLeadingIcon(),
title: Row(children: [
if (allSelectMode == SelectMode.ACTIVE)
Transform(
@@ -83,7 +80,7 @@ class MailboxSearchTileBuilder {
)
: null,
),
if (lastMailbox?.id != _presentationMailbox.id)
if (lastMailbox?.id != _presentationMailbox.id && !kIsWeb)
Padding(
padding: EdgeInsets.only(left: allSelectMode == SelectMode.ACTIVE ? 50 : 35),
child: Divider(color: AppColor.lineItemListColor, height: 0.5, thickness: 0.2)),
@@ -93,23 +90,40 @@ class MailboxSearchTileBuilder {
);
}
Widget _buildLeadingIcon() {
if (kIsWeb) {
return _presentationMailbox.selectMode == SelectMode.ACTIVE ? _buildSelectModeIcon() : _buildMailboxIcon();
} else {
return allSelectMode == SelectMode.ACTIVE ? _buildSelectModeIcon() : _buildMailboxIcon();
}
}
Widget _buildMailboxIcon() {
return SvgPicture.asset(
'${_presentationMailbox.getMailboxIcon(_imagePaths)}',
width: 28,
height: 28,
fit: BoxFit.fill
);
if (kIsWeb) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return InkWell(
onTap: () {},
onHover: (value) => setState(() => isHoverIcon = value),
child: isHoverIcon
? _buildSelectModeIcon()
: SvgPicture.asset('${_presentationMailbox.getMailboxIcon(_imagePaths)}', width: 28, height: 28, fit: BoxFit.fill)
);
});
} else {
return SvgPicture.asset('${_presentationMailbox.getMailboxIcon(_imagePaths)}', width: 28, height: 28, fit: BoxFit.fill);
}
}
Widget _buildSelectModeIcon() {
return Transform(
transform: Matrix4.translationValues(-10.0, 0.0, 0.0),
transform: Matrix4.translationValues(kIsWeb ? -8.0 : -10.0, 0.0, 0.0),
child: buildIconWeb(
icon: SvgPicture.asset(
_presentationMailbox.selectMode == SelectMode.ACTIVE ? _imagePaths.icSelected : _imagePaths.icUnSelected,
width: kIsWeb ? 20 : 24,
height: kIsWeb ? 20 : 24,
fit: BoxFit.fill),
splashRadius: 15,
onTap: () => _onSelectMailboxActionClick?.call(_presentationMailbox)));
}
}
lib/features/mailbox/presentation/widgets/user_information_widget_builder.dart
+7 -5
View File
@@ -1,5 +1,6 @@
import 'package:core/core.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get_utils/src/platform/platform.dart';
@@ -72,11 +73,12 @@ class UserInformationWidgetBuilder {
)
)
])),
Transform(
transform: Matrix4.translationValues(14.0, 0.0, 0.0),
child: IconButton(
icon: SvgPicture.asset(_imagePaths.icCollapseFolder, fit: BoxFit.fill, color: AppColor.colorCollapseMailbox),
onPressed: () => {}))
if (!kIsWeb)
Transform(
transform: Matrix4.translationValues(14.0, 0.0, 0.0),
child: IconButton(
icon: SvgPicture.asset(_imagePaths.icCollapseFolder, fit: BoxFit.fill, color: AppColor.colorCollapseMailbox),
onPressed: () => {}))
]),
);
}
lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart
+11 -28
View File
@@ -22,18 +22,19 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
key: controller.scaffoldKey,
drawer: ResponsiveWidget(
responsiveUtils: _responsiveUtils,
mobile: Container(child: MailboxView(),
width: _responsiveUtils.isPortrait(context) ? _responsiveUtils.getSizeScreenWidth(context) : _responsiveUtils.getSizeScreenWidth(context) / 2),
tablet: Container(child: MailboxView(), width: _responsiveUtils.getSizeScreenWidth(context) / 2),
mobile: _responsiveUtils.isPortrait(context)
? SizedBox(child: MailboxView(), width: double.infinity)
: SizedBox(child: MailboxView(), width: _responsiveUtils.defaultSizeDrawerWidthWeb),
tablet: SizedBox(child: MailboxView(), width: _responsiveUtils.defaultSizeDrawerWidthWeb),
tabletLarge: SizedBox.shrink(),
desktop: SizedBox.shrink()
),
drawerEnableOpenDragGesture: !_responsiveUtils.isDesktop(context),
drawerEnableOpenDragGesture: _responsiveUtils.isMobile(context) || _responsiveUtils.isTablet(context),
body: Stack(children: [
ResponsiveWidget(
responsiveUtils: _responsiveUtils,
desktop: _buildDesktopView(context),
tabletLarge: _buildTabletLargeView(context),
desktop: _buildLargeScreenView(context),
tabletLarge: _buildLargeScreenView(context),
tablet: ThreadView(),
mobile: ThreadView()
),
@@ -83,8 +84,8 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
}
}
Widget _buildDesktopView(BuildContext context) {
if (controller.isDrawerOpen && _responsiveUtils.isDesktop(context)) {
Widget _buildLargeScreenView(BuildContext context) {
if (controller.isDrawerOpen && (_responsiveUtils.isDesktop(context) || _responsiveUtils.isTabletLarge(context))) {
WidgetsBinding.instance?.addPostFrameCallback((_) {
controller.closeDrawer();
});
@@ -94,26 +95,8 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> with Ne
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 1, child: MailboxView()),
Expanded(flex: 3, child: _buildThreadAndEmailContainer(context)),
],
),
);
}
Widget _buildTabletLargeView(BuildContext context) {
if (controller.isDrawerOpen && _responsiveUtils.isTabletLarge(context)) {
WidgetsBinding.instance?.addPostFrameCallback((_) {
controller.closeDrawer();
});
}
return Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 2, child: MailboxView()),
Expanded(flex: 4, child: _buildThreadAndEmailContainer(context)),
SizedBox(child: MailboxView(), width: _responsiveUtils.defaultSizeDrawerWidthWeb),
Expanded(child: _buildThreadAndEmailContainer(context))
],
),
);
lib/features/thread/presentation/widgets/search_app_bar_widget.dart
+9 -22
View File
@@ -130,19 +130,12 @@ class SearchAppBarWidget {
}
Widget _buildClearTextSearchButton() {
return Material(
shape: CircleBorder(),
color: Colors.transparent,
child: IconButton(
splashRadius: 20,
padding: EdgeInsets.zero,
icon: _iconClearText ?? SvgPicture.asset(_imagePaths.icComposerClose, fit: BoxFit.fill),
onPressed: () {
_searchInputController?.clear();
_onClearTextSearchAction?.call();
}
)
);
return buildIconWeb(
icon: _iconClearText ?? SvgPicture.asset(_imagePaths.icComposerClose, width: 12, height: 12, fit: BoxFit.fill),
onTap: () {
_searchInputController?.clear();
_onClearTextSearchAction?.call();
});
}
Widget _buildSearchInputForm() {
@@ -168,14 +161,8 @@ class SearchAppBarWidget {
}
Widget _buildSearchButton() {
return Material(
shape: CircleBorder(),
color: Colors.transparent,
child: IconButton(
splashRadius: 20,
icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 18, height: 18, fit: BoxFit.fill),
onPressed: () => _onSearchTextAction?.call(_searchInputController?.text ?? '')
)
);
return buildIconWeb(
icon: SvgPicture.asset(_imagePaths.icSearchBar, width: 16, height: 16, fit: BoxFit.fill),
onTap: () => _onSearchTextAction?.call(_searchInputController?.text ?? ''));
}
}