From 922208224d6f571f861f9e78fcec82d3a0e1860a Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Tue, 1 Dec 2020 16:19:02 +0530 Subject: [PATCH] feat: Added file attachment to pick attachment section --- lib/src/file_attachment.dart | 24 ++++++--- lib/src/message_input.dart | 94 +++++++++++++++++++++++------------- lib/src/message_widget.dart | 56 ++++++++++++--------- 3 files changed, 109 insertions(+), 65 deletions(-) diff --git a/lib/src/file_attachment.dart b/lib/src/file_attachment.dart index ebbf57f6..fd6f152a 100644 --- a/lib/src/file_attachment.dart +++ b/lib/src/file_attachment.dart @@ -6,11 +6,13 @@ import 'package:stream_chat_flutter/src/utils.dart'; class FileAttachment extends StatelessWidget { final Attachment attachment; final Size size; + final Widget trailing; const FileAttachment({ Key key, @required this.attachment, this.size, + this.trailing, }) : super(key: key); @override @@ -22,8 +24,13 @@ class FileAttachment extends StatelessWidget { }, child: Container( width: size?.width ?? 100, + margin: trailing != null ? EdgeInsets.only(top: 4.0) : null, decoration: BoxDecoration( color: Colors.white, + borderRadius: trailing != null ? BorderRadius.circular(16.0) : null, + border: trailing != null + ? Border.fromBorderSide(BorderSide(color: Color(0xFFE6E6E6))) + : null, ), child: ListTile( dense: true, @@ -45,14 +52,15 @@ class FileAttachment extends StatelessWidget { color: Colors.black.withOpacity(0.5), ), ), - trailing: IconButton( - icon: StreamSvgIcon.cloud_download( - color: Colors.black, - ), - onPressed: () { - launchURL(context, attachment.assetUrl); - }, - ), + trailing: trailing ?? + IconButton( + icon: StreamSvgIcon.cloud_download( + color: Colors.black, + ), + onPressed: () { + launchURL(context, attachment.assetUrl); + }, + ), ), ), ), diff --git a/lib/src/message_input.dart b/lib/src/message_input.dart index c2d3d7e6..4119be7d 100644 --- a/lib/src/message_input.dart +++ b/lib/src/message_input.dart @@ -1201,44 +1201,72 @@ class MessageInputState extends State { Widget _buildAttachments() { return _attachments.isEmpty ? Container() - : LimitedBox( - maxHeight: 104.0, - child: ListView( - scrollDirection: Axis.horizontal, - children: _attachments + : Column( + children: [ + ..._attachments + .where((e) => e.attachment.type == 'file') .map( - (attachment) => Padding( - padding: const EdgeInsets.all(8.0), - child: ClipRRect( - borderRadius: BorderRadius.circular(10), - child: Stack( - children: [ - AspectRatio( - aspectRatio: 1.0, - child: Container( - height: 104, - width: 104, - child: _buildAttachment(attachment), - ), - ), - _buildRemoveButton(attachment), - attachment.uploaded - ? SizedBox() - : Positioned.fill( - child: Center( - child: Padding( - padding: const EdgeInsets.all(16.0), - child: CircularProgressIndicator(), - ), - ), - ), - ], - ), + (e) => FileAttachment( + attachment: e.attachment, + size: Size( + MediaQuery.of(context).size.width * 0.6, + MediaQuery.of(context).size.height * 0.3, + ), + trailing: IconButton( + icon: StreamSvgIcon.close_small(), + onPressed: () { + setState(() { + _attachments.remove(e); + }); + }, ), ), ) .toList(), - ), + if (_attachments.any((e) => e.attachment.type != 'file')) + LimitedBox( + maxHeight: 104.0, + child: ListView( + scrollDirection: Axis.horizontal, + children: _attachments + .where((e) => e.attachment.type != 'file') + .map( + (attachment) => Padding( + padding: const EdgeInsets.all(8.0), + child: ClipRRect( + borderRadius: BorderRadius.circular(10), + child: Stack( + children: [ + AspectRatio( + aspectRatio: 1.0, + child: Container( + height: 104, + width: 104, + child: _buildAttachment(attachment), + ), + ), + _buildRemoveButton(attachment), + attachment.uploaded + ? SizedBox() + : Positioned.fill( + child: Center( + child: Padding( + padding: + const EdgeInsets.all(16.0), + child: + CircularProgressIndicator(), + ), + ), + ), + ], + ), + ), + ), + ) + .toList(), + ), + ), + ], ); } diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 3e83ac0d..6a35648d 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -225,6 +225,9 @@ class _MessageWidgetState extends State { var user = StreamChat.of(context).user; + bool hasFiles = + widget.message.attachments.any((element) => element.type == 'file'); + return Portal( child: Padding( padding: widget.padding ?? EdgeInsets.all(8), @@ -298,33 +301,38 @@ class _MessageWidgetState extends State { ), ) : Container( - decoration: BoxDecoration( - borderRadius: BorderRadius.only( - topLeft: Radius.circular(8.0), - topRight: Radius.circular(8.0), - bottomRight: Radius.circular(8.0), - ), - border: Border.fromBorderSide( - BorderSide( - color: Color(0xFFE6E6E6), - )), - color: widget.message.attachments - .where((element) => - element.type == 'file') - .isEmpty - ? Colors.transparent - : (user.id == - widget.message.user.id - ? Color(0xFFE6E6E6) - : Colors.white), - ), - padding: EdgeInsets.all(widget - .message.attachments + decoration: widget.message.attachments .where((element) => element.type == 'file') .isEmpty - ? 0.0 - : 2.0), + ? null + : BoxDecoration( + borderRadius: + BorderRadius.only( + topLeft: + Radius.circular(8.0), + topRight: + Radius.circular(8.0), + bottomRight: + Radius.circular(8.0), + ), + border: hasFiles + ? Border.fromBorderSide( + BorderSide( + color: + Color(0xFFE6E6E6), + )) + : null, + color: hasFiles + ? (user.id == + widget.message + .user.id + ? Color(0xFFE6E6E6) + : Colors.white) + : Colors.transparent, + ), + padding: EdgeInsets.all( + hasFiles ? 2.0 : 0.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start,