diff --git a/lib/pangea/widgets/chat/message_toolbar.dart b/lib/pangea/widgets/chat/message_toolbar.dart index 142a27227..ba508906b 100644 --- a/lib/pangea/widgets/chat/message_toolbar.dart +++ b/lib/pangea/widgets/chat/message_toolbar.dart @@ -59,6 +59,7 @@ class ToolbarDisplayController { } void showToolbar(BuildContext context, {MessageMode? mode}) { + bool toolbarUp = true; if (highlighted) return; if (controller.selectMode) { controller.clearSelectedEvents(); @@ -76,8 +77,22 @@ class ToolbarDisplayController { if (targetRenderBox != null) { final Size transformTargetSize = (targetRenderBox as RenderBox).size; messageWidth = transformTargetSize.width; + final Offset targetOffset = (targetRenderBox).localToGlobal(Offset.zero); + final double screenHeight = MediaQuery.of(context).size.height; + toolbarUp = targetOffset.dy >= screenHeight / 2; } + final Widget overlayMessage = OverlayMessage( + pangeaMessageEvent.event, + timeline: pangeaMessageEvent.timeline, + immersionMode: immersionMode, + ownMessage: pangeaMessageEvent.ownMessage, + toolbarController: this, + width: messageWidth, + nextEvent: nextEvent, + previousEvent: previousEvent, + ); + WidgetsBinding.instance.addPostFrameCallback((timeStamp) { Widget overlayEntry; if (toolbar == null) return; @@ -88,18 +103,9 @@ class ToolbarDisplayController { ? CrossAxisAlignment.end : CrossAxisAlignment.start, children: [ - toolbar!, + toolbarUp ? toolbar! : overlayMessage, const SizedBox(height: 6), - OverlayMessage( - pangeaMessageEvent.event, - timeline: pangeaMessageEvent.timeline, - immersionMode: immersionMode, - ownMessage: pangeaMessageEvent.ownMessage, - toolbarController: this, - width: messageWidth, - nextEvent: nextEvent, - previousEvent: previousEvent, - ), + toolbarUp ? overlayMessage : toolbar!, ], ); } catch (err) { @@ -113,11 +119,19 @@ class ToolbarDisplayController { child: overlayEntry, transformTargetId: targetId, targetAnchor: pangeaMessageEvent.ownMessage - ? Alignment.bottomRight - : Alignment.bottomLeft, + ? toolbarUp + ? Alignment.bottomRight + : Alignment.topRight + : toolbarUp + ? Alignment.bottomLeft + : Alignment.topLeft, followerAnchor: pangeaMessageEvent.ownMessage - ? Alignment.bottomRight - : Alignment.bottomLeft, + ? toolbarUp + ? Alignment.bottomRight + : Alignment.topRight + : toolbarUp + ? Alignment.bottomLeft + : Alignment.topLeft, backgroundColor: const Color.fromRGBO(0, 0, 0, 1).withAlpha(100), );