97 lines
2.7 KiB
Dart
97 lines
2.7 KiB
Dart
import 'package:flutter/material.dart';
|
||
import 'package:cached_network_image/cached_network_image.dart';
|
||
import 'package:flutter_cache_manager/flutter_cache_manager.dart';
|
||
import 'package:flutter_kinetra/kt_utils/kt_string_extend.dart';
|
||
|
||
/// 带有缓存功能的网络图片组件
|
||
class KtNetworkImage extends StatelessWidget {
|
||
final String imageUrl;
|
||
final double? width;
|
||
final double? height;
|
||
final BoxFit? fit;
|
||
final Widget? placeholder;
|
||
final Widget? errorWidget;
|
||
final BorderRadius? borderRadius;
|
||
|
||
const KtNetworkImage({
|
||
super.key,
|
||
required this.imageUrl,
|
||
this.width,
|
||
this.height,
|
||
this.fit = BoxFit.cover,
|
||
this.placeholder,
|
||
this.errorWidget,
|
||
this.borderRadius,
|
||
});
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
// 如果URL为空，直接显示错误组件
|
||
if (imageUrl.isEmpty) {
|
||
return errorWidget ?? _buildDefaultErrorWidget();
|
||
}
|
||
|
||
// 基础的CachedNetworkImage配置
|
||
Widget imageWidget = CachedNetworkImage(
|
||
imageUrl: imageUrl,
|
||
width: width,
|
||
height: height,
|
||
fit: fit,
|
||
filterQuality: FilterQuality.high,
|
||
placeholder: (context, url) => placeholder ?? _buildDefaultPlaceholder(),
|
||
errorWidget: (context, url, error) =>
|
||
errorWidget ?? _buildDefaultErrorWidget(),
|
||
cacheManager: CacheManager(
|
||
Config(
|
||
'customImageCache',
|
||
stalePeriod: const Duration(days: 7),
|
||
maxNrOfCacheObjects: 100,
|
||
),
|
||
),
|
||
fadeInDuration: const Duration(milliseconds: 300),
|
||
fadeOutDuration: const Duration(milliseconds: 300),
|
||
);
|
||
|
||
// 如果设置了圆角，使用ClipRRect包裹
|
||
if (borderRadius != null) {
|
||
imageWidget = ClipRRect(borderRadius: borderRadius!, child: imageWidget);
|
||
}
|
||
|
||
return imageWidget;
|
||
}
|
||
|
||
// 默认占位符组件
|
||
Widget _buildDefaultPlaceholder() {
|
||
Widget imageWidget = Image.asset(
|
||
(width ?? 0) > (height ?? 0)
|
||
? 'ic_image_hor.png'.ktIcon
|
||
: 'ic_image_ver.png'.ktIcon,
|
||
width: width,
|
||
height: height,
|
||
fit: fit,
|
||
);
|
||
// 如果设置了圆角，使用ClipRRect包裹
|
||
if (borderRadius != null) {
|
||
imageWidget = ClipRRect(borderRadius: borderRadius!, child: imageWidget);
|
||
}
|
||
return imageWidget;
|
||
}
|
||
|
||
// 默认错误组件
|
||
Widget _buildDefaultErrorWidget() {
|
||
Widget imageWidget = Image.asset(
|
||
(width ?? 0) > (height ?? 0)
|
||
? 'ic_image_hor.png'.ktIcon
|
||
: 'ic_image_ver.png'.ktIcon,
|
||
width: width,
|
||
height: height,
|
||
fit: fit,
|
||
);
|
||
// 如果设置了圆角，使用ClipRRect包裹
|
||
if (borderRadius != null) {
|
||
imageWidget = ClipRRect(borderRadius: borderRadius!, child: imageWidget);
|
||
}
|
||
return imageWidget;
|
||
}
|
||
}
|