TF-248 Update list email, email content for tablet

This commit is contained in:
dab246
2022-02-09 16:59:32 +07:00
committed by Dat H. Pham
parent 818d65b3a6
commit 2c8cd967c0
21 changed files with 216 additions and 93 deletions
+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="21" viewBox="0 0 24 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.2109 20.0947C13.7373 20.0947 14.167 19.8799 14.6826 19.3965L23.1582 11.3936C23.5664 11.0068 23.7061 10.5986 23.7061 10.2441C23.7061 9.87891 23.5771 9.48145 23.1582 9.08398L14.6826 1.15625C14.1133 0.619141 13.7588 0.393555 13.2324 0.393555C12.4805 0.393555 11.9434 0.984375 11.9434 1.7041V5.76465H11.6318C3.9082 5.76465 0.545898 10.7168 0.545898 18.6553C0.545898 19.5791 1.07227 20.0947 1.65234 20.0947C2.10352 20.0947 2.59766 19.9873 2.97363 19.2998C4.84277 15.7871 7.47461 14.7344 11.6318 14.7344H11.9434V18.8379C11.9434 19.5576 12.4805 20.0947 13.2109 20.0947ZM13.8232 17.7852C13.7373 17.7852 13.6729 17.7207 13.6729 17.624V13.4668C13.6729 13.2197 13.5654 13.1123 13.3184 13.1123H11.8789C6.77637 13.1123 3.52148 14.8848 2.25391 17.5811C2.22168 17.6562 2.2002 17.6885 2.14648 17.6885C2.10352 17.6885 2.07129 17.6562 2.07129 17.5703C2.28613 12.5 4.49902 7.38672 11.8789 7.38672H13.3184C13.5654 7.38672 13.6729 7.2793 13.6729 7.03223V2.76758C13.6729 2.68164 13.7373 2.61719 13.834 2.61719C13.8984 2.61719 13.9629 2.66016 14.0166 2.70312L21.665 10.04C21.7402 10.1152 21.7725 10.1797 21.7725 10.2441C21.7725 10.3086 21.751 10.3623 21.665 10.4482L14.0059 17.6885C13.9521 17.7529 13.8877 17.7852 13.8232 17.7852Z" fill="#007AFF"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.49936 4.91517L9.49939 4.91513L9.49619 4.91251L8.9612 4.47399C8.66129 4.21966 8.38572 4.04346 8.06568 3.93318C7.74668 3.82326 7.39549 3.78301 6.95068 3.78301H4.4458C3.64366 3.78301 2.98502 4.01297 2.52863 4.49842C2.07386 4.98214 1.84502 5.69295 1.84502 6.60352V17.3174C1.84502 18.2547 2.08294 18.9885 2.58821 19.4866C3.09302 19.9841 3.83498 20.217 4.77979 20.217H19.4839C20.3044 20.217 20.9802 19.9778 21.4494 19.4785C21.917 18.9808 22.155 18.2505 22.155 17.3174V8.29102C22.155 7.35748 21.9145 6.62393 21.4085 6.12513C20.9029 5.62676 20.1613 5.39141 19.2202 5.39141H10.7827C10.4979 5.39141 10.2805 5.35791 10.0861 5.28499C9.89158 5.21205 9.70919 5.09562 9.49936 4.91517ZM7.85741 6.02539L7.85797 6.02586L8.3941 6.4741L8.39452 6.47445C8.69093 6.7207 8.96868 6.89429 9.29146 7.00427C9.61293 7.11381 9.96792 7.15645 10.4136 7.15645H19.1938C19.5981 7.15645 19.8906 7.26628 20.0822 7.45704C20.2737 7.64762 20.3899 7.9442 20.3899 8.37012V8.69609H3.61006V6.68262C3.61006 6.27673 3.71634 5.99821 3.89309 5.82058C4.06972 5.64307 4.34362 5.53926 4.73584 5.53926H6.59033C6.86461 5.53926 7.07483 5.57447 7.266 5.6492C7.45818 5.72431 7.64156 5.8434 7.85741 6.02539ZM4.79736 18.452C4.38745 18.452 4.09799 18.3437 3.91036 18.156C3.72276 17.9684 3.61006 17.6746 3.61006 17.2471V10.3732H20.3899V17.2559C20.3899 17.6769 20.274 17.9687 20.0831 18.156C19.8917 18.3438 19.599 18.452 19.1938 18.452H4.79736Z" fill="#99A2AD" stroke="#999FAD" stroke-width="0.35"/>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

