TF-2532 Add attachment/inlineImage button at app bar composer on mobile/tablet
This commit is contained in:
@@ -19,10 +19,10 @@ import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile/app_
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile/from_composer_mobile_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile/landscape_app_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile/mobile_attachment_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile/tablet_app_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/mobile/tablet_bottom_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/recipient_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/subject_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/web/desktop_app_bar_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/web/from_composer_drop_down_widget.dart';
|
||||
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
import 'package:tmail_ui_user/main/routes/route_navigation.dart';
|
||||
@@ -69,6 +69,12 @@ class ComposerView extends GetWidget<ComposerController> {
|
||||
radius: ComposerStyle.popupMenuRadius
|
||||
);
|
||||
},
|
||||
isNetworkConnectionAvailable: controller.isNetworkConnectionAvailable,
|
||||
attachFileAction: () => controller.openPickAttachmentMenu(
|
||||
context,
|
||||
_pickAttachmentsActionTiles(context)
|
||||
),
|
||||
insertImageAction: () => controller.insertImage(context, constraints.maxWidth),
|
||||
))
|
||||
else
|
||||
Obx(() => AppBarComposerWidget(
|
||||
@@ -83,6 +89,12 @@ class ComposerView extends GetWidget<ComposerController> {
|
||||
radius: ComposerStyle.popupMenuRadius
|
||||
);
|
||||
},
|
||||
isNetworkConnectionAvailable: controller.isNetworkConnectionAvailable,
|
||||
attachFileAction: () => controller.openPickAttachmentMenu(
|
||||
context,
|
||||
_pickAttachmentsActionTiles(context)
|
||||
),
|
||||
insertImageAction: () => controller.insertImage(context, constraints.maxWidth),
|
||||
)),
|
||||
Expanded(
|
||||
child: SafeArea(
|
||||
@@ -244,10 +256,16 @@ class ComposerView extends GetWidget<ComposerController> {
|
||||
color: ComposerStyle.mobileBackgroundColor,
|
||||
child: Column(
|
||||
children: [
|
||||
Obx(() => DesktopAppBarComposerWidget(
|
||||
Obx(() => TabletAppBarComposerWidget(
|
||||
emailSubject: controller.subjectEmail.value ?? '',
|
||||
onCloseViewAction: () => controller.handleClickCloseComposer(context),
|
||||
constraints: constraints,
|
||||
isNetworkConnectionAvailable: controller.isNetworkConnectionAvailable,
|
||||
attachFileAction: () => controller.openPickAttachmentMenu(
|
||||
context,
|
||||
_pickAttachmentsActionTiles(context)
|
||||
),
|
||||
insertImageAction: () => controller.insertImage(context, constraints.maxWidth),
|
||||
)),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
|
||||
@@ -9,8 +9,11 @@ import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
class AppBarComposerWidget extends StatelessWidget {
|
||||
|
||||
final bool isSendButtonEnabled;
|
||||
final bool isNetworkConnectionAvailable;
|
||||
final VoidCallback onCloseViewAction;
|
||||
final VoidCallback sendMessageAction;
|
||||
final VoidCallback attachFileAction;
|
||||
final VoidCallback insertImageAction;
|
||||
final OnOpenContextMenuAction openContextMenuAction;
|
||||
|
||||
final _imagePaths = Get.find<ImagePaths>();
|
||||
@@ -21,6 +24,9 @@ class AppBarComposerWidget extends StatelessWidget {
|
||||
required this.onCloseViewAction,
|
||||
required this.sendMessageAction,
|
||||
required this.openContextMenuAction,
|
||||
required this.attachFileAction,
|
||||
required this.insertImageAction,
|
||||
this.isNetworkConnectionAvailable = false,
|
||||
});
|
||||
|
||||
@override
|
||||
@@ -41,6 +47,27 @@ class AppBarComposerWidget extends StatelessWidget {
|
||||
onTapActionCallback: onCloseViewAction
|
||||
),
|
||||
const Spacer(),
|
||||
if (isNetworkConnectionAvailable)
|
||||
...[
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icAttachFile,
|
||||
iconColor: MobileAppBarComposerWidgetStyle.iconColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconSize: MobileAppBarComposerWidgetStyle.iconSize,
|
||||
tooltipMessage: AppLocalizations.of(context).attach_file,
|
||||
onTapActionCallback: attachFileAction,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icInsertImage,
|
||||
iconColor: MobileAppBarComposerWidgetStyle.iconColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconSize: MobileAppBarComposerWidgetStyle.iconSize,
|
||||
tooltipMessage: AppLocalizations.of(context).insertImage,
|
||||
onTapActionCallback: insertImageAction,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: isSendButtonEnabled
|
||||
? _imagePaths.icSendMobile
|
||||
|
||||
+27
@@ -9,8 +9,11 @@ import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
class LandscapeAppBarComposerWidget extends StatelessWidget {
|
||||
|
||||
final bool isSendButtonEnabled;
|
||||
final bool isNetworkConnectionAvailable;
|
||||
final VoidCallback onCloseViewAction;
|
||||
final VoidCallback sendMessageAction;
|
||||
final VoidCallback attachFileAction;
|
||||
final VoidCallback insertImageAction;
|
||||
final OnOpenContextMenuAction openContextMenuAction;
|
||||
|
||||
final _imagePaths = Get.find<ImagePaths>();
|
||||
@@ -21,6 +24,9 @@ class LandscapeAppBarComposerWidget extends StatelessWidget {
|
||||
required this.onCloseViewAction,
|
||||
required this.sendMessageAction,
|
||||
required this.openContextMenuAction,
|
||||
required this.attachFileAction,
|
||||
required this.insertImageAction,
|
||||
this.isNetworkConnectionAvailable = false,
|
||||
});
|
||||
|
||||
@override
|
||||
@@ -44,6 +50,27 @@ class LandscapeAppBarComposerWidget extends StatelessWidget {
|
||||
onTapActionCallback: onCloseViewAction
|
||||
),
|
||||
const Spacer(),
|
||||
if (isNetworkConnectionAvailable)
|
||||
...[
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icAttachFile,
|
||||
iconColor: MobileAppBarComposerWidgetStyle.iconColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconSize: MobileAppBarComposerWidgetStyle.iconSize,
|
||||
tooltipMessage: AppLocalizations.of(context).attach_file,
|
||||
onTapActionCallback: attachFileAction,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icInsertImage,
|
||||
iconColor: MobileAppBarComposerWidgetStyle.iconColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconSize: MobileAppBarComposerWidgetStyle.iconSize,
|
||||
tooltipMessage: AppLocalizations.of(context).insertImage,
|
||||
onTapActionCallback: insertImageAction,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: isSendButtonEnabled
|
||||
? _imagePaths.icSendMobile
|
||||
|
||||
@@ -0,0 +1,90 @@
|
||||
import 'package:core/presentation/resources/image_paths.dart';
|
||||
import 'package:core/presentation/views/button/tmail_button_widget.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/model/screen_display_mode.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/styles/app_bar_composer_widget_style.dart';
|
||||
import 'package:tmail_ui_user/features/composer/presentation/widgets/title_composer_widget.dart';
|
||||
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
|
||||
|
||||
class TabletAppBarComposerWidget extends StatelessWidget {
|
||||
|
||||
final String emailSubject;
|
||||
final VoidCallback onCloseViewAction;
|
||||
final ScreenDisplayMode? displayMode;
|
||||
final BoxConstraints? constraints;
|
||||
final VoidCallback attachFileAction;
|
||||
final VoidCallback insertImageAction;
|
||||
final bool isNetworkConnectionAvailable;
|
||||
|
||||
final _imagePaths = Get.find<ImagePaths>();
|
||||
|
||||
TabletAppBarComposerWidget({
|
||||
super.key,
|
||||
required this.emailSubject,
|
||||
required this.onCloseViewAction,
|
||||
required this.attachFileAction,
|
||||
required this.insertImageAction,
|
||||
this.displayMode,
|
||||
this.constraints,
|
||||
this.isNetworkConnectionAvailable = false,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
height: AppBarComposerWidgetStyle.height,
|
||||
padding: AppBarComposerWidgetStyle.padding,
|
||||
color: AppBarComposerWidgetStyle.backgroundColor,
|
||||
child: Stack(
|
||||
children: [
|
||||
Center(
|
||||
child: Container(
|
||||
constraints: constraints != null
|
||||
? BoxConstraints(maxWidth: constraints!.maxWidth / 2)
|
||||
: null,
|
||||
child: TitleComposerWidget(emailSubject: emailSubject),
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: AlignmentDirectional.centerEnd,
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
if (isNetworkConnectionAvailable)
|
||||
...[
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icAttachFile,
|
||||
iconColor: AppBarComposerWidgetStyle.iconColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconSize: AppBarComposerWidgetStyle.iconSize,
|
||||
tooltipMessage: AppLocalizations.of(context).attach_file,
|
||||
onTapActionCallback: attachFileAction,
|
||||
),
|
||||
const SizedBox(width: AppBarComposerWidgetStyle.space),
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icInsertImage,
|
||||
iconColor: AppBarComposerWidgetStyle.iconColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
iconSize: AppBarComposerWidgetStyle.iconSize,
|
||||
tooltipMessage: AppLocalizations.of(context).insertImage,
|
||||
onTapActionCallback: insertImageAction,
|
||||
),
|
||||
const SizedBox(width: AppBarComposerWidgetStyle.space),
|
||||
],
|
||||
TMailButtonWidget.fromIcon(
|
||||
icon: _imagePaths.icCancel,
|
||||
backgroundColor: Colors.transparent,
|
||||
tooltipMessage: AppLocalizations.of(context).saveAndClose,
|
||||
iconSize: AppBarComposerWidgetStyle.iconSize,
|
||||
iconColor: AppBarComposerWidgetStyle.iconColor,
|
||||
onTapActionCallback: onCloseViewAction
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user