Flutter 不会加载特定的图像

Posted 2023-02-23

【中文标题】Flutter 不会加载特定的图像

【英文标题】：Flutter won't load a particular image

【发布时间】：2021-04-12 19:03:17

【问题描述】：

当我尝试从本地（位于 assets/images/）的 Unsplash 加载 this image 时，没有任何显示，也没有报告错误。当我将图像源更改为network 时，图像加载得非常好（但速度较慢）。 不工作：

Container(
     decoration: BoxDecoration(
          image: DecorationImage(
             image: AssetImage("assets/images/image.jpg"),
             fit: BoxFit.cover))

作品：

Container(
     decoration: BoxDecoration(
         image: DecorationImage(
             image: NetworkImage("https://source.unsplash.com/zuueig1w8WI/"),
              fit: BoxFit.cover)),

目前正在使用 Flutter Web。

编辑图像已在 pubspec 中。

name: website
description: Wesbite

# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: "none" # Remove this line if you wish to publish to pub.dev

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
version: 2.0.0+1

environment:
    sdk: ">=2.7.0 <3.0.0"

dependencies:
    flutter:
        sdk: flutter
    auto_size_text: ^2.1.0
    cached_network_image: ^2.5.0
    firebase_analytics: ^6.3.0
    font_awesome_flutter: ^8.11.0
    google_fonts: ^1.1.1
    http: ^0.12.2
    provider: ^4.3.2+3
    url_launcher: ^5.7.10
    velocity_x: ^1.3.1

dev_dependencies:
    flutter_test:
        sdk: flutter
# The following section is specific to Flutter.
flutter:
    assets:
        - assets/images/
        - assets/licenses/

    # The following line ensures that the Material Icons font is
    # included with your application, so that you can use the icons in
    # the material Icons class.
    uses-material-design: true

【问题讨论】：

你也可以在这里显示 pubspec.yaml 吗？只想知道如何在配置中声明资产。

【参考方案1】：

检查资产文件夹中的文件扩展名。

源图像是 .jfif，虽然兼容，但可能意味着 Flutter 在查找 image.jpg 时无法找到该文件

【讨论】：

扩展名是.jpg。 Flutter 在找不到指定的图像或无法解码图像时会抛出错误，但这里我没有收到任何错误。

我有解决问题的迹象 - 图像的颜色配置文件。 Flutter 无法正确解释原始颜色配置文件，但是当转换为 GIMP 的颜色配置文件时，图像会使用 AssetImage 加载。

我刚刚发现您正在使用 Flutter Web。这可能是画布套件问题。我一直遇到 canvaskit 无法正确显示图像但没有引发错误的问题。我现在不得不切换到 html 画布，而他们正在处理这些问题，如果转换颜色配置文件对您有帮助，我会尝试看看这是否是 CanvasKit 遇到的问题

谢谢你。我是 Flutter 的中级初学者，对 CanvasKit 了解不多。

【参考方案2】：

检查您的pubspec.yaml 是否已在其中包含资产路径。如果您没有包含路径，请执行以下操作。

编辑：您不必在“pubspec.yaml”上添加每个图像路径，只需添加主图像路径，例如：

资产/图像/

【讨论】：

我的 pubspec 中已经有了路径。其他图片可以正常加载。

尝试从照片编辑软件中保存图像。也许在内部图像格式不是 .jpg