mirror of
https://github.com/krille-chan/fluffychat
synced 2024-09-10 09:05:10 +00:00
chore: Follow up select events
This commit is contained in:
parent
1d44e8b5d0
commit
2382141cc5
2 changed files with 93 additions and 59 deletions
|
@ -1,5 +1,3 @@
|
||||||
import 'dart:ui';
|
|
||||||
|
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
import 'package:flutter_gen/gen_l10n/l10n.dart';
|
import 'package:flutter_gen/gen_l10n/l10n.dart';
|
||||||
|
@ -7,6 +5,7 @@ import 'package:matrix/matrix.dart';
|
||||||
import 'package:swipe_to_action/swipe_to_action.dart';
|
import 'package:swipe_to_action/swipe_to_action.dart';
|
||||||
|
|
||||||
import 'package:fluffychat/config/themes.dart';
|
import 'package:fluffychat/config/themes.dart';
|
||||||
|
import 'package:fluffychat/pages/chat/events/message_popup_menu_button.dart';
|
||||||
import 'package:fluffychat/utils/date_time_extension.dart';
|
import 'package:fluffychat/utils/date_time_extension.dart';
|
||||||
import 'package:fluffychat/utils/string_color.dart';
|
import 'package:fluffychat/utils/string_color.dart';
|
||||||
import 'package:fluffychat/widgets/avatar.dart';
|
import 'package:fluffychat/widgets/avatar.dart';
|
||||||
|
@ -125,8 +124,6 @@ class Message extends StatelessWidget {
|
||||||
final resetAnimateIn = this.resetAnimateIn;
|
final resetAnimateIn = this.resetAnimateIn;
|
||||||
var animateIn = this.animateIn;
|
var animateIn = this.animateIn;
|
||||||
|
|
||||||
TapDownDetails? lastTapDownDetails;
|
|
||||||
|
|
||||||
final row = StatefulBuilder(
|
final row = StatefulBuilder(
|
||||||
builder: (context, setState) {
|
builder: (context, setState) {
|
||||||
if (animateIn && resetAnimateIn != null) {
|
if (animateIn && resetAnimateIn != null) {
|
||||||
|
@ -143,6 +140,16 @@ class Message extends StatelessWidget {
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
mainAxisAlignment: rowMainAxisAlignment,
|
mainAxisAlignment: rowMainAxisAlignment,
|
||||||
children: [
|
children: [
|
||||||
|
AnimatedSize(
|
||||||
|
duration: FluffyThemes.animationDuration,
|
||||||
|
curve: FluffyThemes.animationCurve,
|
||||||
|
child: longPressSelect
|
||||||
|
? Checkbox.adaptive(
|
||||||
|
value: selected,
|
||||||
|
onChanged: (_) => onSelect(event),
|
||||||
|
)
|
||||||
|
: const SizedBox.shrink(),
|
||||||
|
),
|
||||||
if (sameSender || ownMessage)
|
if (sameSender || ownMessage)
|
||||||
SizedBox(
|
SizedBox(
|
||||||
width: Avatar.defaultSize,
|
width: Avatar.defaultSize,
|
||||||
|
@ -205,19 +212,9 @@ class Message extends StatelessWidget {
|
||||||
alignment: alignment,
|
alignment: alignment,
|
||||||
padding: const EdgeInsets.only(left: 8),
|
padding: const EdgeInsets.only(left: 8),
|
||||||
child: GestureDetector(
|
child: GestureDetector(
|
||||||
onTapDown: (details) {
|
onTap: !longPressSelect ? () {} : () => onSelect(event),
|
||||||
lastTapDownDetails = details;
|
onLongPress:
|
||||||
},
|
longPressSelect ? () {} : () => onSelect(event),
|
||||||
onTap: () {
|
|
||||||
if (lastTapDownDetails?.kind ==
|
|
||||||
PointerDeviceKind.mouse) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
onSelect(event);
|
|
||||||
},
|
|
||||||
onLongPress: event.messageType == MessageTypes.Text
|
|
||||||
? null
|
|
||||||
: () => onSelect(event),
|
|
||||||
child: AnimatedOpacity(
|
child: AnimatedOpacity(
|
||||||
opacity: animateIn
|
opacity: animateIn
|
||||||
? 0
|
? 0
|
||||||
|
@ -232,17 +229,8 @@ class Message extends StatelessWidget {
|
||||||
child: Material(
|
child: Material(
|
||||||
color: noBubble ? Colors.transparent : color,
|
color: noBubble ? Colors.transparent : color,
|
||||||
clipBehavior: Clip.antiAlias,
|
clipBehavior: Clip.antiAlias,
|
||||||
elevation: highlightMarker || selected ? 10 : 0,
|
|
||||||
shape: RoundedRectangleBorder(
|
shape: RoundedRectangleBorder(
|
||||||
borderRadius: borderRadius,
|
borderRadius: borderRadius,
|
||||||
side: BorderSide(
|
|
||||||
width: highlightMarker || selected ? 1 : 0,
|
|
||||||
color: selected
|
|
||||||
? Theme.of(context).colorScheme.onBackground
|
|
||||||
: highlightMarker
|
|
||||||
? Theme.of(context).colorScheme.primary
|
|
||||||
: Colors.transparent,
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
child: Container(
|
child: Container(
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
|
@ -433,7 +421,13 @@ class Message extends StatelessWidget {
|
||||||
container = row;
|
container = row;
|
||||||
}
|
}
|
||||||
|
|
||||||
return Center(
|
return Container(
|
||||||
|
alignment: Alignment.center,
|
||||||
|
color: selected
|
||||||
|
? Theme.of(context).colorScheme.secondaryContainer.withAlpha(100)
|
||||||
|
: highlightMarker
|
||||||
|
? Theme.of(context).colorScheme.tertiaryContainer.withAlpha(100)
|
||||||
|
: Colors.transparent,
|
||||||
child: Swipeable(
|
child: Swipeable(
|
||||||
key: ValueKey(event.eventId),
|
key: ValueKey(event.eventId),
|
||||||
background: const Padding(
|
background: const Padding(
|
||||||
|
@ -457,50 +451,36 @@ class Message extends StatelessWidget {
|
||||||
),
|
),
|
||||||
child: container,
|
child: container,
|
||||||
),
|
),
|
||||||
if (hovered || selected)
|
Positioned(
|
||||||
Positioned(
|
left: 4,
|
||||||
left: 4,
|
bottom: 4,
|
||||||
bottom: 4,
|
child: AnimatedScale(
|
||||||
|
duration: Duration(
|
||||||
|
milliseconds:
|
||||||
|
(FluffyThemes.animationDuration.inMilliseconds / 2)
|
||||||
|
.floor(),
|
||||||
|
),
|
||||||
|
curve: FluffyThemes.animationCurve,
|
||||||
|
scale: !longPressSelect && hovered ? 1 : 0,
|
||||||
|
alignment: Alignment.center,
|
||||||
child: Material(
|
child: Material(
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.colorScheme
|
.colorScheme
|
||||||
.background
|
.surfaceVariant
|
||||||
.withOpacity(0.9),
|
.withOpacity(0.9),
|
||||||
elevation:
|
elevation:
|
||||||
Theme.of(context).appBarTheme.scrolledUnderElevation ??
|
Theme.of(context).appBarTheme.scrolledUnderElevation ??
|
||||||
4,
|
4,
|
||||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||||
shadowColor: Theme.of(context).appBarTheme.shadowColor,
|
shadowColor: Theme.of(context).appBarTheme.shadowColor,
|
||||||
child: Row(
|
child: MessagePopupMenuButton(
|
||||||
mainAxisSize: MainAxisSize.min,
|
event: event,
|
||||||
children: [
|
onReply: onSwipe,
|
||||||
IconButton(
|
onSelect: () => onSelect(event),
|
||||||
icon: Icon(
|
|
||||||
selected
|
|
||||||
? Icons.check_circle
|
|
||||||
: longPressSelect
|
|
||||||
? Icons.check_circle_outlined
|
|
||||||
: Icons.check_circle_outlined,
|
|
||||||
size: 16,
|
|
||||||
),
|
|
||||||
tooltip: L10n.of(context)!.select,
|
|
||||||
onPressed: () => onSelect(event),
|
|
||||||
),
|
|
||||||
if (hovered &&
|
|
||||||
event.room.canSendDefaultMessages &&
|
|
||||||
event.status.isSent)
|
|
||||||
IconButton(
|
|
||||||
icon: const Icon(
|
|
||||||
Icons.reply_outlined,
|
|
||||||
size: 16,
|
|
||||||
),
|
|
||||||
tooltip: L10n.of(context)!.reply,
|
|
||||||
onPressed: () => onSwipe(),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|
54
lib/pages/chat/events/message_popup_menu_button.dart
Normal file
54
lib/pages/chat/events/message_popup_menu_button.dart
Normal file
|
@ -0,0 +1,54 @@
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
import 'package:flutter_gen/gen_l10n/l10n.dart';
|
||||||
|
import 'package:matrix/matrix.dart';
|
||||||
|
|
||||||
|
class MessagePopupMenuButton extends StatelessWidget {
|
||||||
|
final Event event;
|
||||||
|
final double height;
|
||||||
|
final void Function() onReply;
|
||||||
|
final void Function() onSelect;
|
||||||
|
|
||||||
|
const MessagePopupMenuButton({
|
||||||
|
required this.event,
|
||||||
|
required this.onReply,
|
||||||
|
required this.onSelect,
|
||||||
|
this.height = 38,
|
||||||
|
super.key,
|
||||||
|
});
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return SizedBox(
|
||||||
|
width: height,
|
||||||
|
height: height,
|
||||||
|
child: PopupMenuButton(
|
||||||
|
iconSize: height / 2,
|
||||||
|
itemBuilder: (context) => [
|
||||||
|
PopupMenuItem(
|
||||||
|
onTap: onSelect,
|
||||||
|
child: Row(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
const Icon(Icons.check_box_outlined),
|
||||||
|
const SizedBox(width: 16),
|
||||||
|
Text(L10n.of(context)!.select),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
PopupMenuItem(
|
||||||
|
onTap: onReply,
|
||||||
|
child: Row(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
const Icon(Icons.reply_outlined),
|
||||||
|
const SizedBox(width: 16),
|
||||||
|
Text(L10n.of(context)!.reply),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue