如何在flutter中使用暗模式和不同分辨率的资源图像？

Question

我在我的 flutter 项目中使用具有不同分辨率的图像，如此处所述。现在我想为深色模式主题添加自定义图像。我在 pubspec.yaml 中的资产声明如下所示：

flutter:
  uses-material-design: true
  assets:
    - assets/images/img_menu.png
    - ...

我的资产结构：

  .../pubspec.yaml
  .../assets/images/img_menu.png
  .../assets/images/0.75x/img_menu.png
  .../assets/images/1.5x/img_menu.png
  .../assets/images/2.0x/img_menu.png
  .../assets/images/3.0x/img_menu.png
  .../assets/images/4.0x/img_menu.png

我以这种方式在项目中加载图像：

Image.asset('assets/images/img_menu.png')

我知道对于简单的单色图像我可以像这样改变它的颜色：

Image.asset('assets/images/img_menu.png', 
                      color: Theme.of(context).brightness == Brightness.light
                      ? Colors.black
                      : Colors.white,)

但我的大多数图像都比较复杂，所以我必须为它们加载自定义资源。

正如此处所述，在添加暗模式资产后，我可以不做任何更改地保留 pubspec。我尝试过黑暗模式的不同资产结构，但没有一个有效。

1：

  .../pubspec.yaml
  .../assets/images/img_menu.png
  .../assets/images/dark/img_menu.png
  .../assets/images/0.75x/img_menu.png
  .../assets/images/0.75x/dark/img_menu.png
  .../assets/images/1.5x/img_menu.png
  .../assets/images/1.5x/dark/img_menu.png
  .../assets/images/2.0x/img_menu.png
  .../assets/images/2.0x/dark/img_menu.png
  .../assets/images/3.0x/img_menu.png
  .../assets/images/3.0x/dark/img_menu.png
  .../assets/images/4.0x/img_menu.png
  .../assets/images/4.0x/dark/img_menu.png

2：

  .../pubspec.yaml
  .../assets/images/img_menu.png
  .../assets/images/0.75x/img_menu.png
  .../assets/images/1.5x/img_menu.png
  .../assets/images/2.0x/img_menu.png
  .../assets/images/3.0x/img_menu.png
  .../assets/images/4.0x/img_menu.png
  .../assets/images/dark/img_menu.png
  .../assets/images/dark/0.75x/img_menu.png
  .../assets/images/dark/1.5x/img_menu.png
  .../assets/images/dark/2.0x/img_menu.png
  .../assets/images/dark/3.0x/img_menu.png
  .../assets/images/dark/4.0x/img_menu.png

3：

  .../pubspec.yaml
  .../assets/images/img_menu.png
  .../assets/images/0.75x/img_menu.png
  .../assets/images/1.5x/img_menu.png
  .../assets/images/2.0x/img_menu.png
  .../assets/images/3.0x/img_menu.png
  .../assets/images/4.0x/img_menu.png
  .../assets/dark/images/img_menu.png
  .../assets/dark/images/0.75x/img_menu.png
  .../assets/dark/images/1.5x/img_menu.png
  .../assets/dark/images/2.0x/img_menu.png
  .../assets/dark/images/3.0x/img_menu.png
  .../assets/dark/images/4.0x/img_menu.png

单图像的解决方案是这样加载它：

Image.asset(Theme.of(context).brightness == Brightness.light 
                      ? 'assets/images/img_menu.png'
                      : 'assets/images/dark/img_menu.png',)

但这对于整个项目来说并不是一个方便的解决方案。

更奇怪的是，在 2 种变体应用程序中，加载了两种颜色的深色图像：浅色和深色主题（在 iPhone 和 Android 上测试）。

所以问题是：暗模式和分辨率感知图像资源的文件结构应该是什么样的？

Answer 1

到目前为止，目前唯一支持的变体是缩放（设备像素比），而不是黑暗模式。

请参阅： https: //github.com/flutter/flutter/issues/44482