+3
View File
@@ -0,0 +1,3 @@
<svg width="30" height="21" viewBox="0 0 30 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.2568 20.0947C11.9873 20.0947 12.5137 19.5576 12.5137 18.8379V16.9258L15.1348 19.3965C15.6504 19.8799 16.0801 20.0947 16.6064 20.0947C17.3369 20.0947 17.8633 19.5576 17.8633 18.8379V14.7344H18.1748C22.3428 14.7344 24.9639 15.7871 26.8438 19.2998C27.2197 19.9873 27.7139 20.0947 28.165 20.0947C28.7344 20.0947 29.2715 19.5791 29.2715 18.6553C29.2715 10.7168 25.8984 5.76465 18.1748 5.76465H17.8633V1.7041C17.8633 0.984375 17.3369 0.393555 16.585 0.393555C16.0586 0.393555 15.7041 0.619141 15.1348 1.15625L12.5137 3.60547V1.7041C12.5137 0.984375 11.9873 0.393555 11.2354 0.393555C10.709 0.393555 10.3545 0.619141 9.78516 1.15625L1.29883 9.08398C0.879883 9.48145 0.761719 9.87891 0.761719 10.2441C0.761719 10.5986 0.890625 11.0068 1.29883 11.3936L9.78516 19.3965C10.29 19.8799 10.7305 20.0947 11.2568 20.0947ZM15.9941 17.7852C15.9297 17.7852 15.8652 17.7529 15.8008 17.6885L8.15234 10.4482C8.06641 10.3623 8.03418 10.3086 8.03418 10.2441C8.03418 10.1797 8.06641 10.1152 8.15234 10.04L15.8008 2.70312C15.8545 2.66016 15.9189 2.61719 15.9834 2.61719C16.0801 2.61719 16.1338 2.68164 16.1338 2.76758V7.03223C16.1338 7.2793 16.252 7.38672 16.499 7.38672H17.9385C25.3076 7.38672 27.5312 12.5 27.7461 17.5703C27.7461 17.6562 27.7139 17.6885 27.6602 17.6885C27.6172 17.6885 27.5957 17.6562 27.5635 17.5811C26.2959 14.8848 23.041 13.1123 17.9385 13.1123H16.499C16.252 13.1123 16.1338 13.2197 16.1338 13.4668V17.624C16.1338 17.7207 16.0801 17.7852 15.9941 17.7852ZM10.4512 17.6885L2.80273 10.4482C2.7168 10.3623 2.68457 10.3086 2.68457 10.2441C2.68457 10.1797 2.7168 10.1152 2.80273 10.04L10.4512 2.70312C10.5049 2.66016 10.5693 2.61719 10.6338 2.61719C10.7305 2.61719 10.7842 2.68164 10.7842 2.76758V5.2168L6.65918 9.08398C6.24023 9.48145 6.11133 9.87891 6.11133 10.2441C6.11133 10.5986 6.25098 11.0068 6.65918 11.3936L10.7842 15.293V17.624C10.7842 17.7207 10.7305 17.7852 10.6338 17.7852C10.5801 17.7852 10.5156 17.7529 10.4512 17.6885Z" fill="#007AFF"/>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="21" viewBox="0 0 24 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5635 20.0947C11.2939 20.0947 11.8203 19.5576 11.8203 18.8379V14.7344H12.1318C16.2998 14.7344 18.9209 15.7871 20.8008 19.2998C21.1768 19.9873 21.6709 20.0947 22.1221 20.0947C22.6914 20.0947 23.2285 19.5791 23.2285 18.6553C23.2285 10.7168 19.8662 5.76465 12.1318 5.76465H11.8203V1.7041C11.8203 0.984375 11.2939 0.393555 10.542 0.393555C10.0156 0.393555 9.66113 0.619141 9.0918 1.15625L0.616211 9.08398C0.197266 9.48145 0.0683594 9.87891 0.0683594 10.2441C0.0683594 10.5986 0.208008 11.0068 0.616211 11.3936L9.0918 19.3965C9.60742 19.8799 10.0371 20.0947 10.5635 20.0947ZM9.95117 17.7852C9.88672 17.7852 9.82227 17.7529 9.76855 17.6885L2.10938 10.4482C2.02344 10.3623 1.99121 10.3086 1.99121 10.2441C1.99121 10.1797 2.02344 10.1152 2.10938 10.04L9.75781 2.70312C9.81152 2.66016 9.87598 2.61719 9.94043 2.61719C10.0371 2.61719 10.0908 2.68164 10.0908 2.76758V7.03223C10.0908 7.2793 10.209 7.38672 10.4561 7.38672H11.8955C19.2646 7.38672 21.4883 12.5 21.7031 17.5703C21.7031 17.6562 21.6709 17.6885 21.6172 17.6885C21.5742 17.6885 21.5527 17.6562 21.5205 17.5811C20.2529 14.8848 16.998 13.1123 11.8955 13.1123H10.4561C10.209 13.1123 10.0908 13.2197 10.0908 13.4668V17.624C10.0908 17.7207 10.0371 17.7852 9.95117 17.7852Z" fill="#007AFF"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

