ember/fluffychat
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

make overlay message scrollable if entire overlay doesn't fit in screen

Browse source
This commit is contained in:
ggurdin 2024-10-08 16:46:00 -04:00
parent 5b4bcb5acc
commit 945e82d3b9
No known key found for this signature in database
GPG key ID: A01CB41737CBB478
3 changed files with 64 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
lib/pangea/widgets/chat/message_selection_overlay.dart
View file

@ -232,8 +232,9 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
messageSize!.height -
toolbarButtonsHeight;
final bool hasHeaderOverflow = (messageOffset!.dy - toolbarButtonsHeight) <
(AppConfig.toolbarMaxHeight + headerHeight);
final bool hasHeaderOverflow =
messageOffset!.dy < (AppConfig.toolbarMaxHeight + headerHeight);
debugPrint("has header overflow: $hasHeaderOverflow");
final bool hasFooterOverflow = footerHeight > currentBottomOffset;
if (!hasHeaderOverflow && !hasFooterOverflow) return;
@ -252,10 +253,14 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
newTopOffset < (headerHeight + AppConfig.toolbarMaxHeight);
if (hasHeaderOverflow || upshiftCausesHeaderOverflow) {
animationEndOffset = midpoint - messageSize!.height;
animationEndOffset =
midpoint - messageSize!.height - toolbarButtonsHeight;
final totalTopOffset =
animationEndOffset + messageSize!.height + AppConfig.toolbarMaxHeight;
final remainingSpace = screenHeight - totalTopOffset;
debugPrint(
"total top offset: $totalTopOffset, remaining space: $remainingSpace",
);
if (remainingSpace < headerHeight) {
// the overlay could run over the header, so it needs to be shifted down
animationEndOffset -= (headerHeight - remainingSpace);
@ -266,6 +271,19 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
animationEndOffset = footerHeight;
}
debugPrint(
"NIMATION END OFFSET: $animationEndOffset. Footer height: $footerHeight",
);
if (animationEndOffset < footerHeight + toolbarButtonsHeight) {
adjustedMessageHeight = screenHeight -
AppConfig.toolbarMaxHeight -
headerHeight -
footerHeight -
toolbarButtonsHeight;
animationEndOffset = footerHeight;
}
_overlayPositionAnimation = Tween<double>(
begin: currentBottomOffset,
end: animationEndOffset,
@ -296,6 +314,7 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
Size? get messageSize => messageRenderBox?.size;
Offset? get messageOffset => messageRenderBox?.localToGlobal(Offset.zero);
double? adjustedMessageHeight;
// height of the reply/forward bar + the reaction picker + contextual padding
double get footerHeight =>
@ -352,16 +371,20 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
pangeaMessageEvent: widget._pangeaMessageEvent,
overLayController: this,
),
OverlayMessage(
pangeaMessageEvent,
immersionMode: widget.chatController.choreographer.immersionMode,
controller: widget.chatController,
overlayController: this,
nextEvent: widget._nextEvent,
prevEvent: widget._prevEvent,
timeline: widget.chatController.timeline!,
messageWidth: messageSize!.width,
messageHeight: messageSize!.height,
SizedBox(
height: adjustedMessageHeight,
child: OverlayMessage(
pangeaMessageEvent,
immersionMode:
widget.chatController.choreographer.immersionMode,
controller: widget.chatController,
overlayController: this,
nextEvent: widget._nextEvent,
prevEvent: widget._prevEvent,
timeline: widget.chatController.timeline!,
messageWidth: messageSize!.width,
messageHeight: messageSize!.height,
),
),
ToolbarButtons(
overlayController: this,

3
lib/pangea/widgets/chat/message_toolbar.dart
View file

@ -133,6 +133,9 @@ class MessageToolbarState extends State<MessageToolbar> {
Radius.circular(AppConfig.borderRadius),
),
),
constraints: const BoxConstraints(
maxHeight: AppConfig.toolbarMaxHeight,
),
child: Row(
children: [
Expanded(

48
lib/pangea/widgets/chat/overlay_message.dart
View file

@ -88,30 +88,32 @@ class OverlayMessage extends StatelessWidget {
shape: RoundedRectangleBorder(
borderRadius: borderRadius,
),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
AppConfig.borderRadius,
child: SingleChildScrollView(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(
AppConfig.borderRadius,
),
),
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
width: messageWidth,
height: messageHeight,
child: MessageContent(
pangeaMessageEvent.event,
textColor: ownMessage
? theme.colorScheme.onPrimary
: theme.colorScheme.onSurface,
pangeaMessageEvent: pangeaMessageEvent,
immersionMode: immersionMode,
overlayController: overlayController,
controller: controller,
nextEvent: nextEvent,
prevEvent: prevEvent,
borderRadius: borderRadius,
),
),
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
width: messageWidth,
height: messageHeight,
child: MessageContent(
pangeaMessageEvent.event,
textColor: ownMessage
? theme.colorScheme.onPrimary
: theme.colorScheme.onSurface,
pangeaMessageEvent: pangeaMessageEvent,
immersionMode: immersionMode,
overlayController: overlayController,
controller: controller,
nextEvent: nextEvent,
prevEvent: prevEvent,
borderRadius: borderRadius,
),
),
);