remove reaction by event
This commit is contained in:
@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
|
|||||||
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
||||||
|
|
||||||
void main() async {
|
void main() async {
|
||||||
final client = Client('qk4nn7rpcn75');
|
final client = Client('qk4nn7rpcn75', logLevel: Level.INFO);
|
||||||
|
|
||||||
await client.setUser(
|
await client.setUser(
|
||||||
User(id: 'wild-breeze-7'),
|
User(id: 'wild-breeze-7'),
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
|
|||||||
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
||||||
|
|
||||||
void main() async {
|
void main() async {
|
||||||
final client = Client('qk4nn7rpcn75');
|
final client = Client('qk4nn7rpcn75', logLevel: Level.INFO);
|
||||||
|
|
||||||
await client.setUser(
|
await client.setUser(
|
||||||
User(id: 'wild-breeze-7'),
|
User(id: 'wild-breeze-7'),
|
||||||
|
|||||||
+118
-67
@@ -3,6 +3,7 @@ import 'package:chewie/chewie.dart';
|
|||||||
import 'package:date_format/date_format.dart';
|
import 'package:date_format/date_format.dart';
|
||||||
import 'package:flutter/foundation.dart';
|
import 'package:flutter/foundation.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter/widgets.dart';
|
||||||
import 'package:flutter_markdown/flutter_markdown.dart';
|
import 'package:flutter_markdown/flutter_markdown.dart';
|
||||||
import 'package:stream_chat/stream_chat.dart';
|
import 'package:stream_chat/stream_chat.dart';
|
||||||
import 'package:stream_chat_flutter/src/stream_channel.dart';
|
import 'package:stream_chat_flutter/src/stream_channel.dart';
|
||||||
@@ -222,18 +223,19 @@ class _MessageWidgetState extends State<MessageWidget>
|
|||||||
);
|
);
|
||||||
|
|
||||||
if (widget.message.text.trim().isNotEmpty) {
|
if (widget.message.text.trim().isNotEmpty) {
|
||||||
final topPadding = widget.message.latestReactions.isNotEmpty ? 36.0 : 0.0;
|
final topPadding =
|
||||||
|
widget.message.reactionCounts?.isNotEmpty == true ? 36.0 : 0.0;
|
||||||
column.children.add(Stack(
|
column.children.add(Stack(
|
||||||
overflow: Overflow.visible,
|
overflow: Overflow.visible,
|
||||||
|
alignment: Alignment.centerRight,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
widget.message.latestReactions.isNotEmpty
|
Positioned(
|
||||||
? Positioned(
|
left: isMyMessage ? 0 : null,
|
||||||
left: isMyMessage ? 0 : null,
|
right: !isMyMessage ? 0 : null,
|
||||||
right: !isMyMessage ? 0 : null,
|
top: 0,
|
||||||
top: 0,
|
child: _buildReactions(isMyMessage)),
|
||||||
child: _buildReactions(isMyMessage))
|
AnimatedContainer(
|
||||||
: SizedBox(),
|
duration: Duration(milliseconds: 300),
|
||||||
Container(
|
|
||||||
margin: EdgeInsets.only(
|
margin: EdgeInsets.only(
|
||||||
top: nOfAttachmentWidgets > 0 ? (topPadding) : (topPadding),
|
top: nOfAttachmentWidgets > 0 ? (topPadding) : (topPadding),
|
||||||
),
|
),
|
||||||
@@ -256,69 +258,111 @@ class _MessageWidgetState extends State<MessageWidget>
|
|||||||
return GestureDetector(
|
return GestureDetector(
|
||||||
child: column,
|
child: column,
|
||||||
onLongPress: () {
|
onLongPress: () {
|
||||||
showModalBottomSheet(
|
_showMessageBottomSheet(context);
|
||||||
context: context,
|
});
|
||||||
builder: (context) {
|
}
|
||||||
final fontSize = 40.0;
|
|
||||||
final textStyle = TextStyle(
|
void _showMessageBottomSheet(BuildContext context) {
|
||||||
fontSize: fontSize,
|
showModalBottomSheet(
|
||||||
);
|
context: context,
|
||||||
return Row(
|
builder: (context) {
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
final fontSize = 40.0;
|
||||||
mainAxisSize: MainAxisSize.min,
|
final textStyle = TextStyle(
|
||||||
children: reactionToEmoji.keys.map((reactionType) {
|
fontSize: fontSize,
|
||||||
return IconButton(
|
);
|
||||||
iconSize: fontSize + 10,
|
return Row(
|
||||||
icon: Text(
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
reactionToEmoji[reactionType],
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
style: textStyle,
|
mainAxisSize: MainAxisSize.min,
|
||||||
),
|
children: reactionToEmoji.keys.map((reactionType) {
|
||||||
onPressed: () {
|
final ownReactionIndex = widget.message.ownReactions
|
||||||
|
.indexWhere((reaction) => reaction.type == reactionType);
|
||||||
|
return Column(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.start,
|
||||||
|
children: <Widget>[
|
||||||
|
IconButton(
|
||||||
|
iconSize: fontSize + 10,
|
||||||
|
icon: Text(
|
||||||
|
reactionToEmoji[reactionType],
|
||||||
|
style: textStyle,
|
||||||
|
),
|
||||||
|
onPressed: () {
|
||||||
|
if (ownReactionIndex != -1) {
|
||||||
|
removeReaction(reactionType);
|
||||||
|
} else {
|
||||||
sendReaction(reactionType);
|
sendReaction(reactionType);
|
||||||
},
|
}
|
||||||
);
|
},
|
||||||
}).toList(),
|
),
|
||||||
);
|
ownReactionIndex != -1
|
||||||
});
|
? Text(widget.message.ownReactions[ownReactionIndex].score
|
||||||
|
.toString())
|
||||||
|
: SizedBox(),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}).toList(),
|
||||||
|
);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
Widget _buildReactions(bool isMyMessage) {
|
Widget _buildReactions(bool isMyMessage) {
|
||||||
return Padding(
|
return Padding(
|
||||||
padding: const EdgeInsets.symmetric(vertical: 2.0),
|
padding: const EdgeInsets.symmetric(vertical: 2.0),
|
||||||
child: Stack(
|
child: GestureDetector(
|
||||||
overflow: Overflow.visible,
|
onTap: () {
|
||||||
children: <Widget>[
|
_showMessageBottomSheet(context);
|
||||||
widget.message.latestReactions.isNotEmpty
|
},
|
||||||
? Positioned(
|
child: Stack(
|
||||||
left: isMyMessage ? 0 : null,
|
overflow: Overflow.visible,
|
||||||
right: !isMyMessage ? 0 : null,
|
children: <Widget>[
|
||||||
bottom: 1,
|
widget.message.reactionCounts?.isNotEmpty == true
|
||||||
child: CustomPaint(
|
? Positioned(
|
||||||
painter: ReactionBubblePainter(),
|
left: isMyMessage ? 0 : null,
|
||||||
),
|
right: !isMyMessage ? 0 : null,
|
||||||
)
|
bottom: 2,
|
||||||
: SizedBox(),
|
child: CustomPaint(
|
||||||
AnimatedContainer(
|
painter: ReactionBubblePainter(),
|
||||||
transform: Matrix4.translationValues(
|
),
|
||||||
-16 * (isMyMessage ? 1.0 : -1.0), 0, 0),
|
)
|
||||||
padding: widget.message.latestReactions.isNotEmpty
|
: SizedBox(),
|
||||||
? const EdgeInsets.all(8)
|
Container(
|
||||||
: EdgeInsets.zero,
|
transform: Matrix4.translationValues(
|
||||||
decoration: BoxDecoration(
|
((widget.message.reactionCounts?.length ?? 0) * 10) *
|
||||||
color: Colors.black,
|
(isMyMessage ? -1.0 : 1.0),
|
||||||
borderRadius: BorderRadius.all(Radius.circular(14))),
|
0,
|
||||||
duration: Duration(milliseconds: 300),
|
0,
|
||||||
child: Row(
|
),
|
||||||
mainAxisSize: MainAxisSize.max,
|
padding: widget.message.reactionCounts?.isNotEmpty == true
|
||||||
mainAxisAlignment: MainAxisAlignment.start,
|
? const EdgeInsets.all(8)
|
||||||
children: <Widget>[]
|
: EdgeInsets.zero,
|
||||||
..addAll(widget.message.latestReactions.map((reaction) {
|
decoration: BoxDecoration(
|
||||||
return Text(reactionToEmoji[reaction.type] ?? '?');
|
color: Colors.black,
|
||||||
})),
|
borderRadius: BorderRadius.all(Radius.circular(14))),
|
||||||
|
child: (widget.message.reactionCounts != null &&
|
||||||
|
widget.message.reactionCounts.isNotEmpty)
|
||||||
|
? Row(
|
||||||
|
mainAxisSize: MainAxisSize.max,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.start,
|
||||||
|
children: widget.message.reactionCounts.keys
|
||||||
|
.map((reactionType) {
|
||||||
|
return Text(
|
||||||
|
reactionToEmoji[reactionType] ?? '?',
|
||||||
|
) as Widget; //TODO refactor
|
||||||
|
}).toList()
|
||||||
|
..add(Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 4.0),
|
||||||
|
child: Text(
|
||||||
|
widget.message.reactionCounts.values
|
||||||
|
.fold(0, (t, v) => v + t)
|
||||||
|
.toString(),
|
||||||
|
style: TextStyle(color: Colors.white),
|
||||||
|
),
|
||||||
|
)))
|
||||||
|
: SizedBox(),
|
||||||
),
|
),
|
||||||
),
|
],
|
||||||
],
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -339,6 +383,13 @@ class _MessageWidgetState extends State<MessageWidget>
|
|||||||
Navigator.of(context).pop();
|
Navigator.of(context).pop();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
void removeReaction(String reactionType) {
|
||||||
|
StreamChannel.of(context)
|
||||||
|
.channel
|
||||||
|
.deleteReaction(widget.message.id, reactionType);
|
||||||
|
Navigator.of(context).pop();
|
||||||
|
}
|
||||||
|
|
||||||
Widget _buildImage(
|
Widget _buildImage(
|
||||||
bool isMyMessage,
|
bool isMyMessage,
|
||||||
bool isLastUser,
|
bool isLastUser,
|
||||||
@@ -455,9 +506,9 @@ class ReactionBubblePainter extends CustomPainter {
|
|||||||
void paint(Canvas canvas, Size size) {
|
void paint(Canvas canvas, Size size) {
|
||||||
final paint = Paint()..color = Colors.black;
|
final paint = Paint()..color = Colors.black;
|
||||||
final path = Path();
|
final path = Path();
|
||||||
path.arcToPoint(Offset(-5, 0));
|
path.arcToPoint(Offset(-6, -6));
|
||||||
path.arcToPoint(Offset(0, 10), radius: Radius.circular(16));
|
path.arcToPoint(Offset(0, 10));
|
||||||
path.arcToPoint(Offset(5, 0), radius: Radius.circular(16));
|
path.arcToPoint(Offset(6, -6));
|
||||||
canvas.drawPath(path, paint);
|
canvas.drawPath(path, paint);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user