+3
View File
@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.2239 9.58899C20.7496 9.58899 22.0143 8.32432 22.0143 6.79041C22.0143 5.26466 20.7496 4 19.2239 4C17.69 4 16.4253 5.26466 16.4253 6.79041C16.4253 8.32432 17.69 9.58899 19.2239 9.58899ZM18.0734 20C19.8032 20 20.8149 18.9801 20.8149 17.1362V10.462C20.2193 10.7557 19.5502 10.8618 18.873 10.7721V16.5324L14.8343 12.5263L17.1596 10.2417C16.6619 9.94799 16.2376 9.54003 15.9276 9.0668L12.256 12.6976C11.9296 13.0158 11.6849 13.1464 11.4156 13.1464C11.1464 13.1464 10.9016 13.0158 10.5752 12.6976L5.04335 7.22285H15.2585C15.1443 6.57012 15.2422 5.84396 15.5196 5.24018H4.74962C3.01989 5.24018 2 6.25191 2 8.10403V17.1362C2 18.9883 3.01989 20 4.88016 20H18.0734ZM3.94187 16.5487V8.54462L7.98878 12.5263L3.94187 16.5487ZM17.8531 18.0173H4.96175C4.93728 18.0173 4.92096 18.0092 4.90464 18.0092L9.21265 13.7256L9.52269 14.0357C10.1428 14.6395 10.7547 14.9169 11.4156 14.9169C12.0765 14.9169 12.6884 14.6395 13.3004 14.0357L13.6186 13.7256L17.9266 18.0092C17.9021 18.0092 17.8776 18.0173 17.8531 18.0173Z" fill="#99A2AD"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@@ -67,6 +67,7 @@ extension AppColor on Color {
static const colorTextButton = Color(0xFF007AFF);
static const colorHintSearchBar = Color(0xFF818C99);
static const colorBgSearchBar = Color(0xFFEBEDF0);
static const colorShadowBgContentEmail = Color(0x14000000);
static const mapGradientColor = [
[Color(0xFF21D4FD), Color(0xFFB721FF)],
@@ -61,6 +61,11 @@ class ImagePaths {
String get icFlagV2 => _getImagePath('ic_flag_v2.svg');
String get icReadToast => _getImagePath('ic_read_toast.svg');
String get icUnreadToast => _getImagePath('ic_unread_toast.svg');
String get icReplyAllV2 => _getImagePath('ic_reply_all_v2.svg');
String get icReplyV2 => _getImagePath('ic_reply_v2.svg');
String get icForwardV2 => _getImagePath('ic_forward_v2.svg');
String get icMoveEmail => _getImagePath('ic_move_email.svg');
String get icUnreadEmail => _getImagePath('ic_unread_email.svg');
String _getImagePath(String imageName) {
return AssetsPaths.images + imageName;
@@ -2,8 +2,9 @@ import 'package:flutter/widgets.dart';
class ResponsiveUtils {
static const int minDesktopWidth = 1200;
static const int minDesktopWidth = 1366;
static const int minTabletWidth = 600;
static const int minTabletLargeWidth = 800;
static const double _loginTextFieldWidthSmallScreen = 280.0;
static const double _loginTextFieldWidthLargeScreen = 320.0;
@@ -20,11 +21,15 @@ class ResponsiveUtils {
double getSizeHeightScreen(BuildContext context) => MediaQuery.of(context).size.height;
double getMinSizeScreen(BuildContext context) => MediaQuery.of(context).size.shortestSide;
bool isMobile(BuildContext context) => getSizeWidthScreen(context) < minTabletWidth;
bool isTablet(BuildContext context) => getSizeWidthScreen(context) >= minTabletWidth && getSizeWidthScreen(context) < minDesktopWidth;
bool isTablet(BuildContext context) => getSizeWidthScreen(context) >= minTabletWidth && getSizeWidthScreen(context) < minTabletLargeWidth;
bool isDesktop(BuildContext context) => getSizeWidthScreen(context) >= minDesktopWidth;
bool isDesktop(BuildContext context) => getSizeWidthScreen(context) > minDesktopWidth;
bool isTabletLarge(BuildContext context) => getMinSizeScreen(context) >= minTabletLargeWidth && getMinSizeScreen(context) <= minDesktopWidth;
bool isPortrait(BuildContext context) => MediaQuery.of(context).orientation == Orientation.portrait;
@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
class ResponsiveWidget extends StatelessWidget {
final Widget mobile;
final Widget tablet;
final Widget? tabletLarge;
final Widget? desktop;
final ResponsiveUtils responsiveUtils;
@@ -13,6 +14,7 @@ class ResponsiveWidget extends StatelessWidget {
required this.mobile,
required this.tablet,
this.desktop,
this.tabletLarge,
required this.responsiveUtils,
}) : super(key: key);
@@ -23,6 +25,8 @@ class ResponsiveWidget extends StatelessWidget {
return mobile;
} else if (responsiveUtils.isDesktop(context)) {
return desktop ?? tablet;
} else if (responsiveUtils.isTabletLarge(context)) {
return tabletLarge ?? tablet;
} else if (responsiveUtils.isTablet(context)) {
return tablet;
} else {
@@ -161,7 +161,8 @@ class EmailController extends BaseController {
if (success is MarkAsEmailReadSuccess
&& success.readActions == ReadActions.markAsUnread
&& Get.context != null
&& !responsiveUtils.isDesktop(Get.context!)) {
&& !responsiveUtils.isDesktop(Get.context!)
&& !responsiveUtils.isTabletLarge(Get.context!)) {
backToThreadView();
}
}
@@ -170,7 +171,8 @@ class EmailController extends BaseController {
if (failure is MarkAsEmailReadFailure
&& failure.readActions == ReadActions.markAsUnread
&& Get.context != null
&& !responsiveUtils.isDesktop(Get.context!)) {
&& !responsiveUtils.isDesktop(Get.context!)
&& !responsiveUtils.isTabletLarge(Get.context!)) {
backToThreadView();
}
}
+32 -11
View File
@@ -1,7 +1,6 @@
import 'dart:io';
import 'package:core/core.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
@@ -11,7 +10,6 @@ import 'package:tmail_ui_user/features/email/presentation/widgets/app_bar_mail_w
import 'package:tmail_ui_user/features/email/presentation/widgets/attachment_file_tile_builder.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/attachments_place_holder_loading_widget.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/bottom_bar_mail_widget_builder.dart';
import 'package:model/extensions/list_attachment_extension.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/email_content_item_builder.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/email_content_place_holder_loading_widget.dart';
import 'package:tmail_ui_user/features/email/presentation/widgets/sender_and_receiver_information_tile_builder.dart';
@@ -63,14 +61,18 @@ class EmailView extends GetView {
Widget _buildBottomBar(BuildContext context) {
return Padding(
padding: EdgeInsets.only(left: 6, top: 6, right: 6, bottom: 6),
child: (BottomBarMailWidgetBuilder(context, imagePaths, responsiveUtils)
child: (BottomBarMailWidgetBuilder(
context,
imagePaths,
responsiveUtils,
emailController.mailboxDashBoardController.selectedEmail.value)
..addOnPressEmailAction((emailActionType) => emailController.pressEmailAction(emailActionType)))
.build());
}
Widget _buildEmailBody(BuildContext context) {
return Container(
color: AppColor.bgMessenger,
color: Colors.white,
margin: EdgeInsets.zero,
alignment: Alignment.topCenter,
child: Obx(() => emailController.mailboxDashBoardController.selectedEmail.value != null
@@ -80,14 +82,17 @@ class EmailView extends GetView {
margin: EdgeInsets.zero,
width: double.infinity,
alignment: Alignment.center,
padding: EdgeInsets.all(16),
color: AppColor.bgMessenger,
padding: EdgeInsets.only(
left: responsiveUtils.isMobile(context) ? 16 : 24,
right: responsiveUtils.isMobile(context) ? 16 : 24,
bottom: responsiveUtils.isMobile(context) ? 16 : 24,
top: responsiveUtils.isMobile(context) ? 10 : 16),
color: Colors.white,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: [
_buildEmailSubject(),
_buildEmailMessage(context),
])
))
@@ -105,19 +110,31 @@ class EmailView extends GetView {
Widget _buildEmailSubject() {
return Padding(
padding: EdgeInsets.only(left: 8, top: 4, bottom: 16),
padding: EdgeInsets.only(left: 8, top: 25, bottom: 16),
child: Text(
'${emailController.mailboxDashBoardController.selectedEmail.value?.getEmailTitle()}',
style: TextStyle(fontSize: 18, color: AppColor.mailboxTextColor, fontWeight: FontWeight.w500)
style: TextStyle(fontSize: 22, color: AppColor.colorNameEmail, fontWeight: FontWeight.w700)
));
}
Widget _buildEmailMessage(BuildContext context) {
return Container(
padding: EdgeInsets.only(left: 12, right: 12, top: 16, bottom: 16),
padding: EdgeInsets.only(
bottom: responsiveUtils.isMobile(context) ? 16 : 24,
left: responsiveUtils.isMobile(context) ? 16 : 24,
right: responsiveUtils.isMobile(context) ? 16 : 24,
top: 10),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
borderRadius: BorderRadius.circular(10),
boxShadow: [
BoxShadow(
color: AppColor.colorShadowBgContentEmail,
spreadRadius: 3,
blurRadius: 3,
offset: Offset(0, 2), // changes position of shadow
),
],
color: Colors.white),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
@@ -131,6 +148,10 @@ class EmailView extends GetView {
emailController.emailAddressExpandMode.value)
.onOpenExpandAddressReceiverActionClick(() => emailController.toggleDisplayEmailAddressAction(expandMode: ExpandMode.EXPAND))
.build()),
Padding(
padding: EdgeInsets.zero,
child: Divider(color: AppColor.lineItemListColor, height: 1, thickness: 0.1)),
_buildEmailSubject(),
_buildAttachments(context),
_buildListEmailContent(),
],
@@ -57,12 +57,13 @@ class AppBarMailWidgetBuilder {
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.end,
children: [
if (!_responsiveUtils.isDesktop(_context) || Get.currentRoute != AppRoutes.MAILBOX_DASHBOARD)
if ((!_responsiveUtils.isDesktop(_context) && !_responsiveUtils.isTabletLarge(_context))
|| Get.currentRoute != AppRoutes.MAILBOX_DASHBOARD)
Expanded(child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children:[_buildBackButton()])),
_buildListOptionButton(),
if (_presentationEmail != null) _buildListOptionButton(),
]
)
)
@@ -94,31 +95,31 @@ class AppBarMailWidgetBuilder {
// _onBackActionClick!();
// }
// }),
IconButton(
key: Key('button_mark_as_unread_email'),
color: AppColor.baseTextColor,
icon: SvgPicture.asset(_imagePaths.icEyeDisable, color: AppColor.baseTextColor, fit: BoxFit.fill),
onPressed: () {
if (_onUnreadEmailActionClick != null && _presentationEmail != null && _presentationEmail!.isReadEmail()) {
_onUnreadEmailActionClick!(_presentationEmail!);
}
}),
IconButton(
key: Key('button_mark_as_star_email'),
icon: SvgPicture.asset(
(_presentationEmail != null && _presentationEmail!.isFlaggedEmail())
? _imagePaths.icFlagged
: _imagePaths.icFlag,
fit: BoxFit.fill),
(_presentationEmail != null && _presentationEmail!.isFlaggedEmail())
? _imagePaths.icStar
: _imagePaths.icUnStar,
fit: BoxFit.fill),
onPressed: () {
if (_markAsStarActionClick != null && _presentationEmail != null) {
_markAsStarActionClick!(_presentationEmail!);
}
}),
IconButton(
key: Key('button_mark_as_unread_email'),
color: AppColor.baseTextColor,
icon: SvgPicture.asset(_imagePaths.icUnreadEmail, fit: BoxFit.fill),
onPressed: () {
if (_onUnreadEmailActionClick != null && _presentationEmail != null && _presentationEmail!.isReadEmail()) {
_onUnreadEmailActionClick!(_presentationEmail!);
}
}),
IconButton(
key: Key('button_move_to_mailbox_email'),
color: AppColor.baseTextColor,
icon: SvgPicture.asset(_imagePaths.icFolder, color: AppColor.baseTextColor, fit: BoxFit.fill),
icon: SvgPicture.asset(_imagePaths.icMoveEmail, fit: BoxFit.fill),
onPressed: () {
if (_onMoveToMailboxActionClick != null && _presentationEmail != null) {
_onMoveToMailboxActionClick!(_presentationEmail!);
@@ -75,15 +75,13 @@ class _AttachmentsPlaceHolderLoadingState extends State<AttachmentsPlaceHolderLo
children: [
Row(children: [
_placeHolderAttachment(context),
SizedBox(width: 16),
_placeHolderAttachment(context),
if (!widget.responsiveUtils.isMobileDevice(context))
if (widget.responsiveUtils.isDesktop(context))
SizedBox(width: 16),
if (!widget.responsiveUtils.isMobileDevice(context))
if (widget.responsiveUtils.isDesktop(context))
_placeHolderAttachment(context),
if (!widget.responsiveUtils.isMobileDevice(context) && widget.responsiveUtils.isTablet(context))
if (widget.responsiveUtils.isDesktop(context))
SizedBox(width: 16),
if (!widget.responsiveUtils.isMobileDevice(context) && widget.responsiveUtils.isTablet(context))
if (widget.responsiveUtils.isDesktop(context))
_placeHolderAttachment(context),
]),
],
@@ -1,6 +1,5 @@
import 'package:core/core.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:model/model.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
@@ -11,6 +10,7 @@ class BottomBarMailWidgetBuilder {
final BuildContext _context;
final ImagePaths _imagePaths;
final ResponsiveUtils _responsiveUtils;
final PresentationEmail? _presentationEmail;
OnPressEmailActionClick? _onPressEmailActionClick;
@@ -18,6 +18,7 @@ class BottomBarMailWidgetBuilder {
this._context,
this._imagePaths,
this._responsiveUtils,
this._presentationEmail,
);
void addOnPressEmailAction(OnPressEmailActionClick onPressEmailActionClick) {
@@ -31,7 +32,7 @@ class BottomBarMailWidgetBuilder {
color: Colors.white,
child: MediaQuery(
data: MediaQueryData(padding: EdgeInsets.zero),
child: _buildListOptionButton()
child: _presentationEmail != null ? _buildListOptionButton() : SizedBox.shrink()
)
);
}
@@ -41,24 +42,51 @@ class BottomBarMailWidgetBuilder {
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
(ButtonBuilder(_imagePaths.icReplyAll)
(ButtonBuilder(_imagePaths.icReplyAllV2)
..key(Key('button_reply_all_message'))
..size(20)
..paddingIcon(EdgeInsets.only(
top: _responsiveUtils.isMobileDevice(_context) ? 10 : 16,
bottom: _responsiveUtils.isMobileDevice(_context) ? 8 : 16,
right: 5))
..textStyle(TextStyle(
fontWeight: FontWeight.w500,
fontSize: _responsiveUtils.isMobileDevice(_context) ? 13 : 16,
color: AppColor.colorTextButton))
..onPressActionClick(() {
if (_onPressEmailActionClick != null) {
_onPressEmailActionClick!(EmailActionType.replyAll);
}})
..text(AppLocalizations.of(_context).reply_all, isVertical: _responsiveUtils.isMobile(_context)))
.build(),
(ButtonBuilder(_imagePaths.icReply)
(ButtonBuilder(_imagePaths.icReplyV2)
..key(Key('button_reply_message'))
..size(20)
..paddingIcon(EdgeInsets.only(
top: _responsiveUtils.isMobileDevice(_context) ? 10 : 16,
bottom: _responsiveUtils.isMobileDevice(_context) ? 8 : 16,
right: 5))
..textStyle(TextStyle(
fontWeight: FontWeight.w500,
fontSize: _responsiveUtils.isMobileDevice(_context) ? 13 : 16,
color: AppColor.colorTextButton))
..onPressActionClick(() {
if (_onPressEmailActionClick != null) {
_onPressEmailActionClick!(EmailActionType.reply);
}})
..text(AppLocalizations.of(_context).reply, isVertical: _responsiveUtils.isMobile(_context)))
.build(),
(ButtonBuilder(_imagePaths.icForward)
(ButtonBuilder(_imagePaths.icForwardV2)
..key(Key('button_forward_message'))
..size(20)
..paddingIcon(EdgeInsets.only(
top: _responsiveUtils.isMobileDevice(_context) ? 10 : 16,
bottom: _responsiveUtils.isMobileDevice(_context) ? 8 : 16,
right: 5))
..textStyle(TextStyle(
fontWeight: FontWeight.w500,
fontSize: _responsiveUtils.isMobileDevice(_context) ? 13 : 16,
color: AppColor.colorTextButton))
..onPressActionClick(() {
if (_onPressEmailActionClick != null) {
_onPressEmailActionClick!(EmailActionType.forward);
@@ -43,36 +43,51 @@ class SenderAndReceiverInformationTileBuilder {
child: MediaQuery(
data: MediaQueryData(padding: EdgeInsets.zero),
child: ListTile(
contentPadding: EdgeInsets.zero,
leading: Transform(
transform: Matrix4.translationValues(-15.0, -8.0, 0.0),
transform: Matrix4.translationValues(0.0, 0.0, 0.0),
child: (AvatarBuilder()
..text('${_presentationEmail!.getAvatarText()}')
..textColor(Colors.white)
..avatarColor(_presentationEmail?.avatarColors)
..size(40))
// .iconStatus(_imagePaths.icOffline)
.build()),
title: Transform(
transform: Matrix4.translationValues(-15.0, 0.0, 0.0),
child: Text(
'${AppLocalizations.of(_context).from_email_address_prefix}: ${_presentationEmail!.getSenderName()}',
style: TextStyle(fontSize: 16, color: AppColor.nameUserColor, fontWeight: FontWeight.w500),
)),
transform: Matrix4.translationValues(0.0, 0.0, 0.0),
child: Row(children: [
Expanded(child: Text(
'${_presentationEmail!.getSenderName()}',
style: TextStyle(fontSize: 17, color: AppColor.colorNameEmail, fontWeight: FontWeight.w500),
)),
Padding(
padding: EdgeInsets.only(left: 8),
child: Text(
'${_presentationEmail!.getReceivedAt(Localizations.localeOf(_context).toLanguageTag())}',
maxLines: 1,
overflow:TextOverflow.ellipsis,
style: TextStyle(fontSize: 15, color: AppColor.colorContentEmail)))
])),
subtitle: Transform(
transform: Matrix4.translationValues(-15.0, 0.0, 0.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (_presentationEmail!.to.numberEmailAddress() > 0) _buildAddressToReceiverWidget(),
if (_presentationEmail!.cc.numberEmailAddress() > 0) _buildAddressCcReceiverWidget(),
if (_presentationEmail!.bcc.numberEmailAddress() > 0) _buildAddressBccReceiverWidget(),
transform: Matrix4.translationValues(0.0, 0.0, 0.0),
child: Row(children: [
Expanded(child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (_presentationEmail!.to.numberEmailAddress() > 0) _buildAddressToReceiverWidget(),
if (_presentationEmail!.cc.numberEmailAddress() > 0) _buildAddressCcReceiverWidget(),
if (_presentationEmail!.bcc.numberEmailAddress() > 0) _buildAddressBccReceiverWidget(),
],
)),
if (_presentationEmail?.hasAttachment == true)
Padding(
padding: EdgeInsets.only(top: 6),
child: Text(
'${_presentationEmail!.getReceivedAt(Localizations.localeOf(_context).toLanguageTag(), pattern: 'dd/MM/yyyy h:mm a')}',
style: TextStyle(fontSize: 12, color: AppColor.baseTextColor),
))
],
))
padding: EdgeInsets.only(left: 8),
child: (ButtonBuilder(_imagePaths.icAttachment)
..paddingIcon(EdgeInsets.zero)
..size(16))
.build()),
]))
)
)
);
@@ -189,7 +189,7 @@ class MailboxController extends BaseController {
mailboxDashBoardController.setSelectedMailbox(presentationMailboxSelected);
mailboxDashBoardController.clearSelectedEmail();
if (responsiveUtils.isMobileDevice(context)) {
if (!responsiveUtils.isDesktop(context)) {
mailboxDashBoardController.closeDrawer();
}
}
@@ -14,31 +14,53 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> {
Widget build(BuildContext context) {
return Scaffold(
key: controller.scaffoldKey,
drawer: responsiveUtils.isMobileDevice(context)
? Container(
drawer: ResponsiveWidget(
responsiveUtils: responsiveUtils,
mobile: Container(
child: MailboxView(),
width: responsiveUtils.isPortrait(context)
? responsiveUtils.getSizeWidthScreen(context)
: responsiveUtils.getSizeWidthScreen(context) / 2)
: null,
drawerEnableOpenDragGesture: responsiveUtils.isMobileDevice(context),
body: Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
if (!responsiveUtils.isMobileDevice(context))
Expanded(
flex: responsiveUtils.isDesktop(context) ? 1 : 2,
child: MailboxView()),
Expanded(
flex: responsiveUtils.isDesktop(context) ? 1 : 3,
child: ThreadView(),
),
if (responsiveUtils.isDesktop(context)) Expanded(flex: 2, child: EmailView()),
],
),
? responsiveUtils.getSizeWidthScreen(context)
: responsiveUtils.getSizeWidthScreen(context) / 2),
tablet: Container(
child: MailboxView(),
width: responsiveUtils.getSizeWidthScreen(context) * 0.35),
desktop: null
),
drawerEnableOpenDragGesture: !responsiveUtils.isDesktop(context),
body: ResponsiveWidget(
responsiveUtils: responsiveUtils,
desktop: Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(flex: 1, child: MailboxView()),
Expanded(
flex: 1,
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 16),
child: ThreadView(),
)),
Expanded(flex: 2, child: EmailView()),
],
),
),
tabletLarge: Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
width: responsiveUtils.getSizeWidthScreen(context) * 0.35,
padding: EdgeInsets.symmetric(horizontal: 16),
child: ThreadView()
),
Expanded(child: EmailView()),
],
),
),
tablet: ThreadView(),
mobile: ThreadView()),
);
}
}
@@ -297,7 +297,7 @@ class ThreadController extends BaseController {
void previewEmail(BuildContext context, PresentationEmail presentationEmailSelected) {
mailboxDashBoardController.setSelectedEmail(presentationEmailSelected);
if (!responsiveUtils.isDesktop(context)) {
if (!responsiveUtils.isDesktop(context) && !responsiveUtils.isTabletLarge(context)) {
goToEmail(context);
}
}
@@ -74,7 +74,9 @@ class ThreadView extends GetWidget<ThreadController> {
),
floatingActionButton: Obx(() => !controller.isSearchActive() && !controller.isSelectionEnabled()
? Container(
padding: EdgeInsets.only(bottom: controller.isSelectionEnabled() ? 80 : 0),
padding: EdgeInsets.only(bottom: controller.isSelectionEnabled()
? 80
: responsiveUtils.isMobileDevice(context) ? 0 : 16),
child: Align(
alignment: Alignment.bottomRight,
child: ScrollingFloatingButtonAnimated(
@@ -2,7 +2,6 @@
import 'package:core/core.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:model/mailbox/presentation_mailbox.dart';
import 'package:model/model.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
@@ -169,11 +168,14 @@ class AppBarThreadWidgetBuilder {
if (_responsiveUtils.isTablet(_context)) {
width = width * 0.7;
widthSiblingsWidget = 300;
} else if (_responsiveUtils.isTabletLarge(_context)) {
width = width * 0.35;
widthSiblingsWidget = 250;
} else if (_responsiveUtils.isDesktop(_context)) {
width = width * 0.2;
widthSiblingsWidget = 300;
}
final maxWidth = width - widthSiblingsWidget;
final maxWidth = width > widthSiblingsWidget ? width - widthSiblingsWidget : 0.0;
return maxWidth;
}
}
@@ -76,7 +76,8 @@ class BottomBarThreadSelectionWidget {
}})
..text(AppLocalizations.of(_context).move, isVertical: _responsiveUtils.isMobile(_context)))
.build(),
(ButtonBuilder(_imagePaths.icSpamV2)
if (!_responsiveUtils.isDesktop(_context) && !_responsiveUtils.isTabletLarge(_context))
(ButtonBuilder(_imagePaths.icSpamV2)
..key(Key('button_spam_email'))
..paddingIcon(EdgeInsets.all(8))
..textStyle(TextStyle(fontSize: 12, color: AppColor.colorTextButton))
@@ -86,7 +87,8 @@ class BottomBarThreadSelectionWidget {
}})
..text(AppLocalizations.of(_context).spam, isVertical: _responsiveUtils.isMobile(_context)))
.build(),
(ButtonBuilder(_imagePaths.icDeleteV2)
if (!_responsiveUtils.isDesktop(_context) && !_responsiveUtils.isTabletLarge(_context))
(ButtonBuilder(_imagePaths.icDeleteV2)
..key(Key('button_delete_email'))
..paddingIcon(EdgeInsets.all(8))
..textStyle(TextStyle(fontSize: 12, color: AppColor.colorTextButton))