diff --git a/packages/stream_chat_flutter/CHANGELOG.md b/packages/stream_chat_flutter/CHANGELOG.md index f41d94f6..6ad163e3 100644 --- a/packages/stream_chat_flutter/CHANGELOG.md +++ b/packages/stream_chat_flutter/CHANGELOG.md @@ -8,7 +8,9 @@ 🐞 Fixed - Fixed attachment picker ui. +- Fixed StreamChannelHeader and StreamThreadHeader subtitle alignment. - Fixed message widget thread indicator in reverse mode. +- [[#1044]](https://github.com/GetStream/stream-chat-flutter/issues/1044): Refactor StreamMessageWidget bottom row to use Text.rich. 🔄 Changed diff --git a/packages/stream_chat_flutter/lib/src/channel_info.dart b/packages/stream_chat_flutter/lib/src/channel_info.dart index b30058b9..9dcfb9b4 100644 --- a/packages/stream_chat_flutter/lib/src/channel_info.dart +++ b/packages/stream_chat_flutter/lib/src/channel_info.dart @@ -100,12 +100,10 @@ class StreamChannelInfo extends StatelessWidget { return alternativeWidget ?? const Offstage(); } - return Align( - child: StreamTypingIndicator( - parentId: parentId, - style: textStyle, - alternativeWidget: alternativeWidget, - ), + return StreamTypingIndicator( + parentId: parentId, + style: textStyle, + alternativeWidget: alternativeWidget, ); } diff --git a/packages/stream_chat_flutter/lib/src/message_widget.dart b/packages/stream_chat_flutter/lib/src/message_widget.dart index ae6e652c..03020a5b 100644 --- a/packages/stream_chat_flutter/lib/src/message_widget.dart +++ b/packages/stream_chat_flutter/lib/src/message_widget.dart @@ -878,7 +878,7 @@ class _StreamMessageWidgetState extends State const Offstage(); } - final children = []; + final children = []; final threadParticipants = widget.message.threadParticipants?.take(2); final showThreadParticipants = threadParticipants?.isNotEmpty == true; @@ -909,68 +909,72 @@ class _StreamMessageWidgetState extends State const usernameKey = Key('username'); children.addAll([ - if (showUsername) _buildUsername(usernameKey), + if (showUsername) WidgetSpan(child: _buildUsername(usernameKey)), if (showTimeStamp) - Text( - Jiffy(widget.message.createdAt.toLocal()).jm, - style: widget.messageTheme.createdAtStyle, + WidgetSpan( + child: Text( + Jiffy(widget.message.createdAt.toLocal()).jm, + style: widget.messageTheme.createdAtStyle, + ), + ), + if (showSendingIndicator) + WidgetSpan( + child: _buildSendingIndicator(), ), - if (showSendingIndicator) _buildSendingIndicator(), ]); final showThreadTail = !(hasUrlAttachments || isGiphy || isOnlyEmoji) && (showThreadReplyIndicator || showInChannel); - final threadIndicatorWidgets = [ + final threadIndicatorWidgets = [ if (showThreadTail) - Container( - margin: EdgeInsets.only( - bottom: context.textScaleFactor * - ((widget.messageTheme.repliesStyle?.fontSize ?? 1) / 2), - ), - child: CustomPaint( - size: const Size(16, 32) * context.textScaleFactor, - painter: _ThreadReplyPainter( - context: context, - color: widget.messageTheme.messageBorderColor, - reverse: widget.reverse, + WidgetSpan( + child: Container( + margin: EdgeInsets.only( + bottom: context.textScaleFactor * + ((widget.messageTheme.repliesStyle?.fontSize ?? 1) / 2), + ), + child: CustomPaint( + size: const Size(16, 32) * context.textScaleFactor, + painter: _ThreadReplyPainter( + context: context, + color: widget.messageTheme.messageBorderColor, + reverse: widget.reverse, + ), ), ), ), if (showInChannel || showThreadReplyIndicator) ...[ if (showThreadParticipants) - SizedBox.fromSize( - size: Size((threadParticipants!.length * 8.0) + 8, 16), - child: _buildThreadParticipantsIndicator(threadParticipants), + WidgetSpan( + child: SizedBox.fromSize( + size: Size((threadParticipants!.length * 8.0) + 8, 16), + child: _buildThreadParticipantsIndicator(threadParticipants), + ), + ), + WidgetSpan( + child: InkWell( + onTap: widget.onThreadTap != null ? onThreadTap : null, + child: Text(msg, style: widget.messageTheme.repliesStyle), ), - InkWell( - onTap: widget.onThreadTap != null ? onThreadTap : null, - child: Text(msg, style: widget.messageTheme.repliesStyle), ), ], ]; - return Row( - crossAxisAlignment: CrossAxisAlignment.end, - mainAxisAlignment: - widget.reverse ? MainAxisAlignment.end : MainAxisAlignment.start, - children: [ - if (showThreadTail && !widget.reverse) ...threadIndicatorWidgets, - ...children.map( - (child) { - Widget mappedChild = SizedBox( - height: context.textScaleFactor * 14, - child: child, - ); - if (child.key == usernameKey) { - mappedChild = Flexible(child: mappedChild); - } - return mappedChild; - }, - ), - if (showThreadTail && widget.reverse) - ...threadIndicatorWidgets.reversed, - ].insertBetween(const SizedBox(width: 8)), + if (widget.reverse) { + children.addAll(threadIndicatorWidgets.reversed); + } else { + children.insertAll(0, threadIndicatorWidgets); + } + + return Text.rich( + TextSpan( + children: [ + ...children, + ].insertBetween(const WidgetSpan(child: SizedBox(width: 8))), + ), + maxLines: 1, + textAlign: widget.reverse ? TextAlign.right : TextAlign.left, ); } @@ -1259,6 +1263,7 @@ class _StreamMessageWidgetState extends State ); if (isMessageRead) { child = Row( + mainAxisSize: MainAxisSize.min, children: [ if (memberCount > 2) Text( diff --git a/packages/stream_chat_flutter/lib/src/thread_header.dart b/packages/stream_chat_flutter/lib/src/thread_header.dart index f6f77a32..2767b76b 100644 --- a/packages/stream_chat_flutter/lib/src/thread_header.dart +++ b/packages/stream_chat_flutter/lib/src/thread_header.dart @@ -186,13 +186,11 @@ class StreamThreadHeader extends StatelessWidget ), const SizedBox(height: 2), if (showTypingIndicator) - Align( - child: StreamTypingIndicator( - channel: StreamChannel.of(context).channel, - style: channelHeaderTheme.subtitleStyle, - parentId: parent.id, - alternativeWidget: defaultSubtitle, - ), + StreamTypingIndicator( + channel: StreamChannel.of(context).channel, + style: channelHeaderTheme.subtitleStyle, + parentId: parent.id, + alternativeWidget: defaultSubtitle, ) else defaultSubtitle,