flutter 网络图片封装

可自定义加载时占位图片和加载失败时展示的图片

dart 复制代码
class ImageBuildView extends StatelessWidget {
  String? url;
  double radius;
  double? width;
  double? height;
  String placeholder;

  ImageBuildView(
      {super.key,
      this.url,
      this.width,
      this.height,
      this.radius = 50,
      this.placeholder = "assets/images/loading.png"});

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(radius),
      child: FadeInImage.assetNetwork(
        placeholder: placeholder,
        image: url != null && url!.isNotEmpty ? "${Api.BASE_URL}/$url" : '',
        fit: BoxFit.cover,
        width: width ?? 60.w,
        height: height ?? 60.w,
        imageErrorBuilder: (context, error, stackTrace) {
          return Center(
            child: Image.asset("assets/images/image_error.png",
                width: (width ?? 60.w) - 20.w, height: (height ?? 60.w) - 20.w),
          );
        },
      ),
    );
  }
}
相关推荐
花开彼岸天~10 小时前
Flutter跨平台开发鸿蒙化定位组件使用指南
flutter·华为·harmonyos
hudawei99612 小时前
flutter路由传参接收时机
开发语言·flutter·异步
花开彼岸天~14 小时前
Flutter跨平台开发鸿蒙化日志测试组件使用指南
flutter·elasticsearch·harmonyos
昼-枕15 小时前
【实战分享】我用Flutter为小餐馆开发的点餐系统
flutter
开心-开心急了15 小时前
ai + fluent_ui 实现自定义winUI风格窗口
flutter·ui
儿歌八万首16 小时前
Flutter自定义组件: 为横向列表自定义“进度条”式滚动指示器
flutter
PWRJOY19 小时前
【flutter】项目配置文件 pubspec.yaml
flutter
徐安安ye21 小时前
Flutter 与 Rust 混合开发:打造毫秒级响应的高性能计算引擎
开发语言·flutter·rust
xianjixiance_1 天前
Flutter跨平台三方库鸿蒙化适配指南
flutter·华为·harmonyos
SoaringHeart1 天前
Flutter组件封装:视频播放组件全局封装
前端·flutter