add messagelist typing indicator

This commit is contained in:
Salvatore Giordano
2020-11-25 12:43:42 +01:00
parent 24c5e39bda
commit 71123fbafb
5 changed files with 67 additions and 26 deletions
+5
View File
@@ -64,12 +64,16 @@ class ChannelHeader extends StatelessWidget implements PreferredSizeWidget {
/// Callback to call when the image is tapped.
final VoidCallback onImageTap;
/// If true the typing indicator will be rendered if a user is typing
final bool showTypingIndicator;
/// Creates a channel header
ChannelHeader({
Key key,
this.showBackButton = true,
this.onBackPressed,
this.onTitleTap,
this.showTypingIndicator = true,
this.onImageTap,
}) : preferredSize = Size.fromHeight(kToolbarHeight),
super(key: key);
@@ -116,6 +120,7 @@ class ChannelHeader extends StatelessWidget implements PreferredSizeWidget {
),
SizedBox(height: 2),
ChannelInfo(
showTypingIndicator: showTypingIndicator,
channel: channel,
textStyle:
StreamChatTheme.of(context).channelPreviewTheme.subtitle,
+8
View File
@@ -8,10 +8,14 @@ class ChannelInfo extends StatelessWidget {
/// The style of the text displayed
final TextStyle textStyle;
/// If true the typing indicator will be rendered if a user is typing
final bool showTypingIndicator;
const ChannelInfo({
Key key,
@required this.channel,
this.textStyle,
this.showTypingIndicator = true,
}) : super(key: key);
@override
@@ -75,6 +79,10 @@ class ChannelInfo extends StatelessWidget {
}
}
if (!showTypingIndicator) {
return alternativeWidget;
}
return TypingIndicator(
alignment: Alignment.center,
alternativeWidget: alternativeWidget,
+24 -18
View File
@@ -12,6 +12,7 @@ class TypingIndicator extends StatelessWidget {
this.alternativeWidget,
this.style,
this.alignment = Alignment.centerLeft,
this.padding = const EdgeInsets.all(0),
}) : super(key: key);
/// Style of the text widget
@@ -23,6 +24,9 @@ class TypingIndicator extends StatelessWidget {
/// Widget built when no typings is happening
final Widget alternativeWidget;
/// The padding of this widget
final EdgeInsets padding;
final Alignment alignment;
@override
@@ -36,24 +40,26 @@ class TypingIndicator extends StatelessWidget {
return AnimatedSwitcher(
duration: Duration(milliseconds: 300),
child: snapshot.data?.isNotEmpty == true
? Align(
key: Key('typings'),
alignment: alignment,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Lottie.asset(
'animations/typing_dots.json',
package: 'stream_chat_flutter',
alignment: Alignment.center,
height: 4,
),
Text(
' ${snapshot.data.map((u) => u.name).join(',')} ${snapshot.data.length == 1 ? 'is' : 'are'} typing',
maxLines: 1,
style: style,
),
],
? Padding(
padding: padding,
child: Align(
key: Key('typings'),
alignment: alignment,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Lottie.asset(
'animations/typing_dots.json',
package: 'stream_chat_flutter',
height: 4,
),
Text(
' ${snapshot.data.map((u) => u.name).join(',')} ${snapshot.data.length == 1 ? 'is' : 'are'} typing',
maxLines: 1,
style: style,
),
],
),
),
)
: Align(