diff --git a/lib/pages/chat/chat_emoji_picker.dart b/lib/pages/chat/chat_emoji_picker.dart index 36d5671b1..9e389d8a5 100644 --- a/lib/pages/chat/chat_emoji_picker.dart +++ b/lib/pages/chat/chat_emoji_picker.dart @@ -1,6 +1,7 @@ import 'package:emoji_picker_flutter/emoji_picker_flutter.dart'; import 'package:fluffychat/config/themes.dart'; import 'package:fluffychat/pages/chat/sticker_picker_dialog.dart'; +import 'package:fluffychat/utils/platform_infos.dart'; import 'package:flutter/material.dart'; import 'package:flutter_gen/gen_l10n/l10n.dart'; import 'package:matrix/matrix.dart'; @@ -97,7 +98,7 @@ class ChatEmojiPicker extends StatelessWidget { EmojiPickerType.reaction) ? 14.0 : 0, - top: 2.0, + top: PlatformInfos.isWeb ? 4 : 2.0, ), child: FloatingActionButton( onPressed: () => diff --git a/lib/pangea/utils/overlay.dart b/lib/pangea/utils/overlay.dart index 1fde65ff2..58846592d 100644 --- a/lib/pangea/utils/overlay.dart +++ b/lib/pangea/utils/overlay.dart @@ -68,7 +68,11 @@ class OverlayUtil { position == OverlayEnum.centered) ? 0 : null, - left: (position == OverlayEnum.bottom) ? 0 : null, + left: (position == OverlayEnum.bottom) + ? 0 + : (position == OverlayEnum.centered) + ? 0 + : null, bottom: (position == OverlayEnum.bottom || position == OverlayEnum.centered) ? 0 diff --git a/lib/pangea/widgets/chat/message_selection_overlay.dart b/lib/pangea/widgets/chat/message_selection_overlay.dart index af74d88c2..0f6a2670d 100644 --- a/lib/pangea/widgets/chat/message_selection_overlay.dart +++ b/lib/pangea/widgets/chat/message_selection_overlay.dart @@ -2,6 +2,7 @@ import 'package:fluffychat/config/themes.dart'; import 'package:fluffychat/pages/chat/chat.dart'; import 'package:fluffychat/pangea/matrix_event_wrappers/pangea_message_event.dart'; import 'package:fluffychat/pangea/utils/any_state_holder.dart'; +import 'package:fluffychat/pangea/utils/error_handler.dart'; import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart'; import 'package:fluffychat/pangea/widgets/chat/overlay_footer.dart'; import 'package:fluffychat/pangea/widgets/chat/overlay_header.dart'; @@ -56,80 +57,89 @@ class MessageSelectionOverlay extends StatelessWidget { final double stackSize = MediaQuery.of(context).size.height - footerSize - headerSize; - if (targetRenderBox != null) { - final Size transformTargetSize = (targetRenderBox as RenderBox).size; - final Offset targetOffset = (targetRenderBox).localToGlobal(Offset.zero); - if (ownMessage) { - right = MediaQuery.of(context).size.width - - targetOffset.dx - - transformTargetSize.width; - } else { - left = targetOffset.dx - (FluffyThemes.isColumnMode(context) ? 425 : 1); - } - - showDown = targetOffset.dy + transformTargetSize.height <= - headerSize + stackSize / 2; - - center = targetOffset.dy - - headerSize + - (showDown ? transformTargetSize.height + 3 : (-3)); - // If top of selected message extends below header - if (targetOffset.dy <= headerSize) { - center = transformTargetSize.height + 3; - showDown = true; - } - // If bottom of selected message extends below footer - else if (targetOffset.dy + transformTargetSize.height >= - headerSize + stackSize) { - center = stackSize - transformTargetSize.height - 3; - } - final double midpoint = headerSize + stackSize / 2; - // If message is too long, - // use default location to make full use of screen - if (transformTargetSize.height >= stackSize / 2 - 30) { - center = stackSize / 2 + (showDown ? -30 : 30); - } - // If message is not too long, but too close - // to center of screen, scroll closer to edges - if (targetOffset.dy + transformTargetSize.height > midpoint - 30 && - targetOffset.dy < midpoint + 30) { - final double scrollUp = midpoint + 30 - targetOffset.dy; - final double scrollDown = - targetOffset.dy + transformTargetSize.height - (midpoint - 30); - final double minScroll = - controller.scrollController.position.minScrollExtent; - final double maxScroll = - controller.scrollController.position.maxScrollExtent; - final double currentOffset = controller.scrollController.offset; - - // If can scroll up, scroll up - if (currentOffset + scrollUp < maxScroll) { - controller.scrollController.animateTo( - currentOffset + scrollUp, - duration: FluffyThemes.animationDuration, - curve: FluffyThemes.animationCurve, - ); - showDown = false; - center = stackSize / 2 + 27; + try { + if (targetRenderBox != null) { + final Size transformTargetSize = (targetRenderBox as RenderBox).size; + final Offset targetOffset = + (targetRenderBox).localToGlobal(Offset.zero); + if (ownMessage) { + right = MediaQuery.of(context).size.width - + targetOffset.dx - + transformTargetSize.width; + } else { + left = + targetOffset.dx - (FluffyThemes.isColumnMode(context) ? 425 : 1); } - // Else if can scroll down, scroll down - else if (currentOffset - scrollDown > minScroll) { - controller.scrollController.animateTo( - currentOffset - scrollDown, - duration: FluffyThemes.animationDuration, - curve: FluffyThemes.animationCurve, - ); + showDown = targetOffset.dy + transformTargetSize.height / 2 <= + headerSize + stackSize / 2; + + center = targetOffset.dy - + headerSize + + (showDown ? transformTargetSize.height + 3 : (-3)); + // If top of selected message extends below header + if (targetOffset.dy <= headerSize) { + center = transformTargetSize.height + 3; showDown = true; - center = stackSize / 2 - 27; } - - // Neither scrolling works; leave message as-is, - // and use centered toolbar location - else { + // If bottom of selected message extends below footer + else if (targetOffset.dy + transformTargetSize.height >= + headerSize + stackSize) { + center = stackSize - transformTargetSize.height - 3; + } + final double midpoint = headerSize + stackSize / 2; + // If message is too long, + // use default location to make full use of screen + if (transformTargetSize.height >= stackSize / 2 - 30) { center = stackSize / 2 + (showDown ? -30 : 30); } + // If message is not too long, but too close + // to center of screen, scroll closer to edges + else if (targetOffset.dy + transformTargetSize.height > midpoint - 30 && + targetOffset.dy < midpoint + 30) { + final double scrollUp = midpoint + 30 - targetOffset.dy; + final double scrollDown = + targetOffset.dy + transformTargetSize.height - (midpoint - 30); + final double minScroll = + controller.scrollController.position.minScrollExtent; + final double maxScroll = + controller.scrollController.position.maxScrollExtent; + final double currentOffset = controller.scrollController.offset; + + // If can scroll up, scroll up + if (currentOffset + scrollUp < maxScroll) { + controller.scrollController.animateTo( + currentOffset + scrollUp, + duration: FluffyThemes.animationDuration, + curve: FluffyThemes.animationCurve, + ); + showDown = false; + center = stackSize / 2 + 27; + } + + // Else if can scroll down, scroll down + else if (currentOffset - scrollDown > minScroll) { + controller.scrollController.animateTo( + currentOffset - scrollDown, + duration: FluffyThemes.animationDuration, + curve: FluffyThemes.animationCurve, + ); + showDown = true; + center = stackSize / 2 - 27; + } + + // Neither scrolling works; leave message as-is, + // and use centered toolbar location + else { + center = stackSize / 2 + (showDown ? -30 : 30); + } + } } + } catch (err) { + MatrixState.pAnyState.closeAllOverlays(); + ErrorHandler.logError(e: err, s: StackTrace.current); + // throw L10n.of(context)!.toolbarError; + return const SizedBox(); } final Widget overlayMessage = OverlayMessage( @@ -142,11 +152,7 @@ class MessageSelectionOverlay extends StatelessWidget { showDown: showDown, ); - return Container( - constraints: BoxConstraints( - maxWidth: MediaQuery.of(context).size.width - - (FluffyThemes.isColumnMode(context) ? 425 : 0), - ), + return Expanded( child: Column( mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisSize: MainAxisSize.max, diff --git a/lib/pangea/widgets/chat/message_toolbar.dart b/lib/pangea/widgets/chat/message_toolbar.dart index 0cd7d8238..b89305b6d 100644 --- a/lib/pangea/widgets/chat/message_toolbar.dart +++ b/lib/pangea/widgets/chat/message_toolbar.dart @@ -81,7 +81,7 @@ class ToolbarDisplayController { // not to open immediately after clicking (user has to scroll or move their cursor) // so I'm commenting it out for now // WidgetsBinding.instance.addPostFrameCallback((timeStamp) { - Widget overlayEntry; + Widget? overlayEntry; if (toolbar == null) return; try { overlayEntry = MessageSelectionOverlay( @@ -338,7 +338,7 @@ class MessageToolbarState extends State { Widget build(BuildContext context) { final double maxHeight = (MediaQuery.of(context).size.height - (PlatformInfos.isWeb - ? 214 + ? 217 : PlatformInfos.isIOS ? 262 : 198)) /