图像大小 vs sourceSize 奇怪的东西

问题描述

我们遇到了 Retina 显示器下图像模糊的奇怪问题。图像的左侧部分 - 之前，右侧 - 修复后。

我们的 QML 代码使用此代码来显示图像：

Image {
        anchors.verticalCenter: parent.verticalCenter
        sourceSize.width: 25
        sourceSize.height: 25
        source: preview.url
    }

我尝试将 sourceSize 乘以 Screen.devicePixelRatio - 图像变得更大，所以它们不适合它们的位置。

然后我用 sourceSize.width 替换了 width，height 也是如此。所以：

Image {
        anchors.verticalCenter: parent.verticalCenter
        width: 25
        height: 25
        source: preview.url
    }

现在工作正常。

我的问题是：

是否需要将sourceSize乘以devicePixelRatio？还是自动管理？似乎它是为 PNG 自动管理的，而不是为 SVG 管理的。
如果它已经为 PNG 自动管理（这些图像 preview.url 是 PNG），那么为什么它会模糊？原始 PNG 图片大小为 64x64 像素。
为什么我将 sourceSize 乘以 devicePixelRatio 后图像变大了？

添加 #1。我在图像的 URL 中使用 data:// 方案。即

QString url("data:");
url += imageMimeType;
url += ";base64,";
url += imageData.toBase64();

解决方法

在参考我给您的另一个答案 here 时，我对 Qt 代码的理解是，除了描述的情况 here 之外，Qt 不会缩放该值。所以我的理解似乎与您在 1 中陈述的相反。是什么证据导致您做出该陈述？

假设这个概念是正确的（我可能不正确），第 2 点的原因是 Qt 正在加载适合 1x 缩放的大小。但是对于更高的因素，存在质量损失。如果你在视网膜上，那么你应该调整那个值，或者提供@2x 版本。

至于第3点，原因可能在文档中：“如果未指定宽度和高度属性，则图像会自动使用加载图像的大小”。因此，如果您将加载的图像的大小加倍，则元素的大小也会加倍，因为您没有明确设置宽度和高度。

设置宽度和高度解决了这个问题，因为图像是全尺寸加载的，所以缩放后可以以适当的质量绘制。

如果我对 Qt 代码的理解有误，希望其他人可以纠正我。

qml qml qml qt qt qt qtquickcontrols2