From b95efa0ea5849e6feb493fcdc7bdb8760ebe3226 Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Mon, 3 Aug 2020 15:56:00 +0200 Subject: [PATCH] update components for splitview --- example/lib/split_view.dart | 53 +++++----- example/pubspec.yaml | 2 +- lib/src/message_widget.dart | 198 ++++++++++++++++++------------------ 3 files changed, 128 insertions(+), 125 deletions(-) diff --git a/example/lib/split_view.dart b/example/lib/split_view.dart index cbfd8798..f99e69fc 100644 --- a/example/lib/split_view.dart +++ b/example/lib/split_view.dart @@ -56,20 +56,20 @@ class _SplitViewState extends State { flex: 1, ), Flexible( - child: selectedChannel != null - ? StreamChannel( - key: ValueKey(selectedChannel.cid), - child: ChannelPage(), - channel: selectedChannel, - ) - : Scaffold( - body: Center( + child: Scaffold( + body: selectedChannel != null + ? StreamChannel( + key: ValueKey(selectedChannel.cid), + child: ChannelPage(), + channel: selectedChannel, + ) + : Center( child: Text( 'Pick a channel to show the messages 💬', - style: Theme.of(context).textTheme.headline, + style: Theme.of(context).textTheme.headline5, ), ), - ), + ), flex: 2, ), ], @@ -101,7 +101,6 @@ class ChannelListPage extends StatelessWidget { pagination: PaginationParams( limit: 20, ), - channelWidget: ChannelPage(), ), ), ); @@ -115,18 +114,26 @@ class ChannelPage extends StatelessWidget { @override Widget build(BuildContext context) { - return Scaffold( - appBar: ChannelHeader( - showBackButton: false, - ), - body: Column( - children: [ - Expanded( - child: MessageListView(), - ), - MessageInput(), - ], - ), + return Navigator( + onGenerateRoute: (settings) { + return MaterialPageRoute( + builder: (context) { + return Scaffold( + appBar: ChannelHeader( + showBackButton: false, + ), + body: Column( + children: [ + Expanded( + child: MessageListView(), + ), + MessageInput(), + ], + ), + ); + }, + ); + }, ); } } diff --git a/example/pubspec.yaml b/example/pubspec.yaml index fe8266eb..0e512cf6 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -1,7 +1,7 @@ name: example description: A new Flutter project. -version: 1.0.11+13 +version: 1.0.12+14 environment: sdk: ">=2.2.2 <3.0.0" diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 2fc448ad..a2020726 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -216,90 +216,83 @@ class _MessageWidgetState extends State { child: Transform( alignment: Alignment.center, transform: Matrix4.rotationY(widget.reverse ? pi : 0), - child: Container( + child: FractionallySizedBox( alignment: Alignment.centerLeft, - child: Container( - constraints: BoxConstraints.loose( - Size.fromWidth(MediaQuery.of(context).size.width * 0.8), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - mainAxisSize: MainAxisSize.min, - children: [ - IntrinsicWidth( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, + widthFactor: 0.75, + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.end, mainAxisSize: MainAxisSize.min, children: [ - Row( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.end, - mainAxisSize: MainAxisSize.min, - children: [ - if (widget.showUserAvatar == DisplayWidget.show) - _buildUserAvatar(), - SizedBox( - width: 6, + if (widget.showUserAvatar == DisplayWidget.show) + _buildUserAvatar(), + SizedBox( + width: 6, + ), + if (widget.showUserAvatar == DisplayWidget.hide) + SizedBox( + width: widget.messageTheme.avatarTheme.constraints + .maxWidth + + 8, + ), + Flexible( + child: Padding( + padding: widget.showReactions + ? EdgeInsets.only( + top: _reactionPadding, + ) + : EdgeInsets.zero, + child: PortalEntry( + portalAnchor: Alignment(0, 1), + childAnchor: Alignment.topRight, + portal: _buildReactionIndicator(context), + child: (widget.message.isDeleted && + widget.message.status != + MessageSendingStatus.FAILED_DELETE) + ? Transform( + alignment: Alignment.center, + transform: Matrix4.rotationY( + widget.reverse ? pi : 0), + child: DeletedMessage( + messageTheme: widget.messageTheme, + ), + ) + : Column( + crossAxisAlignment: + CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + ..._parseAttachments(context), + if (widget.message.text + .trim() + .isNotEmpty) + _buildTextBubble(context), + ], + ), ), - if (widget.showUserAvatar == DisplayWidget.hide) - SizedBox( - width: widget.messageTheme.avatarTheme - .constraints.maxWidth + - 8, - ), - Flexible( - child: Padding( - padding: widget.showReactions - ? EdgeInsets.only( - top: _reactionPadding, - ) - : EdgeInsets.zero, - child: PortalEntry( - portalAnchor: Alignment(0, 1), - childAnchor: Alignment.topRight, - portal: _buildReactionIndicator(context), - child: (widget.message.isDeleted && - widget.message.status != - MessageSendingStatus - .FAILED_DELETE) - ? Transform( - alignment: Alignment.center, - transform: Matrix4.rotationY( - widget.reverse ? pi : 0), - child: DeletedMessage( - messageTheme: widget.messageTheme, - ), - ) - : Column( - crossAxisAlignment: - CrossAxisAlignment.start, - mainAxisSize: MainAxisSize.min, - children: [ - ..._parseAttachments(context), - if (widget.message.text - .trim() - .isNotEmpty) - _buildTextBubble(context), - ], - ), - ), - ), - ), - ], + ), ), - if (widget.showReplyIndicator && - widget.message.replyCount > 0) - _buildReplyIndicator(leftPadding), ], ), - ), - if ((widget.message.createdAt != null && - widget.showTimestamp) || - widget.showUsername || - widget.readList?.isNotEmpty == true) - _buildBottomRow(leftPadding), - ], - ), + if (widget.showReplyIndicator && + widget.message.replyCount > 0) + _buildReplyIndicator(leftPadding), + ], + ), + if ((widget.message.createdAt != null && + widget.showTimestamp) || + widget.showUsername || + widget.readList?.isNotEmpty == true) + _buildBottomRow(leftPadding), + ], ), ), ), @@ -447,32 +440,35 @@ class _MessageWidgetState extends State { ? Container( child: GestureDetector( onTap: () => onLongPress(context), - child: Container( - width: MediaQuery.of(context).size.width * 0.3, - padding: const EdgeInsets.only( - bottom: 4.0, - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.center, - mainAxisSize: MainAxisSize.min, - children: [ - Transform( - transform: Matrix4.rotationY(widget.reverse ? pi : 0), - alignment: Alignment.center, - child: Container( - padding: const EdgeInsets.all(8), - decoration: BoxDecoration( - color: - Theme.of(context).brightness == Brightness.dark - ? Colors.white - : Colors.black, - borderRadius: BorderRadius.all(Radius.circular(14)), + child: FractionallySizedBox( + widthFactor: 0.3, + child: Padding( + padding: const EdgeInsets.only( + bottom: 4.0, + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + mainAxisSize: MainAxisSize.min, + children: [ + Transform( + transform: Matrix4.rotationY(widget.reverse ? pi : 0), + alignment: Alignment.center, + child: Container( + padding: const EdgeInsets.all(8), + decoration: BoxDecoration( + color: Theme.of(context).brightness == + Brightness.dark + ? Colors.white + : Colors.black, + borderRadius: + BorderRadius.all(Radius.circular(14)), + ), + child: _buildReactionsText(context), ), - child: _buildReactionsText(context), ), - ), - _buildReactionsTail(context), - ], + _buildReactionsTail(context), + ], + ), ), ), ),