Phaser 3：图像在缩小时像素化

Question

我将图像作为精灵添加到画布中，并使用.setScale(0.1).

问题是图像看起来像素化（而图像文件本身是高分辨率的）。

在我缩小图像之前，它看起来很好。该问题仅在缩放后发生。

这是我导入移相器 3 的图像文件（在我的计算机的图像查看器中缩放）：

这是图像在缩小之前在 Phaser 3 上的外观（很好）：

（这里的色调不同，但没关系）

这是缩小后的样子：

如您所见，结果非常像素化。 我怎样才能克服这个问题？

非常感谢提前这是我的代码的缩短版本：

var config = {
  backgroundColor: "#ffb3c9",
  type: Phaser.WEBGL,
  width: 600,
  height: 600,
  parent: "pageContent",
  physics: {
    default: "arcade",
    arcade: {
      gravity: { y: 200 },
    },
  },
  scene: {
    preload: preload,
    create: create,
  },
};
var game = new Phaser.Game(config);
function preload() {
    this.load.image("img", "img.png");
}
function create() {
    var sprite = this.add.sprite(50,50,"img").setScale(0.1);
    sprite.tint = 0x000000;
}

更新

我发现这个问题是由于使用了 HTML 画布造成的。但是，有一些方法可以克服这个问题：

• 手动编写某些算法以更好地调整大小。
• 使用ctx.imageSmoothingQuality = "high";，它支持至少 76% 的情况。
• 通过使用实际图像手动执行来防止 Phaser 调整图像大小（在大多数情况下这是一个非常糟糕的解决方案）。

但是，在使用 Phaser3 时，我还是没有设法启用该imageSmoothingQuality选项（因为canvas.getContext("2d")是null.

再次提前致谢。

更新2

我设法imageSmoothingQuality在 CANVAS 模式（game.canvas.getContext("2d").imageSmoothingQuality = "high";）和mipmappingWEBGL 模式（mipmapFilter: "LINEAR_MIPMAP_LINEAR"在配置中）激活。

但是，我注意到在 CANVAS 模式下色调不起作用，这是我的游戏需要的东西。所以，我尝试了 WEBGL 模式，看到mipmapFilter我添加的使我的精灵更好，但还不够好：

有没有办法改善这种情况？