add messagelist typing indicator
This commit is contained in:
@@ -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,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,
|
||||
|
||||
@@ -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(
|
||||
|
||||
Reference in New Issue
Block a user