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),
          );
        },
      ),
    );
  }
}
相关推荐
Qin_jiangshan36 分钟前
flutter和reactNative以及uniapp区别
flutter·react native·uni-app
旧时光_1 小时前
第5章:容器类组件 —— 5.1 填充(Padding)
flutter
renxhui2 小时前
Flutter 基础控件速查(面向 Android 开发者)
flutter
A懿轩A2 小时前
【2025版 OpenHarmony】 GitCode 口袋工具:Flutter + Dio 网路请求 打造随身的鸿蒙版 GitCode 搜索助手
windows·flutter·华为·鸿蒙·openharmony·开源鸿蒙
QuantumLeap丶2 小时前
《Flutter全栈开发实战指南:从零到高级》- 20 -主题与国际化
flutter·ios·前端框架
心随雨下2 小时前
Flutter动画系统详解
flutter
白茶三许3 小时前
【OpenHarmony】Flutter 本地存储全解析:从键值对到数据库
数据库·flutter·开源·openharmony·gitcode
晚霞的不甘4 小时前
Flutter 与开源鸿蒙(OpenHarmony)深度集成:从插件开发到分布式能力实战(续篇)
flutter·开源·harmonyos
晚霞的不甘4 小时前
Flutter 与开源鸿蒙(OpenHarmony)生态融合:从 UI 渲染到系统级能力调用的全链路开发范式
flutter·开源·harmonyos