feat: Added reaction list modal animations

2020-11-20 13:38:15 +05:30
parent 404ec4c89d
commit f9231e93b3
1 changed files with 82 additions and 64 deletions
@@ -86,7 +86,13 @@ class MessageReactionsModal extends StatelessWidget {
                          messageTheme: messageTheme,
                        ),
                      ),
-                    IgnorePointer(
+                    TweenAnimationBuilder<double>(
+                        tween: Tween(begin: 0.0, end: 1.0),
+                        duration: Duration(milliseconds: 300),
+                        builder: (context, val, snapshot) {
+                          return Transform.scale(
+                            scale: val,
+                            child: IgnorePointer(
                              child: MessageWidget(
                                key: Key('MessageWidget'),
                                reverse: reverse,
@@ -107,6 +113,8 @@ class MessageReactionsModal extends StatelessWidget {
                                showReactionPickerIndicator: true,
                              ),
                            ),
+                          );
+                        }),
                    SizedBox(
                      height: 16,
                    ),
@@ -178,7 +186,14 @@ class MessageReactionsModal extends StatelessWidget {
    BuildContext context,
  ) {
    final isCurrentUser = reaction.user.id == currentUser.id;
-    return ConstrainedBox(
+    return TweenAnimationBuilder<double>(
+        tween: Tween(begin: 0.0, end: 1.0),
+        duration: Duration(milliseconds: 300),
+        curve: Curves.easeInOut,
+        builder: (context, val, snapshot) {
+          return Transform.scale(
+            scale: val,
+            child: ConstrainedBox(
              constraints: BoxConstraints.loose(Size(
                64,
                98,
@@ -205,7 +220,8 @@ class MessageReactionsModal extends StatelessWidget {
                          child: ReactionBubble(
                            reactions: [reaction],
                            borderColor: messageTheme.reactionsBorderColor,
-                    backgroundColor: messageTheme.reactionsBackgroundColor,
+                            backgroundColor:
+                                messageTheme.reactionsBackgroundColor,
                            highlightOwnReactions: false,
                          ),
                        ),
@@ -222,6 +238,8 @@ class MessageReactionsModal extends StatelessWidget {
                  ),
                ],
              ),
+            ),
          );
+        });
  }
 }