aiden
/
fluffychat
mirror of https://github.com/krille-chan/fluffychat
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #472 from pangeachat/toolbar-location-adjustments

Browse Source 
Toolbar location adjustments
pull/1384/head
ggurdin 1 year ago committed by GitHub
parent e8f6a7b83c 9a56fe42b7
commit 148d5b9bb8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 134 additions and 77 deletions
Show Stats Download Patch File Download Diff File

9
lib/pages/chat/events/message.dart
Unescape Escape View File

@ -314,8 +314,9 @@ class Message extends StatelessWidget {
padding: const EdgeInsets.only(left: 8), padding: const EdgeInsets.only(left: 8),
child: GestureDetector( child: GestureDetector(
// #Pangea // #Pangea
onTap: () => onTap: () => toolbarController?.showToolbar(
toolbarController?.showToolbar(context), context,
),
onDoubleTap: () => onDoubleTap: () =>
toolbarController?.showToolbar(context), toolbarController?.showToolbar(context),
// Pangea# // Pangea#
@ -585,7 +586,9 @@ class Message extends StatelessWidget {
: MainAxisAlignment.start, : MainAxisAlignment.start,
children: [ children: [
if (pangeaMessageEvent?.showMessageButtons ?? false) if (pangeaMessageEvent?.showMessageButtons ?? false)
MessageButtons(toolbarController: toolbarController), MessageButtons(
toolbarController: toolbarController,
),
MessageReactions(event, timeline), MessageReactions(event, timeline),
], ],
), ),

202
lib/pangea/widgets/chat/message_toolbar.dart
Unescape Escape View File

@ -58,7 +58,10 @@ class ToolbarDisplayController {
); );
} }
void showToolbar(BuildContext context, {MessageMode? mode}) { void showToolbar(
BuildContext context, {
MessageMode? mode,
}) {
bool toolbarUp = true; bool toolbarUp = true;
if (highlighted) return; if (highlighted) return;
if (controller.selectMode) { if (controller.selectMode) {
@ -78,8 +81,51 @@ class ToolbarDisplayController {
final Size transformTargetSize = (targetRenderBox as RenderBox).size; final Size transformTargetSize = (targetRenderBox as RenderBox).size;
messageWidth = transformTargetSize.width; messageWidth = transformTargetSize.width;
final Offset targetOffset = (targetRenderBox).localToGlobal(Offset.zero); final Offset targetOffset = (targetRenderBox).localToGlobal(Offset.zero);
final double screenHeight = MediaQuery.of(context).size.height;
toolbarUp = targetOffset.dy >= screenHeight / 2; // If there is enough space above, procede as normal
// Else if there is enough space below, show toolbar underneath
if (targetOffset.dy < 320) {
final spaceBeneath = MediaQuery.of(context).size.height -
(targetOffset.dy + transformTargetSize.height);
if (spaceBeneath >= 320) {
toolbarUp = false;
}
// See if it's possible to scroll up to make space
else if (controller.scrollController.offset - targetOffset.dy + 320 >=
controller.scrollController.position.minScrollExtent &&
controller.scrollController.offset - targetOffset.dy + 320 <=
controller.scrollController.position.maxScrollExtent) {
controller.scrollController.animateTo(
controller.scrollController.offset - targetOffset.dy + 320,
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
);
}
// See if it's possible to scroll down to make space
else if (controller.scrollController.offset + spaceBeneath - 320 >=
controller.scrollController.position.minScrollExtent &&
controller.scrollController.offset + spaceBeneath - 320 <=
controller.scrollController.position.maxScrollExtent) {
controller.scrollController.animateTo(
controller.scrollController.offset + spaceBeneath - 320,
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
);
toolbarUp = false;
}
// If message is too big and can't scroll either way
// Scroll up as much as possible, and show toolbar above
else {
controller.scrollController.animateTo(
controller.scrollController.position.minScrollExtent,
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
);
}
}
} }
final Widget overlayMessage = OverlayMessage( final Widget overlayMessage = OverlayMessage(
@ -106,7 +152,13 @@ class ToolbarDisplayController {
? CrossAxisAlignment.end ? CrossAxisAlignment.end
: CrossAxisAlignment.start, : CrossAxisAlignment.start,
children: [ children: [
toolbarUp ? toolbar! : overlayMessage, toolbarUp
// Column is limited to screen height
// If message portion is too tall, decrease toolbar height
// as necessary to prevent toolbar from acting strange
// Problems may still occur if toolbar height is decreased too much
? toolbar!
: overlayMessage,
const SizedBox(height: 6), const SizedBox(height: 6),
toolbarUp ? overlayMessage : toolbar!, toolbarUp ? overlayMessage : toolbar!,
], ],
@ -367,83 +419,85 @@ class MessageToolbarState extends State<MessageToolbar> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Material( return Flexible(
type: MaterialType.transparency, child: Material(
child: Container( type: MaterialType.transparency,
padding: const EdgeInsets.all(10), child: Container(
decoration: BoxDecoration( padding: const EdgeInsets.all(10),
color: Theme.of(context).cardColor, decoration: BoxDecoration(
border: Border.all( color: Theme.of(context).cardColor,
width: 2, border: Border.all(
color: Theme.of(context).colorScheme.primary, width: 2,
color: Theme.of(context).colorScheme.primary,
),
borderRadius: const BorderRadius.all(
Radius.circular(25),
),
), ),
borderRadius: const BorderRadius.all( constraints: const BoxConstraints(
Radius.circular(25), maxWidth: 300,
minWidth: 300,
maxHeight: 300,
), ),
), child: Column(
constraints: const BoxConstraints( mainAxisSize: MainAxisSize.min,
maxWidth: 300, children: [
minWidth: 300, Flexible(
maxHeight: 300, child: SingleChildScrollView(
), child: AnimatedSize(
child: Column( duration: FluffyThemes.animationDuration,
mainAxisSize: MainAxisSize.min, child: Column(
children: [ children: [
Flexible( Padding(
child: SingleChildScrollView( padding: const EdgeInsets.all(8.0),
child: AnimatedSize( child: toolbarContent ?? const SizedBox(),
duration: FluffyThemes.animationDuration, ),
child: Column( SizedBox(height: toolbarContent == null ? 0 : 20),
children: [ ],
Padding( ),
padding: const EdgeInsets.all(8.0),
child: toolbarContent ?? const SizedBox(),
),
SizedBox(height: toolbarContent == null ? 0 : 20),
],
), ),
), ),
), ),
), Row(
Row( mainAxisSize: MainAxisSize.min,
mainAxisSize: MainAxisSize.min, children: MessageMode.values.map((mode) {
children: MessageMode.values.map((mode) { if ([
if ([ MessageMode.definition,
MessageMode.definition, MessageMode.textToSpeech,
MessageMode.textToSpeech, MessageMode.translation,
MessageMode.translation, ].contains(mode) &&
].contains(mode) && widget.pangeaMessageEvent.isAudioMessage) {
widget.pangeaMessageEvent.isAudioMessage) { return const SizedBox.shrink();
return const SizedBox.shrink(); }
} if (mode == MessageMode.speechToText &&
if (mode == MessageMode.speechToText && !widget.pangeaMessageEvent.isAudioMessage) {
!widget.pangeaMessageEvent.isAudioMessage) { return const SizedBox.shrink();
return const SizedBox.shrink(); }
} return Tooltip(
return Tooltip( message: mode.tooltip(context),
message: mode.tooltip(context), child: IconButton(
child: IconButton( icon: Icon(mode.icon),
icon: Icon(mode.icon), color: mode.iconColor(
color: mode.iconColor( widget.pangeaMessageEvent,
widget.pangeaMessageEvent, currentMode,
currentMode, context,
context, ),
onPressed: () => updateMode(mode),
),
);
}).toList() +
[
Tooltip(
message: L10n.of(context)!.more,
child: IconButton(
icon: const Icon(Icons.add_reaction_outlined),
onPressed: showMore,
), ),
onPressed: () => updateMode(mode),
),
);
}).toList() +
[
Tooltip(
message: L10n.of(context)!.more,
child: IconButton(
icon: const Icon(Icons.add_reaction_outlined),
onPressed: showMore,
), ),
), ],
], ),
), ],
], ),
), ),
), ),
); );

Write Preview
Loading…
Cancel
Save