talksik/stream-chat-flutter
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: Added reaction list modal animations

Browse Source
This commit is contained in:
Deven Joshi
2020-11-20 13:38:15 +05:30
parent 404ec4c89d
commit f9231e93b3
1 changed files with 82 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/src/message_reactions_modal.dart
+82 -64
View File
@@ -86,27 +86,35 @@ class MessageReactionsModal extends StatelessWidget {
messageTheme: messageTheme, messageTheme: messageTheme,
), ),
), ),
IgnorePointer( TweenAnimationBuilder<double>(
child: MessageWidget( tween: Tween(begin: 0.0, end: 1.0),
key: Key('MessageWidget'), duration: Duration(milliseconds: 300),
reverse: reverse, builder: (context, val, snapshot) {
message: message.copyWith( return Transform.scale(
text: message.text.length > 200 scale: val,
? '${message.text.substring(0, 200)}...' child: IgnorePointer(
: message.text, child: MessageWidget(
), key: Key('MessageWidget'),
messageTheme: messageTheme, reverse: reverse,
showReactions: false, message: message.copyWith(
showUsername: false, text: message.text.length > 200
showUserAvatar: showUserAvatar, ? '${message.text.substring(0, 200)}...'
showReplyIndicator: false, : message.text,
showTimestamp: false, ),
translateUserAvatar: false, messageTheme: messageTheme,
showSendingIndicator: DisplayWidget.gone, showReactions: false,
shape: messageShape, showUsername: false,
showReactionPickerIndicator: true, showUserAvatar: showUserAvatar,
), showReplyIndicator: false,
), showTimestamp: false,
translateUserAvatar: false,
showSendingIndicator: DisplayWidget.gone,
shape: messageShape,
showReactionPickerIndicator: true,
),
),
);
}),
SizedBox( SizedBox(
height: 16, height: 16,
), ),
@@ -178,50 +186,60 @@ class MessageReactionsModal extends StatelessWidget {
BuildContext context, BuildContext context,
) { ) {
final isCurrentUser = reaction.user.id == currentUser.id; final isCurrentUser = reaction.user.id == currentUser.id;
return ConstrainedBox( return TweenAnimationBuilder<double>(
constraints: BoxConstraints.loose(Size( tween: Tween(begin: 0.0, end: 1.0),
64, duration: Duration(milliseconds: 300),
98, curve: Curves.easeInOut,
)), builder: (context, val, snapshot) {
child: Column( return Transform.scale(
mainAxisSize: MainAxisSize.min, scale: val,
mainAxisAlignment: MainAxisAlignment.start, child: ConstrainedBox(
crossAxisAlignment: CrossAxisAlignment.center, constraints: BoxConstraints.loose(Size(
children: [ 64,
Stack( 98,
children: [ )),
UserAvatar( child: Column(
onTap: onUserAvatarTap, mainAxisSize: MainAxisSize.min,
user: reaction.user, mainAxisAlignment: MainAxisAlignment.start,
constraints: BoxConstraints.tightFor( crossAxisAlignment: CrossAxisAlignment.center,
height: 64, children: [
width: 64, Stack(
), children: [
borderRadius: BorderRadius.circular(32), UserAvatar(
), onTap: onUserAvatarTap,
Positioned( user: reaction.user,
child: Align( constraints: BoxConstraints.tightFor(
alignment: Alignment.centerLeft, height: 64,
child: ReactionBubble( width: 64,
reactions: [reaction], ),
borderColor: messageTheme.reactionsBorderColor, borderRadius: BorderRadius.circular(32),
backgroundColor: messageTheme.reactionsBackgroundColor, ),
highlightOwnReactions: false, Positioned(
child: Align(
alignment: Alignment.centerLeft,
child: ReactionBubble(
reactions: [reaction],
borderColor: messageTheme.reactionsBorderColor,
backgroundColor:
messageTheme.reactionsBackgroundColor,
highlightOwnReactions: false,
),
),
bottom: 4,
left: isCurrentUser ? 0 : null,
right: isCurrentUser ? 0 : null,
),
],
), ),
), Text(
bottom: 4, reaction.user.name,
left: isCurrentUser ? 0 : null, style: Theme.of(context).textTheme.subtitle2,
right: isCurrentUser ? 0 : null, textAlign: TextAlign.center,
),
],
), ),
], ),
), );
Text( });
reaction.user.name,
style: Theme.of(context).textTheme.subtitle2,
textAlign: TextAlign.center,
),
],
),
);
} }
} }