fix: use shimmer in images
This commit is contained in:
@@ -1,5 +1,6 @@
|
|||||||
import 'package:cached_network_image/cached_network_image.dart';
|
import 'package:cached_network_image/cached_network_image.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:shimmer/shimmer.dart';
|
||||||
import 'package:stream_chat_flutter/src/stream_chat_theme.dart';
|
import 'package:stream_chat_flutter/src/stream_chat_theme.dart';
|
||||||
import 'package:stream_chat_flutter/src/stream_svg_icon.dart';
|
import 'package:stream_chat_flutter/src/stream_svg_icon.dart';
|
||||||
import 'package:stream_chat_flutter/src/utils.dart';
|
import 'package:stream_chat_flutter/src/utils.dart';
|
||||||
@@ -104,10 +105,15 @@ class FileAttachment extends AttachmentWidget {
|
|||||||
return getFileTypeImage(attachment.extraData['other']);
|
return getFileTypeImage(attachment.extraData['other']);
|
||||||
},
|
},
|
||||||
placeholder: (_, __) {
|
placeholder: (_, __) {
|
||||||
return Image.asset(
|
return Shimmer.fromColors(
|
||||||
'images/placeholder.png',
|
baseColor: StreamChatTheme.of(context).colorTheme.greyGainsboro,
|
||||||
fit: BoxFit.cover,
|
highlightColor:
|
||||||
package: 'stream_chat_flutter',
|
StreamChatTheme.of(context).colorTheme.whiteSmoke,
|
||||||
|
child: Image.asset(
|
||||||
|
'images/placeholder.png',
|
||||||
|
fit: BoxFit.cover,
|
||||||
|
package: 'stream_chat_flutter',
|
||||||
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import 'dart:typed_data';
|
|||||||
|
|
||||||
import 'package:cached_network_image/cached_network_image.dart';
|
import 'package:cached_network_image/cached_network_image.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:shimmer/shimmer.dart';
|
||||||
import 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
|
import 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
|
||||||
import 'package:transparent_image/transparent_image.dart';
|
import 'package:transparent_image/transparent_image.dart';
|
||||||
|
|
||||||
@@ -348,10 +349,16 @@ class GiphyAttachment extends AttachmentWidget {
|
|||||||
height: size?.height,
|
height: size?.height,
|
||||||
width: size?.width,
|
width: size?.width,
|
||||||
placeholder: (_, __) {
|
placeholder: (_, __) {
|
||||||
return Image.asset(
|
return Shimmer.fromColors(
|
||||||
'images/placeholder.png',
|
baseColor:
|
||||||
fit: BoxFit.cover,
|
StreamChatTheme.of(context).colorTheme.greyGainsboro,
|
||||||
package: 'stream_chat_flutter',
|
highlightColor:
|
||||||
|
StreamChatTheme.of(context).colorTheme.whiteSmoke,
|
||||||
|
child: Image.asset(
|
||||||
|
'images/placeholder.png',
|
||||||
|
fit: BoxFit.cover,
|
||||||
|
package: 'stream_chat_flutter',
|
||||||
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
imageUrl: imageUrl,
|
imageUrl: imageUrl,
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
import 'package:cached_network_image/cached_network_image.dart';
|
import 'package:cached_network_image/cached_network_image.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:shimmer/shimmer.dart';
|
||||||
import 'package:stream_chat_flutter/src/attachment/attachment_upload_state_builder.dart';
|
import 'package:stream_chat_flutter/src/attachment/attachment_upload_state_builder.dart';
|
||||||
import 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
|
import 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
|
||||||
import 'package:transparent_image/transparent_image.dart';
|
|
||||||
|
|
||||||
import 'attachment_title.dart';
|
import 'attachment_title.dart';
|
||||||
import '../full_screen_media.dart';
|
import '../full_screen_media.dart';
|
||||||
@@ -84,10 +84,15 @@ class ImageAttachment extends AttachmentWidget {
|
|||||||
height: size?.height,
|
height: size?.height,
|
||||||
width: size?.width,
|
width: size?.width,
|
||||||
placeholder: (_, __) {
|
placeholder: (_, __) {
|
||||||
return Image.asset(
|
return Shimmer.fromColors(
|
||||||
'images/placeholder.png',
|
baseColor: StreamChatTheme.of(context).colorTheme.greyGainsboro,
|
||||||
fit: BoxFit.cover,
|
highlightColor:
|
||||||
package: 'stream_chat_flutter',
|
StreamChatTheme.of(context).colorTheme.whiteSmoke,
|
||||||
|
child: Image.asset(
|
||||||
|
'images/placeholder.png',
|
||||||
|
fit: BoxFit.cover,
|
||||||
|
package: 'stream_chat_flutter',
|
||||||
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
imageUrl: imageUrl,
|
imageUrl: imageUrl,
|
||||||
|
|||||||
@@ -11,6 +11,7 @@ import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
|
|||||||
import 'package:flutter_svg/flutter_svg.dart';
|
import 'package:flutter_svg/flutter_svg.dart';
|
||||||
import 'package:image_picker/image_picker.dart';
|
import 'package:image_picker/image_picker.dart';
|
||||||
import 'package:photo_manager/photo_manager.dart';
|
import 'package:photo_manager/photo_manager.dart';
|
||||||
|
import 'package:shimmer/shimmer.dart';
|
||||||
import 'package:stream_chat_flutter/src/video_service.dart';
|
import 'package:stream_chat_flutter/src/video_service.dart';
|
||||||
import 'package:stream_chat_flutter/src/media_list_view.dart';
|
import 'package:stream_chat_flutter/src/media_list_view.dart';
|
||||||
import 'package:stream_chat_flutter/src/message_list_view.dart';
|
import 'package:stream_chat_flutter/src/message_list_view.dart';
|
||||||
@@ -1642,11 +1643,15 @@ class MessageInputState extends State<MessageInput> {
|
|||||||
return getFileTypeImage(attachment.extraData['other']);
|
return getFileTypeImage(attachment.extraData['other']);
|
||||||
},
|
},
|
||||||
progressIndicatorBuilder: (context, _, progress) {
|
progressIndicatorBuilder: (context, _, progress) {
|
||||||
return Center(
|
return Shimmer.fromColors(
|
||||||
child: Container(
|
baseColor:
|
||||||
width: 20.0,
|
StreamChatTheme.of(context).colorTheme.greyGainsboro,
|
||||||
height: 20.0,
|
highlightColor:
|
||||||
child: const CircularProgressIndicator(),
|
StreamChatTheme.of(context).colorTheme.whiteSmoke,
|
||||||
|
child: Image.asset(
|
||||||
|
'images/placeholder.png',
|
||||||
|
fit: BoxFit.cover,
|
||||||
|
package: 'stream_chat_flutter',
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -216,9 +216,11 @@ class MessageWidget extends StatefulWidget {
|
|||||||
),
|
),
|
||||||
onShowMessage: onShowMessage,
|
onShowMessage: onShowMessage,
|
||||||
onReturnAction: onReturnAction,
|
onReturnAction: onReturnAction,
|
||||||
onAttachmentTap: () {
|
onAttachmentTap: onAttachmentTap != null
|
||||||
onAttachmentTap(message, attachment);
|
? () {
|
||||||
},
|
onAttachmentTap?.call(message, attachment);
|
||||||
|
}
|
||||||
|
: null,
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
'video': (context, message, attachment) {
|
'video': (context, message, attachment) {
|
||||||
@@ -232,31 +234,35 @@ class MessageWidget extends StatefulWidget {
|
|||||||
message: message,
|
message: message,
|
||||||
onShowMessage: onShowMessage,
|
onShowMessage: onShowMessage,
|
||||||
onReturnAction: onReturnAction,
|
onReturnAction: onReturnAction,
|
||||||
onAttachmentTap: () {
|
onAttachmentTap: onAttachmentTap != null
|
||||||
onAttachmentTap(message, attachment);
|
? () {
|
||||||
},
|
onAttachmentTap?.call(message, attachment);
|
||||||
|
}
|
||||||
|
: null,
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
'giphy': (context, message, attachment) {
|
'giphy': (context, message, attachment) {
|
||||||
return GiphyAttachment(
|
return GiphyAttachment(
|
||||||
attachment: attachment,
|
attachment: attachment,
|
||||||
messageTheme: messageTheme,
|
messageTheme: messageTheme,
|
||||||
message: message,
|
message: message,
|
||||||
size: Size(
|
size: Size(
|
||||||
MediaQuery.of(context).size.width * 0.8,
|
MediaQuery.of(context).size.width * 0.8,
|
||||||
MediaQuery.of(context).size.height * 0.3,
|
MediaQuery.of(context).size.height * 0.3,
|
||||||
),
|
),
|
||||||
onShowMessage: onShowMessage,
|
onShowMessage: onShowMessage,
|
||||||
onReturnAction: onReturnAction);
|
onReturnAction: onReturnAction,
|
||||||
|
);
|
||||||
},
|
},
|
||||||
'file': (context, message, attachment) {
|
'file': (context, message, attachment) {
|
||||||
return FileAttachment(
|
return FileAttachment(
|
||||||
message: message,
|
message: message,
|
||||||
attachment: attachment,
|
attachment: attachment,
|
||||||
size: Size(
|
size: Size(
|
||||||
MediaQuery.of(context).size.width * 0.8,
|
MediaQuery.of(context).size.width * 0.8,
|
||||||
MediaQuery.of(context).size.height * 0.3,
|
MediaQuery.of(context).size.height * 0.3,
|
||||||
));
|
),
|
||||||
|
);
|
||||||
},
|
},
|
||||||
}..addAll(customAttachmentBuilders ?? {}),
|
}..addAll(customAttachmentBuilders ?? {}),
|
||||||
super(key: key);
|
super(key: key);
|
||||||
|
|||||||
@@ -1,6 +1,8 @@
|
|||||||
import 'dart:typed_data';
|
import 'dart:typed_data';
|
||||||
|
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:shimmer/shimmer.dart';
|
||||||
|
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
|
||||||
import 'package:video_thumbnail/video_thumbnail.dart';
|
import 'package:video_thumbnail/video_thumbnail.dart';
|
||||||
|
|
||||||
import 'stream_svg_icon.dart';
|
import 'stream_svg_icon.dart';
|
||||||
@@ -69,12 +71,16 @@ class _VideoThumbnailImageState extends State<VideoThumbnailImage> {
|
|||||||
}
|
}
|
||||||
if (!snapshot.hasData) {
|
if (!snapshot.hasData) {
|
||||||
return widget.placeholderBuilder?.call(context) ??
|
return widget.placeholderBuilder?.call(context) ??
|
||||||
Image.asset(
|
Shimmer.fromColors(
|
||||||
'images/placeholder.png',
|
baseColor:
|
||||||
package: 'stream_chat_flutter',
|
StreamChatTheme.of(context).colorTheme.greyGainsboro,
|
||||||
fit: widget.fit,
|
highlightColor:
|
||||||
height: widget.height,
|
StreamChatTheme.of(context).colorTheme.whiteSmoke,
|
||||||
width: widget.width,
|
child: Image.asset(
|
||||||
|
'images/placeholder.png',
|
||||||
|
fit: BoxFit.cover,
|
||||||
|
package: 'stream_chat_flutter',
|
||||||
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return Image.memory(
|
return Image.memory(
|
||||||
|
|||||||
Reference in New Issue
Block a user