From ced6f394a7ed51409e292d84f1d1a51acb4f7984 Mon Sep 17 00:00:00 2001 From: Luis Pulido Date: Mon, 6 Apr 2020 13:08:44 -0400 Subject: [PATCH 01/10] fix for #12 Wrapped the TextField in a LimitedBox, gavethe MessageInput a new property for that which defaults to 150p --- lib/src/message_input.dart | 108 ++++++++++++++++++++----------------- 1 file changed, 58 insertions(+), 50 deletions(-) diff --git a/lib/src/message_input.dart b/lib/src/message_input.dart index b00c9f2d..f1025385 100644 --- a/lib/src/message_input.dart +++ b/lib/src/message_input.dart @@ -56,12 +56,13 @@ import 'stream_channel.dart'; /// The widget renders the ui based on the first ancestor of type [StreamChatTheme]. /// Modify it to change the widget appearance. class MessageInput extends StatefulWidget { - MessageInput({ - Key key, - this.onMessageSent, - this.parentMessage, - this.editMessage, - }) : super(key: key); + MessageInput( + {Key key, + this.onMessageSent, + this.parentMessage, + this.editMessage, + this.maxHeight = 150}) + : super(key: key); /// Message to edit final Message editMessage; @@ -72,6 +73,9 @@ class MessageInput extends StatefulWidget { /// Parent message in case of a thread final Message parentMessage; + /// Maximum Height for the TextField to grow before it starts scrolling + final double maxHeight; + @override _MessageInputState createState() => _MessageInputState(); } @@ -111,6 +115,7 @@ class _MessageInputState extends State { Flex _buildTextField(BuildContext context) { return Flex( direction: Axis.horizontal, + crossAxisAlignment: CrossAxisAlignment.end, children: [ _buildAttachmentButton(), _buildTextInput(context), @@ -133,54 +138,57 @@ class _MessageInputState extends State { Expanded _buildTextInput(BuildContext context) { return Expanded( - child: TextField( - key: Key('messageInputText'), - minLines: null, - maxLines: null, - onSubmitted: (_) { - _sendMessage(context); - }, - controller: _textController, - focusNode: _focusNode, - onChanged: (s) { - StreamChannel.of(context).channel.keyStroke(); + child: LimitedBox( + maxHeight: widget.maxHeight, + child: TextField( + key: Key('messageInputText'), + minLines: null, + maxLines: null, + onSubmitted: (_) { + _sendMessage(context); + }, + controller: _textController, + focusNode: _focusNode, + onChanged: (s) { + StreamChannel.of(context).channel.keyStroke(); - setState(() { - _messageIsPresent = s.trim().isNotEmpty; - }); + setState(() { + _messageIsPresent = s.trim().isNotEmpty; + }); - _commandsOverlay?.remove(); - _commandsOverlay = null; - _mentionsOverlay?.remove(); - _mentionsOverlay = null; + _commandsOverlay?.remove(); + _commandsOverlay = null; + _mentionsOverlay?.remove(); + _mentionsOverlay = null; - if (s.startsWith('/')) { - _commandsOverlay = _buildCommandsOverlayEntry(); - Overlay.of(context).insert(_commandsOverlay); - } + if (s.startsWith('/')) { + _commandsOverlay = _buildCommandsOverlayEntry(); + Overlay.of(context).insert(_commandsOverlay); + } - if (_textController.selection.isCollapsed && - (s[_textController.selection.start - 1] == '@' || - _textController.text - .substring(0, _textController.selection.start) - .split(' ') - .last - .contains('@'))) { - _mentionsOverlay = _buildMentionsOverlayEntry(); - Overlay.of(context).insert(_mentionsOverlay); - } - }, - onTap: () { - setState(() { - _typingStarted = true; - }); - }, - style: Theme.of(context).textTheme.body1, - autofocus: false, - decoration: InputDecoration( - hintText: 'Write a message', - prefixText: ' ', - border: InputBorder.none, + if (_textController.selection.isCollapsed && + (s[_textController.selection.start - 1] == '@' || + _textController.text + .substring(0, _textController.selection.start) + .split(' ') + .last + .contains('@'))) { + _mentionsOverlay = _buildMentionsOverlayEntry(); + Overlay.of(context).insert(_mentionsOverlay); + } + }, + onTap: () { + setState(() { + _typingStarted = true; + }); + }, + style: Theme.of(context).textTheme.body1, + autofocus: false, + decoration: InputDecoration( + hintText: 'Write a message', + prefixText: ' ', + border: InputBorder.none, + ), ), ), ); From 4a723cfd100072ba722ef43c4510eeda542336ea Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Tue, 7 Apr 2020 09:23:57 +0200 Subject: [PATCH 02/10] bump version --- CHANGELOG.md | 4 ++++ README.md | 2 +- pubspec.yaml | 2 +- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 431f48f9..bd93ed96 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## 0.1.15 + +- Fix MessageInput overflow + ## 0.1.14 - Add automatic keep alive to streamchat diff --git a/README.md b/README.md index 5bfb6907..eff6966c 100644 --- a/README.md +++ b/README.md @@ -30,7 +30,7 @@ The example is available under the [example](https://github.com/GetStream/stream ```yaml dependencies: - stream_chat_flutter: ^0.1.13 + stream_chat_flutter: ^0.1.15 ``` You should then run `flutter packages get` diff --git a/pubspec.yaml b/pubspec.yaml index 8055fa72..155134ed 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,7 +1,7 @@ name: stream_chat_flutter homepage: https://github.com/GetStream/stream-chat-flutter description: Stream Chat official Flutter SDK. Build your own chat experience using Dart and Flutter. -version: 0.1.14 +version: 0.1.15 environment: sdk: ">=2.3.0 <3.0.0" From 3fb13f364cf5e5685e973372a47708a5073c5418 Mon Sep 17 00:00:00 2001 From: Luis Pulido Date: Tue, 7 Apr 2020 11:10:35 -0400 Subject: [PATCH 03/10] added user's name to message box --- lib/src/message_widget.dart | 23 +++++++++++++++++------ 1 file changed, 17 insertions(+), 6 deletions(-) diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 8eaed2a5..9fe748de 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -980,12 +980,23 @@ class _MessageWidgetState extends State Widget _buildTimestamp(Alignment alignment) { return Padding( padding: const EdgeInsets.only(top: 5.0), - child: widget.message.createdAt != null - ? Text( - Jiffy(widget.message.createdAt.toLocal()).format('HH:mm'), - style: _messageTheme.createdAt, - ) - : SizedBox(), + child: RichText( + text: TextSpan( + style: _messageTheme.createdAt, + children: [ + if (!_isMyMessage) + TextSpan( + text: widget.message.user.name, + style: TextStyle(fontWeight: FontWeight.bold), + ), + if (widget.message.createdAt != null) + TextSpan( + text: + Jiffy(widget.message.createdAt.toLocal()).format(' HH:mm'), + ), + ], + ), + ), ); } From ff68d8f9b1cbe6369f3eb02899ca1472957d31bd Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 09:48:29 +0200 Subject: [PATCH 04/10] make username next to timestamp opt-in --- lib/src/message_list_view.dart | 5 +++++ lib/src/message_widget.dart | 6 +++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/lib/src/message_list_view.dart b/lib/src/message_list_view.dart index 9d51458b..a0bf35f4 100644 --- a/lib/src/message_list_view.dart +++ b/lib/src/message_list_view.dart @@ -61,6 +61,7 @@ class MessageListView extends StatefulWidget { this.parentMessage, this.threadBuilder, this.onThreadTap, + this.showOtherMessageUsername = false, }) : super(key: key); /// Function used to build a custom message widget @@ -79,6 +80,9 @@ class MessageListView extends StatefulWidget { /// Parent message in case of a thread final Message parentMessage; + /// If true show the other users username next to the timestamp of the message + final bool showOtherMessageUsername; + @override _MessageListViewState createState() => _MessageListViewState(); } @@ -193,6 +197,7 @@ class _MessageListViewState extends State { message: message, nextMessage: nextMessage, onThreadTap: _onThreadTap, + showOtherMessageUsername: widget.showOtherMessageUsername, ); }, childCount: _messages.length + 2, diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 9fe748de..10b787da 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -38,6 +38,7 @@ class MessageWidget extends StatefulWidget { this.onMessageActions, this.isParent = false, this.onMentionTap, + this.showOtherMessageUsername = false, }) : super(key: key); /// Function called on mention tap @@ -46,6 +47,9 @@ class MessageWidget extends StatefulWidget { /// Function called on long press final Function(BuildContext, Message) onMessageActions; + /// If true show the other users username next to the timestamp of the message + final bool showOtherMessageUsername; + /// This message final Message message; @@ -984,7 +988,7 @@ class _MessageWidgetState extends State text: TextSpan( style: _messageTheme.createdAt, children: [ - if (!_isMyMessage) + if (!_isMyMessage && widget.showOtherMessageUsername) TextSpan( text: widget.message.user.name, style: TextStyle(fontWeight: FontWeight.bold), From 0b934047e2cf6f247d04d4f145a98da0883ded44 Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 09:49:51 +0200 Subject: [PATCH 05/10] version bump --- CHANGELOG.md | 4 ++++ pubspec.yaml | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index bd93ed96..bafcfa3b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## 0.1.16 + +- Add possibility to show the other users username next to the message timestamp + ## 0.1.15 - Fix MessageInput overflow diff --git a/pubspec.yaml b/pubspec.yaml index 155134ed..eca43a8a 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,7 +1,7 @@ name: stream_chat_flutter homepage: https://github.com/GetStream/stream-chat-flutter description: Stream Chat official Flutter SDK. Build your own chat experience using Dart and Flutter. -version: 0.1.15 +version: 0.1.16 environment: sdk: ">=2.3.0 <3.0.0" From 4cb1bd95a2391f52597690493e5a3d8ac020f36d Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 11:45:30 +0200 Subject: [PATCH 06/10] add first version of dark theme --- .gitignore | 3 +- example/lib/main.dart | 3 ++ lib/src/channel_header.dart | 8 +++-- lib/src/channel_list_view.dart | 4 ++- lib/src/message_input.dart | 14 +++++++-- lib/src/message_list_view.dart | 2 +- lib/src/message_widget.dart | 56 ++++++++++++++++++++++++++-------- lib/src/stream_chat.dart | 56 ++++++++++++++++++---------------- lib/src/stream_chat_theme.dart | 38 ++++++++++++++--------- lib/src/thread_header.dart | 8 +++-- 10 files changed, 129 insertions(+), 63 deletions(-) diff --git a/.gitignore b/.gitignore index 28b825a6..457042a0 100644 --- a/.gitignore +++ b/.gitignore @@ -59,4 +59,5 @@ doc/api/ *.js.deps *.js.map -fvm \ No newline at end of file +fvm +google-services.json \ No newline at end of file diff --git a/example/lib/main.dart b/example/lib/main.dart index 567f9e00..32af2bd3 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -23,6 +23,9 @@ class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( + theme: ThemeData.light(), + darkTheme: ThemeData.dark(), + themeMode: ThemeMode.system, home: Container( child: StreamChat( client: client, diff --git a/lib/src/channel_header.dart b/lib/src/channel_header.dart index f2059c42..ae68bcb7 100644 --- a/lib/src/channel_header.dart +++ b/lib/src/channel_header.dart @@ -136,12 +136,16 @@ class ChannelHeader extends StatelessWidget implements PreferredSizeWidget { Navigator.of(context).pop(); } }, - fillColor: Colors.black.withOpacity(.1), + fillColor: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(.1) + : Colors.black.withOpacity(.1), padding: EdgeInsets.all(4), child: Icon( Icons.arrow_back_ios, size: 15, - color: Colors.black, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, ), ), ); diff --git a/lib/src/channel_list_view.dart b/lib/src/channel_list_view.dart index e9114403..e968e6c0 100644 --- a/lib/src/channel_list_view.dart +++ b/lib/src/channel_list_view.dart @@ -298,7 +298,9 @@ class _ChannelListViewState extends State { Widget _separatorBuilder(context, i) { return Container( height: 1, - color: Colors.black.withOpacity(0.1), + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(0.1) + : Colors.black.withOpacity(0.1), margin: EdgeInsets.symmetric(horizontal: 16), ); } diff --git a/lib/src/message_input.dart b/lib/src/message_input.dart index f1025385..e1b3cfc1 100644 --- a/lib/src/message_input.dart +++ b/lib/src/message_input.dart @@ -205,7 +205,10 @@ class _MessageInputState extends State { ), child: Container( decoration: BoxDecoration( - color: Colors.white, + color: StreamChatTheme.of(context) + .channelTheme + .inputBackground + .withAlpha(255), borderRadius: BorderRadius.circular(10.0), ), child: Container( @@ -215,7 +218,9 @@ class _MessageInputState extends State { border: Border.all( color: _typingStarted ? Colors.transparent - : Colors.black.withOpacity(.2)), + : Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(.2) + : Colors.black.withOpacity(.2)), ), ), ), @@ -761,7 +766,10 @@ class _MessageInputState extends State { if (attachment.type == 'image') { _attachments.add(_SendingAttachment( type: FileType.image, - url: attachment.imageUrl, + url: attachment.imageUrl ?? + attachment.assetUrl ?? + attachment.thumbUrl ?? + attachment.ogScrapeUrl, uploaded: true, )); } else if (attachment.type == 'video') { diff --git a/lib/src/message_list_view.dart b/lib/src/message_list_view.dart index a0bf35f4..a102ede0 100644 --- a/lib/src/message_list_view.dart +++ b/lib/src/message_list_view.dart @@ -146,7 +146,7 @@ class _MessageListViewState extends State { 'Start of thread', textAlign: TextAlign.center, ), - color: Theme.of(context).primaryColorLight, + color: Theme.of(context).accentColor.withAlpha(50), ), ), ], diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 10b787da..3130174e 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -157,8 +157,10 @@ class _MessageWidgetState extends State ), child: CircleAvatar( radius: 4, + backgroundColor: Theme.of(context).accentColor, child: Icon( Icons.done, + color: Colors.white, size: 4, ), ), @@ -187,7 +189,7 @@ class _MessageWidgetState extends State ), child: CircleAvatar( radius: 4, - backgroundColor: Color(0xffd0021B).withAlpha(125), + backgroundColor: Color(0xffd0021B).withOpacity(.1), child: Icon( Icons.error_outline, size: 4, @@ -247,7 +249,9 @@ class _MessageWidgetState extends State alignment: Alignment.center, child: Icon( Icons.subdirectory_arrow_left, - color: Colors.black12, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white12 + : Colors.black12, ), ), ]; @@ -462,7 +466,9 @@ class _MessageWidgetState extends State Text( 'MESSAGE FAILED ยท CLICK TO TRY AGAIN', style: _messageTheme.messageText.copyWith( - color: Colors.black.withOpacity(.5), + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(.5) + : Colors.black.withOpacity(.5), fontSize: 11, ), ), @@ -626,7 +632,11 @@ class _MessageWidgetState extends State right: !_isMyMessage ? 8 : null, top: -6, child: CustomPaint( - painter: _ReactionBubblePainter(), + painter: _ReactionBubblePainter( + Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, + ), ), ) : SizedBox(); @@ -775,12 +785,18 @@ class _MessageWidgetState extends State onPressed: () { Navigator.of(context).pop(); }, - fillColor: Colors.black.withOpacity(.1), + fillColor: + Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(.1) + : Colors.black.withOpacity(.1), padding: EdgeInsets.all(4), child: Icon( Icons.close, size: 15, - color: Colors.black, + color: + Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, ), ), ), @@ -833,7 +849,9 @@ class _MessageWidgetState extends State ? const EdgeInsets.all(8) : EdgeInsets.zero, decoration: BoxDecoration( - color: Colors.black, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, borderRadius: BorderRadius.all(Radius.circular(14))), child: AnimatedSwitcher( duration: Duration(milliseconds: 300), @@ -864,7 +882,11 @@ class _MessageWidgetState extends State widget.message.reactionCounts.values .fold(0, (t, v) => v + t) .toString(), - style: TextStyle(color: Colors.white), + style: TextStyle( + color: Theme.of(context).brightness == Brightness.dark + ? Colors.black + : Colors.white, + ), ), ), ], @@ -886,7 +908,7 @@ class _MessageWidgetState extends State final errorWidget = Container( width: 200, height: 140, - color: Color(0xffd0021B).withAlpha(26), + color: Color(0xffd0021B).withOpacity(.1), child: Center( child: Icon( Icons.error_outline, @@ -1006,8 +1028,12 @@ class _MessageWidgetState extends State BoxDecoration _buildBoxDecoration(bool rectBorders) { return BoxDecoration( - border: - _isMyMessage ? null : Border.all(color: Colors.black.withAlpha(8)), + border: _isMyMessage + ? null + : Border.all( + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withAlpha(24) + : Colors.black.withAlpha(24)), borderRadius: BorderRadius.only( topLeft: Radius.circular((_isMyMessage || !rectBorders) ? 16 : 2), bottomLeft: Radius.circular(_isMyMessage ? 16 : 2), @@ -1015,7 +1041,7 @@ class _MessageWidgetState extends State bottomRight: Radius.circular(_isMyMessage ? 2 : 16), ), color: widget.message.status == MessageSendingStatus.FAILED - ? Color(0xffd0021B).withAlpha(26) + ? Color(0xffd0021B).withOpacity(.1) : _messageTheme.messageBackgroundColor, ); } @@ -1027,9 +1053,13 @@ class _MessageWidgetState extends State } class _ReactionBubblePainter extends CustomPainter { + final Color color; + + _ReactionBubblePainter(this.color); + @override void paint(Canvas canvas, Size size) { - final paint = Paint()..color = Colors.black; + final paint = Paint()..color = color; final path = Path(); path.arcToPoint(Offset(-6, -6)); path.arcToPoint(Offset(0, 10)); diff --git a/lib/src/stream_chat.dart b/lib/src/stream_chat.dart index 11c41a71..19d1608d 100644 --- a/lib/src/stream_chat.dart +++ b/lib/src/stream_chat.dart @@ -72,33 +72,37 @@ class StreamChatState extends State return StreamChatTheme( data: theme, child: Builder( - builder: (context) => Theme( - data: Theme.of(context).copyWith( - accentColor: StreamChatTheme.of(context).accentColor, - scaffoldBackgroundColor: Colors.white, - backgroundColor: Colors.white, - ), - child: WillPopScope( - onWillPop: () async { - if (_navigatorKey.currentState.canPop()) { - _navigatorKey.currentState.pop(); - return false; - } else { - return true; - } - }, - child: Navigator( - initialRoute: '/', - key: _navigatorKey, - onGenerateRoute: (settings) { - return MaterialPageRoute( - settings: settings, - builder: (_) => widget.child, - ); - }, + builder: (context) { + final materialTheme = Theme.of(context); + final isDark = materialTheme.brightness == Brightness.dark; + return Theme( + data: materialTheme.copyWith( + accentColor: StreamChatTheme.of(context).accentColor, + scaffoldBackgroundColor: isDark ? Colors.black : Colors.white, + backgroundColor: isDark ? Colors.black : Colors.white, ), - ), - ), + child: WillPopScope( + onWillPop: () async { + if (_navigatorKey.currentState.canPop()) { + _navigatorKey.currentState.pop(); + return false; + } else { + return true; + } + }, + child: Navigator( + initialRoute: '/', + key: _navigatorKey, + onGenerateRoute: (settings) { + return MaterialPageRoute( + settings: settings, + builder: (_) => widget.child, + ); + }, + ), + ), + ); + }, ), ); } diff --git a/lib/src/stream_chat_theme.dart b/lib/src/stream_chat_theme.dart index eedc499b..e6053939 100644 --- a/lib/src/stream_chat_theme.dart +++ b/lib/src/stream_chat_theme.dart @@ -166,9 +166,10 @@ class StreamChatThemeData { /// Get the default Stream Chat theme static StreamChatThemeData getDefaultTheme(ThemeData theme) { final accentColor = Color(0xff006cff); + final isDark = theme.brightness == Brightness.dark; return StreamChatThemeData( accentColor: accentColor, - primaryColor: Colors.white, + primaryColor: isDark ? Colors.black : Colors.white, channelPreviewTheme: ChannelPreviewTheme( avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(20), @@ -179,15 +180,17 @@ class StreamChatThemeData { ), title: TextStyle( fontSize: 14, - color: Colors.black, + color: isDark ? Colors.white : Colors.black, ), subtitle: TextStyle( fontSize: 13, - color: Colors.black, + color: isDark ? Colors.white : Colors.black, ), lastMessageAt: TextStyle( fontSize: 11, - color: Colors.black.withOpacity(.5), + color: isDark + ? Colors.white.withOpacity(.5) + : Colors.black.withOpacity(.5), ), ), channelTheme: ChannelTheme( @@ -202,17 +205,20 @@ class StreamChatThemeData { width: 40, ), ), - color: Colors.white, + color: isDark ? Colors.black : Colors.white, title: TextStyle( fontSize: 14, - color: Colors.black, + color: isDark ? Colors.white : Colors.black, ), lastMessageAt: TextStyle( fontSize: 11, - color: Colors.black.withOpacity(.5), + color: isDark + ? Colors.white.withOpacity(.5) + : Colors.black.withOpacity(.5), ), ), - inputBackground: Colors.black.withAlpha(12), + inputBackground: + isDark ? Colors.black.withAlpha(12) : Colors.white.withAlpha(12), inputGradient: LinearGradient(colors: [ Color(0xFF00AEFF), Color(0xFF0076FF), @@ -221,10 +227,12 @@ class StreamChatThemeData { ownMessageTheme: MessageTheme( messageText: TextStyle( fontSize: 15, - color: Colors.black, + color: isDark ? Colors.white : Colors.black, ), createdAt: TextStyle( - color: Colors.black.withOpacity(.5), + color: isDark + ? Colors.white.withOpacity(.5) + : Colors.black.withOpacity(.5), fontSize: 11, ), replies: TextStyle( @@ -232,7 +240,7 @@ class StreamChatThemeData { fontWeight: FontWeight.bold, fontSize: 12, ), - messageBackgroundColor: Color(0xffebebeb), + messageBackgroundColor: Color(0x33ebebeb), avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(20), constraints: BoxConstraints.tightFor( @@ -244,10 +252,12 @@ class StreamChatThemeData { otherMessageTheme: MessageTheme( messageText: TextStyle( fontSize: 15, - color: Colors.black, + color: isDark ? Colors.white : Colors.black, ), createdAt: TextStyle( - color: Colors.black.withOpacity(.5), + color: isDark + ? Colors.white.withOpacity(.5) + : Colors.black.withOpacity(.5), fontSize: 11, ), replies: TextStyle( @@ -255,7 +265,7 @@ class StreamChatThemeData { fontWeight: FontWeight.bold, fontSize: 12, ), - messageBackgroundColor: Colors.white, + messageBackgroundColor: isDark ? Colors.black : Colors.white, avatarTheme: AvatarTheme( borderRadius: BorderRadius.circular(20), constraints: BoxConstraints.tightFor( diff --git a/lib/src/thread_header.dart b/lib/src/thread_header.dart index fc45fde8..07f10e60 100644 --- a/lib/src/thread_header.dart +++ b/lib/src/thread_header.dart @@ -122,12 +122,16 @@ class ThreadHeader extends StatelessWidget implements PreferredSizeWidget { Navigator.of(context).pop(); } }, - fillColor: Colors.black.withOpacity(.1), + fillColor: Theme.of(context).brightness == Brightness.dark + ? Colors.white.withOpacity(.1) + : Colors.black.withOpacity(.1), padding: EdgeInsets.all(4), child: Icon( Icons.close, size: 15, - color: Colors.black, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, ), ), ), From 9592121cd6231efb410b1d5d4f97f65596d1aec6 Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 12:04:55 +0200 Subject: [PATCH 07/10] fix attachment background color --- example/lib/main.dart | 2 +- lib/src/message_widget.dart | 8 +++----- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/example/lib/main.dart b/example/lib/main.dart index 32af2bd3..59a2ec3f 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -25,7 +25,7 @@ class MyApp extends StatelessWidget { return MaterialApp( theme: ThemeData.light(), darkTheme: ThemeData.dark(), - themeMode: ThemeMode.system, + themeMode: ThemeMode.dark, home: Container( child: StreamChat( client: client, diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 3130174e..3ddb251d 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -400,9 +400,7 @@ class _MessageWidgetState extends State int nOfAttachmentWidgets, BuildContext context, ) { - final boxDecoration = _buildBoxDecoration(_isLastUser).copyWith( - color: Color(0xffebebeb), - ); + final boxDecoration = _buildBoxDecoration(_isLastUser); return Padding( padding: const EdgeInsets.only(bottom: 2.0), child: Column( @@ -413,7 +411,8 @@ class _MessageWidgetState extends State child: Container( decoration: boxDecoration, constraints: BoxConstraints.loose( - Size.fromWidth(MediaQuery.of(context).size.width * 0.7)), + Size.fromWidth(MediaQuery.of(context).size.width * 0.7), + ), child: Stack( children: [ Column( @@ -620,7 +619,6 @@ class _MessageWidgetState extends State ], ), ), - color: Color(0xffebebeb), ), ); } From 6a1da25b26531c7ec34fab2363788e3d23be3ca2 Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 13:17:45 +0200 Subject: [PATCH 08/10] fix message deleted color --- lib/src/message_widget.dart | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart index 3ddb251d..62c41148 100644 --- a/lib/src/message_widget.dart +++ b/lib/src/message_widget.dart @@ -231,7 +231,9 @@ class _MessageWidgetState extends State 'This message was deleted...', style: _messageTheme.messageText.copyWith( fontStyle: FontStyle.italic, - color: Colors.black, + color: Theme.of(context).brightness == Brightness.dark + ? Colors.white + : Colors.black, ), ), ), From 3f530fa1932622b437954b9f919d98043cbeb180 Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 13:31:39 +0200 Subject: [PATCH 09/10] fix example main --- example/lib/main.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/example/lib/main.dart b/example/lib/main.dart index 59a2ec3f..32af2bd3 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -25,7 +25,7 @@ class MyApp extends StatelessWidget { return MaterialApp( theme: ThemeData.light(), darkTheme: ThemeData.dark(), - themeMode: ThemeMode.dark, + themeMode: ThemeMode.system, home: Container( child: StreamChat( client: client, From c13ef72995068860f31d67d61e34de71eafa827f Mon Sep 17 00:00:00 2001 From: Salvatore Giordano Date: Wed, 8 Apr 2020 13:43:30 +0200 Subject: [PATCH 10/10] version bump --- CHANGELOG.md | 4 ++++ pubspec.yaml | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index bafcfa3b..45caff90 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## 0.1.17 + +- Add dark theme + ## 0.1.16 - Add possibility to show the other users username next to the message timestamp diff --git a/pubspec.yaml b/pubspec.yaml index eca43a8a..8c2db382 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,7 +1,7 @@ name: stream_chat_flutter homepage: https://github.com/GetStream/stream-chat-flutter description: Stream Chat official Flutter SDK. Build your own chat experience using Dart and Flutter. -version: 0.1.16 +version: 0.1.17 environment: sdk: ">=2.3.0 <3.0.0"