From 982e20bddfbef31f0a05319bb16f3205dff443b3 Mon Sep 17 00:00:00 2001 From: hieubt Date: Tue, 17 Oct 2023 17:30:33 +0700 Subject: [PATCH] TF-1801 Add attachment list items (cherry picked from commit bdbe545541665b687785dcf167e26a228b978d19) --- .../attachment_list_item_widget_styles.dart | 33 +++++ .../attachment_list_item_widget.dart | 114 ++++++++++++++++++ 2 files changed, 147 insertions(+) create mode 100644 lib/features/email/presentation/styles/attachment/attachment_list_item_widget_styles.dart create mode 100644 lib/features/email/presentation/widgets/attachment_list/attachment_list_item_widget.dart diff --git a/lib/features/email/presentation/styles/attachment/attachment_list_item_widget_styles.dart b/lib/features/email/presentation/styles/attachment/attachment_list_item_widget_styles.dart new file mode 100644 index 000000000..f226b28b0 --- /dev/null +++ b/lib/features/email/presentation/styles/attachment/attachment_list_item_widget_styles.dart @@ -0,0 +1,33 @@ + +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:flutter/material.dart'; + +class AttachmentListItemWidgetStyle { + static const double height = 60; + static const double iconSize = 44; + static const double space = 8; + static const double downloadIconSize = 24; + static const double fileTitleBottomSpace = 4; + + static const EdgeInsetsGeometry contentPadding = EdgeInsetsDirectional.all(8); + static const EdgeInsetsGeometry fileTitlePadding = EdgeInsetsDirectional.all(4); + static const EdgeInsetsGeometry downloadIconPadding = EdgeInsets.only(right: 13.0); + + static const Color downloadIconColor = AppColor.primaryColor; + + static const TextStyle labelTextStyle = TextStyle( + fontSize: 14, + color: AppColor.attachmentFileNameColor, + fontWeight: FontWeight.normal + ); + static const TextStyle dotsLabelTextStyle = TextStyle( + fontSize: 12, + color: AppColor.attachmentFileNameColor, + fontWeight: FontWeight.normal + ); + static const TextStyle sizeLabelTextStyle = TextStyle( + fontSize: 12, + color: AppColor.attachmentFileSizeColor, + fontWeight: FontWeight.normal + ); +} \ No newline at end of file diff --git a/lib/features/email/presentation/widgets/attachment_list/attachment_list_item_widget.dart b/lib/features/email/presentation/widgets/attachment_list/attachment_list_item_widget.dart new file mode 100644 index 000000000..6dc75602e --- /dev/null +++ b/lib/features/email/presentation/widgets/attachment_list/attachment_list_item_widget.dart @@ -0,0 +1,114 @@ + +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/resources/image_paths.dart'; +import 'package:core/presentation/utils/style_utils.dart'; +import 'package:extended_text/extended_text.dart'; +import 'package:filesize/filesize.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:get/get.dart'; +import 'package:model/email/attachment.dart'; +import 'package:tmail_ui_user/features/email/presentation/extensions/attachment_extension.dart'; +import 'package:tmail_ui_user/features/email/presentation/styles/attachment/attachment_list_item_widget_styles.dart'; + +typedef OnDownloadAttachmentFileActionClick = void Function(Attachment attachment); + +class AttachmentListItemWidget extends StatelessWidget { + + final Attachment attachment; + final OnDownloadAttachmentFileActionClick? downloadAttachmentAction; + + final _imagePaths = Get.find(); + + AttachmentListItemWidget({ + Key? key, + required this.attachment, + this.downloadAttachmentAction, + }) : super(key: key); + + @override + Widget build(BuildContext context) { + return Material( + color: Colors.transparent, + child: InkWell( + onTap: () => downloadAttachmentAction?.call(attachment), + child: Container( + padding: AttachmentListItemWidgetStyle.contentPadding, + height: AttachmentListItemWidgetStyle.height, + child: Stack( + children: [ + Positioned.fill( + child: Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + SvgPicture.asset( + attachment.getIcon(_imagePaths), + width: AttachmentListItemWidgetStyle.iconSize, + height: AttachmentListItemWidgetStyle.iconSize, + fit: BoxFit.fill + ), + const SizedBox(width: AttachmentListItemWidgetStyle.space), + Expanded( + child: Padding( + padding: AttachmentListItemWidgetStyle.fileTitlePadding, + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + ExtendedText( + (attachment.name ?? ''), + maxLines: 1, + overflow: CommonTextStyle.defaultTextOverFlow, + softWrap: CommonTextStyle.defaultSoftWrap, + overflowWidget: TextOverflowWidget( + position: Directionality.maybeOf(context) == TextDirection.rtl + ? TextOverflowPosition.start + : TextOverflowPosition.end, + child: const Text( + "...", + style: AttachmentListItemWidgetStyle.dotsLabelTextStyle, + ), + ), + style: AttachmentListItemWidgetStyle.labelTextStyle, + ), + const SizedBox(height: AttachmentListItemWidgetStyle.fileTitleBottomSpace), + Text( + filesize(attachment.size?.value), + maxLines: 1, + overflow: CommonTextStyle.defaultTextOverFlow, + softWrap: CommonTextStyle.defaultSoftWrap, + style: AttachmentListItemWidgetStyle.sizeLabelTextStyle, + ) + ] + ), + ) + ) + ] + ), + ), + Align( + alignment: AlignmentDirectional.centerEnd, + child: Padding( + padding: AttachmentListItemWidgetStyle.downloadIconPadding, + child: Material( + color: Colors.transparent, + child: InkWell( + customBorder: const CircleBorder(), + child: SvgPicture.asset( + _imagePaths.icDownloadAttachment, + width: AttachmentListItemWidgetStyle.downloadIconSize, + height: AttachmentListItemWidgetStyle.downloadIconSize, + colorFilter: AttachmentListItemWidgetStyle.downloadIconColor.asFilter(), + fit: BoxFit.fill + ), + onTap: () => downloadAttachmentAction?.call(attachment) + ), + ), + ), + ), + ] + ) + ), + ), + ); + } +} \ No newline at end of file