From 67499020cb25eeaa51a38e82b740be291390cdb7 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Fri, 30 Oct 2020 17:04:12 +0530 Subject: [PATCH 1/6] feat: Tried fix --- lib/src/reaction_picker.dart | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/lib/src/reaction_picker.dart b/lib/src/reaction_picker.dart index bf4c4ed0..87e413ed 100644 --- a/lib/src/reaction_picker.dart +++ b/lib/src/reaction_picker.dart @@ -20,6 +20,7 @@ class ReactionPicker extends StatelessWidget { @override Widget build(BuildContext context) { + var user = StreamChat.of(context).user; final reactionIcons = StreamChatTheme.of(context).reactionIcons; return Material( color: messageTheme.reactionsBackgroundColor, @@ -29,7 +30,7 @@ class ReactionPicker extends StatelessWidget { ), child: Row( crossAxisAlignment: CrossAxisAlignment.start, - mainAxisAlignment: MainAxisAlignment.center, + mainAxisAlignment: user.id == message.user.id ? MainAxisAlignment.end : MainAxisAlignment.start, mainAxisSize: MainAxisSize.min, children: reactionIcons.map((reactionIcon) { final ownReactionIndex = message.ownReactions?.indexWhere( From f10d63f713ae0c76b5313f7dde5a322c272f3007 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Fri, 30 Oct 2020 17:10:06 +0530 Subject: [PATCH 2/6] feat: Tried fix --- lib/src/reaction_picker.dart | 67 +++++++++++++++++++----------------- 1 file changed, 36 insertions(+), 31 deletions(-) diff --git a/lib/src/reaction_picker.dart b/lib/src/reaction_picker.dart index 87e413ed..3a0600fe 100644 --- a/lib/src/reaction_picker.dart +++ b/lib/src/reaction_picker.dart @@ -29,37 +29,42 @@ class ReactionPicker extends StatelessWidget { borderRadius: BorderRadius.circular(24), ), child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - mainAxisAlignment: user.id == message.user.id ? MainAxisAlignment.end : MainAxisAlignment.start, - 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(), - ), + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.end, + mainAxisSize: MainAxisSize.min, + children: [ + if(user.id == message.id) + SizedBox( + width: 50.0, + ), + ...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(), + ]), ); } From d36b1c64ea4c408725f44ca72f1e680065ebc7f2 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Fri, 30 Oct 2020 17:17:55 +0530 Subject: [PATCH 3/6] feat: Tried fix --- lib/src/message_reactions_modal.dart | 16 ++++++++++------ lib/src/reaction_picker.dart | 10 ++-------- 2 files changed, 12 insertions(+), 14 deletions(-) diff --git a/lib/src/message_reactions_modal.dart b/lib/src/message_reactions_modal.dart index 99a48730..af1d81ee 100644 --- a/lib/src/message_reactions_modal.dart +++ b/lib/src/message_reactions_modal.dart @@ -66,12 +66,16 @@ class MessageReactionsModal extends StatelessWidget { (message.status == MessageSendingStatus.SENT || message.status == null)) Align( - alignment: Alignment(-0.3, 0.0), - child: ReactionPicker( - message: message, - messageTheme: messageTheme, - ), - ), + alignment: Alignment(-0.3, 0.0), + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + ReactionPicker( + message: message, + messageTheme: messageTheme, + ), + ], + )), IgnorePointer( child: MessageWidget( key: Key('MessageWidget'), diff --git a/lib/src/reaction_picker.dart b/lib/src/reaction_picker.dart index 3a0600fe..e4a8bdf8 100644 --- a/lib/src/reaction_picker.dart +++ b/lib/src/reaction_picker.dart @@ -20,7 +20,6 @@ class ReactionPicker extends StatelessWidget { @override Widget build(BuildContext context) { - var user = StreamChat.of(context).user; final reactionIcons = StreamChatTheme.of(context).reactionIcons; return Material( color: messageTheme.reactionsBackgroundColor, @@ -32,12 +31,7 @@ class ReactionPicker extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.end, mainAxisSize: MainAxisSize.min, - children: [ - if(user.id == message.id) - SizedBox( - width: 50.0, - ), - ...reactionIcons.map((reactionIcon) { + children: reactionIcons.map((reactionIcon) { final ownReactionIndex = message.ownReactions?.indexWhere( (reaction) => reaction.type == reactionIcon.type) ?? -1; @@ -64,7 +58,7 @@ class ReactionPicker extends StatelessWidget { }, ); }).toList(), - ]), + ), ); } From 5ff432eb794e41389f385de1eb19fb971addab92 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Fri, 30 Oct 2020 17:21:45 +0530 Subject: [PATCH 4/6] feat: Tried fix --- lib/src/message_reactions_modal.dart | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/lib/src/message_reactions_modal.dart b/lib/src/message_reactions_modal.dart index af1d81ee..7e1e100a 100644 --- a/lib/src/message_reactions_modal.dart +++ b/lib/src/message_reactions_modal.dart @@ -36,6 +36,7 @@ class MessageReactionsModal extends StatelessWidget { @override Widget build(BuildContext context) { + var user = StreamChat.of(context).user; return GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { @@ -66,16 +67,12 @@ class MessageReactionsModal extends StatelessWidget { (message.status == MessageSendingStatus.SENT || message.status == null)) Align( - alignment: Alignment(-0.3, 0.0), - child: Row( - mainAxisSize: MainAxisSize.min, - children: [ - ReactionPicker( - message: message, - messageTheme: messageTheme, - ), - ], - )), + alignment: Alignment(-0.3 + (user.id == message.id ? 0.2 : 0.0), 0.0), + child: ReactionPicker( + message: message, + messageTheme: messageTheme, + ), + ), IgnorePointer( child: MessageWidget( key: Key('MessageWidget'), From b39038d0ab1a8cfb66fe8423ca14f5b9538d7981 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Fri, 30 Oct 2020 17:56:31 +0530 Subject: [PATCH 5/6] feat: Alignment is now calculated --- lib/src/message_reactions_modal.dart | 28 +++++++++++++++++++--------- 1 file changed, 19 insertions(+), 9 deletions(-) diff --git a/lib/src/message_reactions_modal.dart b/lib/src/message_reactions_modal.dart index 7e1e100a..559e475c 100644 --- a/lib/src/message_reactions_modal.dart +++ b/lib/src/message_reactions_modal.dart @@ -36,7 +36,17 @@ class MessageReactionsModal extends StatelessWidget { @override Widget build(BuildContext context) { + var size = MediaQuery.of(context).size; var user = StreamChat.of(context).user; + + var roughMaxSize = 2 * size.width / 3; + var roughSentenceSize = message.text.length * messageTheme.messageText.fontSize * 1.2; + var divFactor = roughSentenceSize / roughMaxSize; + + print(roughMaxSize); + print(roughSentenceSize); + print(divFactor); + return GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { @@ -67,7 +77,7 @@ class MessageReactionsModal extends StatelessWidget { (message.status == MessageSendingStatus.SENT || message.status == null)) Align( - alignment: Alignment(-0.3 + (user.id == message.id ? 0.2 : 0.0), 0.0), + alignment: Alignment(user.id == message.user.id ? (divFactor > 1.0 ? 0.0 : (1.0 - divFactor)) : (divFactor > 1.0 ? 0.0 : -(1.0 - divFactor)), 0.0), child: ReactionPicker( message: message, messageTheme: messageTheme, @@ -144,10 +154,10 @@ class MessageReactionsModal extends StatelessWidget { alignment: WrapAlignment.start, children: message.latestReactions .map((e) => _buildReaction( - e, - currentUser, - context, - )) + e, + currentUser, + context, + )) .toList(), ), ), @@ -160,10 +170,10 @@ class MessageReactionsModal extends StatelessWidget { } Widget _buildReaction( - Reaction reaction, - User currentUser, - BuildContext context, - ) { + Reaction reaction, + User currentUser, + BuildContext context, + ) { final isCurrentUser = reaction.user.id == currentUser.id; return ConstrainedBox( constraints: BoxConstraints.loose(Size( From 2859c257e9e193f7f77c5e5e7318be9bccf17aea Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Fri, 30 Oct 2020 17:58:53 +0530 Subject: [PATCH 6/6] removed print and dartfmt --- lib/src/message_reactions_modal.dart | 29 ++++++------- lib/src/reaction_picker.dart | 62 ++++++++++++++-------------- 2 files changed, 46 insertions(+), 45 deletions(-) diff --git a/lib/src/message_reactions_modal.dart b/lib/src/message_reactions_modal.dart index 559e475c..1c3c3e0f 100644 --- a/lib/src/message_reactions_modal.dart +++ b/lib/src/message_reactions_modal.dart @@ -40,13 +40,10 @@ class MessageReactionsModal extends StatelessWidget { var user = StreamChat.of(context).user; var roughMaxSize = 2 * size.width / 3; - var roughSentenceSize = message.text.length * messageTheme.messageText.fontSize * 1.2; + var roughSentenceSize = + message.text.length * messageTheme.messageText.fontSize * 1.2; var divFactor = roughSentenceSize / roughMaxSize; - print(roughMaxSize); - print(roughSentenceSize); - print(divFactor); - return GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { @@ -77,7 +74,11 @@ class MessageReactionsModal extends StatelessWidget { (message.status == MessageSendingStatus.SENT || message.status == null)) Align( - alignment: Alignment(user.id == message.user.id ? (divFactor > 1.0 ? 0.0 : (1.0 - divFactor)) : (divFactor > 1.0 ? 0.0 : -(1.0 - divFactor)), 0.0), + alignment: Alignment( + user.id == message.user.id + ? (divFactor > 1.0 ? 0.0 : (1.0 - divFactor)) + : (divFactor > 1.0 ? 0.0 : -(1.0 - divFactor)), + 0.0), child: ReactionPicker( message: message, messageTheme: messageTheme, @@ -154,10 +155,10 @@ class MessageReactionsModal extends StatelessWidget { alignment: WrapAlignment.start, children: message.latestReactions .map((e) => _buildReaction( - e, - currentUser, - context, - )) + e, + currentUser, + context, + )) .toList(), ), ), @@ -170,10 +171,10 @@ class MessageReactionsModal extends StatelessWidget { } Widget _buildReaction( - Reaction reaction, - User currentUser, - BuildContext context, - ) { + Reaction reaction, + User currentUser, + BuildContext context, + ) { final isCurrentUser = reaction.user.id == currentUser.id; return ConstrainedBox( constraints: BoxConstraints.loose(Size( diff --git a/lib/src/reaction_picker.dart b/lib/src/reaction_picker.dart index e4a8bdf8..e7d302e6 100644 --- a/lib/src/reaction_picker.dart +++ b/lib/src/reaction_picker.dart @@ -28,37 +28,37 @@ class ReactionPicker extends StatelessWidget { borderRadius: BorderRadius.circular(24), ), child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - mainAxisAlignment: MainAxisAlignment.end, - 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(), - ), + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.end, + 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(), + ), ); }