align reaction picker bubbles

2020-10-29 12:49:25 +01:00
parent 8424e3a972
commit daf028d805
4 changed files with 95 additions and 82 deletions
@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:stream_chat_flutter/src/reaction_bubble.dart';

 import '../stream_chat_flutter.dart';

@@ -22,59 +21,44 @@ class ReactionPicker extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final reactionIcons = StreamChatTheme.of(context).reactionIcons;
-    return Stack(
-      fit: StackFit.passthrough,
-      children: [
-        Material(
-          color: messageTheme.reactionsBackgroundColor,
-          clipBehavior: Clip.hardEdge,
-          shape: RoundedRectangleBorder(
-            borderRadius: BorderRadius.circular(24),
-          ),
-          child: Row(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            mainAxisAlignment: MainAxisAlignment.center,
-            mainAxisSize: MainAxisSize.min,
-            children: reactionIcons.map((reactionIcon) {
-              final ownReactionIndex = message.ownReactions?.indexWhere(
-                      (reaction) => reaction.type == reactionIcon.type) ??
-                  -1;
-              return IconButton(
-                iconSize: 24,
-                icon: Icon(
-                  reactionIcon.iconData,
-                  color: ownReactionIndex != -1
-                      ? StreamChatTheme.of(context).accentColor
-                      : Theme.of(context).iconTheme.color.withOpacity(.5),
-                ),
-                onPressed: () {
-                  if (ownReactionIndex != -1) {
-                    removeReaction(
-                      context,
-                      message.ownReactions[ownReactionIndex],
-                    );
-                  } else {
-                    sendReaction(
-                      context,
-                      reactionIcon.type,
-                    );
-                  }
-                },
-              );
-            }).toList(),
-          ),
-        ),
-        Positioned(
-          right: 14,
-          bottom: 0,
-          child: CustomPaint(
-            painter: ReactionBubblePainter(
-              messageTheme.reactionsBackgroundColor,
-              messageTheme.reactionsBorderColor,
+    return Material(
+      color: messageTheme.reactionsBackgroundColor,
+      clipBehavior: Clip.hardEdge,
+      shape: RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(24),
+      ),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        mainAxisAlignment: MainAxisAlignment.center,
+        mainAxisSize: MainAxisSize.min,
+        children: reactionIcons.map((reactionIcon) {
+          final ownReactionIndex = message.ownReactions?.indexWhere(
+                  (reaction) => reaction.type == reactionIcon.type) ??
+              -1;
+          return IconButton(
+            iconSize: 24,
+            icon: Icon(
+              reactionIcon.iconData,
+              color: ownReactionIndex != -1
+                  ? StreamChatTheme.of(context).accentColor
+                  : Theme.of(context).iconTheme.color.withOpacity(.5),
            ),
-          ),
-        ),
-      ],
+            onPressed: () {
+              if (ownReactionIndex != -1) {
+                removeReaction(
+                  context,
+                  message.ownReactions[ownReactionIndex],
+                );
+              } else {
+                sendReaction(
+                  context,
+                  reactionIcon.type,
+                );
+              }
+            },
+          );
+        }).toList(),
+      ),
    );
  }