TF-656 add request read receipt to composer_view

This commit is contained in:
sherlockvn
2022-10-17 16:45:42 +07:00
committed by Dat H. Pham
parent ee718e010a
commit 9626d12c77
3 changed files with 225 additions and 58 deletions
@@ -173,4 +173,72 @@ Widget buildButtonWrapText(String name, {
color: Colors.white)),
),
);
}
Widget buildIconWithLowerMenu(
Widget icon,
BuildContext context,
List<PopupMenuEntry> popupMenuItems,
Function(BuildContext context, RelativeRect? position,
List<PopupMenuEntry> popupMenuItems)
openPopUpMenuAction,
) {
return Builder(
builder: (iconContext) {
final screenSize = MediaQuery.of(context).size;
return buildIconWeb(
icon: icon,
onTap: () {
// get size and position of the icon
RenderBox box = iconContext.findRenderObject() as RenderBox;
Offset iconTopLeft = box.localToGlobal(Offset.zero);
final iconSize = box.size;
// calculate the popup position for popup menu action
final popupLeft = iconTopLeft.dx + iconSize.width * 3 / 4;
final popupTop = iconTopLeft.dy + iconSize.height * 4 / 5;
final popupRight = screenSize.width - popupLeft;
final popupBottom = screenSize.height - popupRight;
final position = RelativeRect.fromLTRB(
popupLeft, popupTop, popupRight, popupBottom);
openPopUpMenuAction(context, position, popupMenuItems);
});
},
);
}
Widget buildIconWithUpperMenu(
Widget icon,
BuildContext context,
List<PopupMenuEntry> popupMenuItems,
Function(BuildContext context, RelativeRect? position,
List<PopupMenuEntry> popupMenuItems)
openPopUpMenuAction,
) {
return Builder(
builder: (iconContext) {
final screenSize = MediaQuery.of(context).size;
return buildIconWeb(
icon: icon,
onTap: () {
// get size and position of the icon
RenderBox box = iconContext.findRenderObject() as RenderBox;
Offset iconTopLeft = box.localToGlobal(Offset.zero);
final iconSize = box.size;
// calculate the popup position for popup menu action
final popupLeft = iconTopLeft.dx + iconSize.width * 3 / 4;
final popupTop = iconTopLeft.dy - iconSize.height * 9 / 5;
final popupRight = screenSize.width - popupLeft;
final popupBottom = screenSize.height - popupRight;
final position = RelativeRect.fromLTRB(
popupLeft, popupTop, popupRight, popupBottom);
openPopUpMenuAction(context, position, popupMenuItems);
});
},
);
}
@@ -150,42 +150,83 @@ class ComposerView extends GetWidget<ComposerController>
fit: BoxFit.fill),
tooltip: AppLocalizations.of(context).send,
onTap: () => controller.sendEmailAction(context)),
]
if (responsiveUtils.isScreenWithShortestSide(context))
buildIconWithLowerMenu(
SvgPicture.asset(imagePaths.icRequestReadReceipt),
context,
_popUpMoreActionMenu(context),
controller.openPopupMenuAction),
],
),
);
}
List<PopupMenuEntry> _popUpMoreActionMenu(BuildContext context) {
return [
PopupMenuItem(
padding: const EdgeInsets.symmetric(horizontal: 8),
child: Row(
children: [
Obx(() => buildIconWeb(
icon: Icon(controller.hasRequestReadReceipt.value ? Icons.done : null, color: Colors.black))),
IgnorePointer(
child: buildTextIcon(
AppLocalizations.of(context).requestReadReceipt,
textStyle: const TextStyle(color: Colors.black, fontSize: 15)),
),
]),
onTap: () {
controller.toggleRequestReadReceipt();
},
)
];
}
Widget _buildBottomBar(BuildContext context, bool isEnableSendButton) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 16),
color: Colors.white,
child: Row(mainAxisAlignment: MainAxisAlignment.center,
children: [
buildTextButton(
AppLocalizations.of(context).cancel,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.lineItemListColor),
backgroundColor: AppColor.emailAddressChipColor,
width: 150,
height: 44,
radius: 10,
onTap: () => controller.closeComposer()),
const SizedBox(width: 12),
buildTextButton(
AppLocalizations.of(context).save_to_drafts,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.colorTextButton),
backgroundColor: AppColor.emailAddressChipColor,
width: 150,
height: 44,
radius: 10,
onTap: () => controller.saveEmailAsDrafts(context)),
const SizedBox(width: 12),
buildTextButton(
AppLocalizations.of(context).send,
width: 150,
height: 44,
radius: 10,
onTap: () => controller.sendEmailAction(context)),
]
child: Stack(
alignment: Alignment.centerRight,
children: [
Row(mainAxisAlignment: MainAxisAlignment.center,
children: [
buildTextButton(
AppLocalizations.of(context).cancel,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.lineItemListColor),
backgroundColor: AppColor.emailAddressChipColor,
width: 150,
height: 44,
radius: 10,
onTap: () => controller.closeComposer()),
const SizedBox(width: 12),
buildTextButton(
AppLocalizations.of(context).save_to_drafts,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.colorTextButton),
backgroundColor: AppColor.emailAddressChipColor,
width: 150,
height: 44,
radius: 10,
onTap: () => controller.saveEmailAsDrafts(context)),
const SizedBox(width: 12),
buildTextButton(
AppLocalizations.of(context).send,
width: 150,
height: 44,
radius: 10,
onTap: () => controller.sendEmailAction(context)),
]
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
buildIconWithUpperMenu(
SvgPicture.asset(imagePaths.icRequestReadReceipt),
context,
_popUpMoreActionMenu(context),
controller.openPopupMenuAction)
]),
],
),
);
}
@@ -227,46 +227,103 @@ class ComposerView extends GetWidget<ComposerController>
fit: BoxFit.fill),
tooltip: AppLocalizations.of(context).send,
onTap: () => controller.sendEmailAction(context)),
buildIconWithLowerMenu(
SvgPicture.asset(imagePaths.icRequestReadReceipt),
context,
_popUpMoreActionMenu(context),
controller.openPopupMenuAction),
]
),
);
}
Widget _buildBottomBar(BuildContext context, bool isEnableSendButton) {
List<PopupMenuEntry> _popUpMoreActionMenu(BuildContext context) {
return [
PopupMenuItem(
padding: const EdgeInsets.symmetric(horizontal: 8),
child: PointerInterceptor(
child: IntrinsicHeight(
child: Row(
children: [
Obx(() => buildIconWeb(
icon: Icon(controller.hasRequestReadReceipt.value ? Icons.done : null, color: Colors.black))),
Expanded(
child: InkResponse(
child: SizedBox(
width: double.infinity,
height: double.infinity,
child: Center(
child: Text(
AppLocalizations.of(context).requestReadReceipt,
style: const TextStyle(color: Colors.black, fontSize: 15),
)
),
),
),
),
]),
),
),
onTap: () {
controller.toggleRequestReadReceipt();
},
)
];
}
Widget _buildBottomBar(BuildContext context, bool isEnableSendButton, BoxConstraints constraints) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 16),
color: Colors.white,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(mainAxisAlignment: MainAxisAlignment.center,
child: ConstrainedBox(
constraints: constraints.widthConstraints(),
child: Stack(
alignment: Alignment.centerRight,
children: [
const SizedBox(width: 24),
buildButtonWrapText(
AppLocalizations.of(context).cancel,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.lineItemListColor),
bgColor: AppColor.emailAddressChipColor,
minWidth: 150,
height: 44,
radius: 10,
onTap: () => controller.closeComposerWeb()),
const SizedBox(width: 12),
buildButtonWrapText(
AppLocalizations.of(context).save_to_drafts,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.colorTextButton),
bgColor: AppColor.emailAddressChipColor,
minWidth: 150,
height: 44,
radius: 10,
onTap: () => controller.saveEmailAsDrafts(context)),
const SizedBox(width: 12),
buildButtonWrapText(
AppLocalizations.of(context).send,
minWidth: 150,
height: 44,
radius: 10,
onTap: () => controller.sendEmailAction(context)),
const SizedBox(width: 24),
]
Row(mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(width: 24),
buildButtonWrapText(
AppLocalizations.of(context).cancel,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.lineItemListColor),
bgColor: AppColor.emailAddressChipColor,
minWidth: 150,
height: 44,
radius: 10,
onTap: () => controller.closeComposerWeb()),
const SizedBox(width: 12),
buildButtonWrapText(
AppLocalizations.of(context).save_to_drafts,
textStyle: const TextStyle(fontWeight: FontWeight.w500, fontSize: 17, color: AppColor.colorTextButton),
bgColor: AppColor.emailAddressChipColor,
minWidth: 150,
height: 44,
radius: 10,
onTap: () => controller.saveEmailAsDrafts(context)),
const SizedBox(width: 12),
buildButtonWrapText(
AppLocalizations.of(context).send,
minWidth: 150,
height: 44,
radius: 10,
onTap: () => controller.sendEmailAction(context)),
const SizedBox(width: 24),
]
),
if(!responsiveUtils.isMobile(context))
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
buildIconWithUpperMenu(
SvgPicture.asset(imagePaths.icRequestReadReceipt),
context,
_popUpMoreActionMenu(context),
controller.openPopupMenuAction)
]),
],
),
),
),
);
@@ -317,7 +374,7 @@ class ComposerView extends GetWidget<ComposerController>
]
))),
const Divider(color: AppColor.colorDividerComposer, height: 1),
Obx(() => _buildBottomBar(context, controller.isEnableEmailSendButton.value)),
Obx(() => _buildBottomBar(context, controller.isEnableEmailSendButton.value, constraints)),
]);
}
@@ -644,6 +701,7 @@ class ComposerView extends GetWidget<ComposerController>
}, onBlur: () {
controller.onEditorFocusChange(false);
}, onMouseDown: () {
Navigator.maybePop(context);
controller.onEditorFocusChange(true);
}, onChangeSelection: (settings) {
controller.richTextWebController.onEditorSettingsChange(settings);