TF-1801 Add attachment list items

(cherry picked from commit bdbe545541665b687785dcf167e26a228b978d19)
2023-10-17 17:30:33 +07:00
parent fd61d27660
commit 982e20bddf
2 changed files with 147 additions and 0 deletions
@@ -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
+  );
+}
@@ -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<ImagePaths>();
+
+  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)
+                    ),
+                  ),
+                ),
+              ),
+            ]
+          )
+        ),
+      ),
+    );
+  }
+}