如何捕捉“无法加载资产：资产/图像/sample_img_url.png”答案

【问题标题】：How to catch "Unable to load asset: assets/images/sample_img_url.png"如何捕捉“无法加载资产：资产/图像/sample_img_url.png”
【发布时间】：2021-02-28 08:42:45
【问题描述】：

有什么方法可以捕获 Flutter 中的“无法加载资产：assets/images/sample_img_url.png”错误？

我要做的是通过提供其路径（来自 API）来加载资产图像。但如果我没有与给定路径关联的图像，我需要加载示例图像。

我创建了一个自定义占位符小部件，如下所示。但是它没有像我预期的那样工作。任何人都可以帮助我吗？

class ImagePlaceHolder extends StatelessWidget {
  final String path;
  final double width;

  const ImagePlaceHolder({Key key, this.path, this.width}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    Image finalImage;
    try{
      finalImage = Image.asset(
          path,
          width: width,
      );
    }
    catch(Exception){
      finalImage = Image.asset(
          "assets/images/app_update_logo.png",
          width: width,
      );
    }
    return finalImage;
  }
}

【问题讨论】：

你在 pubspec.yaml 中添加了这个路径吗？
是的。图像路径没有问题。实际上，由于这个原因，资产文件夹中没有图像。这就是问题出现的原因。我需要处理这个场景。如果资产没有名为给定名称的图像，我需要显示示例图像。

标签： flutter error-handling try-catch flutter-assetimage

【解决方案1】：

好的，我终于找到了一个非常好的方法来解决这个问题。只需使用错误生成器。

Image.asset(
     "assets/images/subjects/api_given_image_name.png",
     width: 90,
     errorBuilder: (BuildContext context, Object exception, StackTrace stackTrace) {
           return Image.asset(
                "assets/images/your_sample_image.png",
                width: 90,
           );
     },
)

【讨论】：

【解决方案2】：

您必须在 pubspec.yaml 中定义资产路径，如下所示：

flutter:
  assets:
    - assets/my_icon.png
    - assets/background.png

要包含目录下的所有资产，请以 / 字符结尾指定目录名称：

flutter:
  assets:
    - directory/
    - directory/subdirectory/

官方文档： https://flutter.dev/docs/development/ui/assets-and-images

【讨论】：

【解决方案3】：

我认为错误不应该在运行时解决。所以只指定现有的图像路径。如果您在指定路径中没有图像，则不应使用它。

但是。如果您仍然想首先捕获异常，您应该了解 Image.asset 是异步工作的。稍后抛出异常，这就是您无法捕获它的原因。看看这个 GitHub issue，希望对你有帮助。

【讨论】：

正是那件事。当涉及到 Image.network 时，我们可以处理这个问题，而且包也很少。但在我的情况下，我需要找到一种方法来捕捉它。 @Mol0ho 感谢您的评论

【解决方案4】：

您无需捕获该异常即可实现您想要的。您可以使用errorBuilder 函数返回您喜欢的任何小部件。

      Image.asset(
        "assets/images/app_update_logo.png",
        width: width,
        errorBuilder: (context, error, stackTrace) {
          return Image.asset(
            "assets/images/error_logo.png",
            width: width,
          );
        },
      );

祝你好运！

【讨论】：

@SUDESH 对不起，我没有看到你的答案。因为你的答案是一样的，所以请忽略这个。

【解决方案5】：

只是一个关于 null 安全性的快速更新答案：

Image.asset(
 "assets/images/subjects/api_given_image_name.png",
 width: 90,
 errorBuilder: (BuildContext context, Object exception, StackTrace? stackTrace) {
       return Image.asset(
            "assets/images/your_sample_image.png",
            width: 90,
       );
 },
)

需要 ?在 StackTrace 之后或将神秘错误。

【讨论】：