Flutter问题：Image.file加载失败时未触发异常

这个问题我之前也踩过坑！你的try-catch没生效，核心原因是：Image.file在创建Widget对象的时候并不会立即读取文件，真正的文件加载和解析是在Widget后续渲染、绘制的异步流程里发生的——所以你写的同步try-catch根本抓不到这个异常，异常是在Widget树的渲染阶段抛出来的，不在你当前的代码执行上下文里。

下面给你两个实用的解决方案，其中第一个是最贴合Flutter生态的优雅写法：

方案1：使用Image.file的errorBuilder参数（推荐） #

Flutter的Image组件自带了errorBuilder回调，专门用来处理加载失败的场景——不管是文件不存在、文件损坏还是其他加载问题，都会触发这个回调，直接返回你要显示的回退Widget。

修改后的代码如下：

if(_appDocsDir != null) {
  File employerPic = _getEmployerPicFile();
  if(employerPic != null) {
    print('JOB TILE: GOT IMAGE FROM DEVICE! path: ${employerPic.path}');
    profilePic = ClipOval(
      child: Image.file(
        employerPic,
        width: 60,
        height: 60,
        fit: BoxFit.cover,
        // 加载失败时自动显示Avatar
        errorBuilder: (context, error, stackTrace) {
          print('${LOG}failed to load profilePic from mem, showing Avatar');
          return Image.asset(
            PersonUtils.getAvatarFromId[widget._job.avatar],
            fit: BoxFit.cover,
            width: 60,
            height: 60,
          );
        },
      ),
    );
  } else {
    // 文件对象为空时直接显示Avatar
    profilePic = Image.asset(
      PersonUtils.getAvatarFromId[widget._job.avatar],
      fit: BoxFit.cover,
      width: 60,
      height: 60,
    );
  }
} else {
  // 存储目录为空时显示Avatar
  profilePic = Image.asset(
    PersonUtils.getAvatarFromId[widget._job.avatar],
    fit: BoxFit.cover,
    width: 60,
    height: 60,
  );
}

这个方案的优势是：

• 不需要额外的异步检查代码，完全贴合Flutter的Widget生命周期
• 能处理所有加载错误场景（不仅仅是文件不存在）
• 代码更简洁，逻辑更清晰

方案2：提前同步检查文件是否存在 #

如果你想在创建Image组件之前就确认文件状态，可以提前调用File.exists()方法检查文件是否存在。不过要注意：exists()是异步方法，如果这段代码在build()方法里，不能直接用await，需要用FutureBuilder包裹。

示例代码（非build方法中使用）：

if(_appDocsDir != null) {
  File employerPic = _getEmployerPicFile();
  if(employerPic != null) {
    print('JOB TILE: GOT IMAGE FROM DEVICE! path: ${employerPic.path}');
    // 提前检查文件是否存在
    bool fileExists = await employerPic.exists();
    if(fileExists) {
      profilePic = ClipOval(
        child: Image.file(
          employerPic,
          width: 60,
          height: 60,
          fit: BoxFit.cover),
      );
    } else {
      print('${LOG}File does not exist, showing Avatar');
      profilePic = Image.asset(
        PersonUtils.getAvatarFromId[widget._job.avatar],
        fit: BoxFit.cover,
        width: 60,
        height: 60,
      );
    }
  } else {
    profilePic = Image.asset(
      PersonUtils.getAvatarFromId[widget._job.avatar],
      fit: BoxFit.cover,
      width: 60,
      height: 60,
    );
  }
} else {
  profilePic = Image.asset(
    PersonUtils.getAvatarFromId[widget._job.avatar],
    fit: BoxFit.cover,
    width: 60,
    height: 60,
  );
}

如果是在build()方法中使用，需要用FutureBuilder来处理异步逻辑，避免阻塞UI渲染。

内容的提问来源于stack exchange，提问作者Sam