QML图像平滑属性不起作用

Question

在QML中,我创建了Rectangle一个包含一组Image元素的视图.我似乎无法使该smooth属性工作,它被设置true为视图和图像.我试过自己缩放图像并缩放视图.无论我做什么,我都会得到锯齿状的缩放图像.我错过了什么吗？

我正在使用Qt 5.2并使用QtQuick2ApplicationViewer(子类QQuickView)作为我的主视图.

我已经找到了通过替换引擎中的图像处理程序来应用平滑的解决方案,但我觉得该smooth属性应该只是开箱即用.

码:

Image {
    source: "image_400x400.png"
    width:  400
    height: 400
    smooth: true

    transform {
        Scale {xScale: 0.25; yScale: 0.25}
    }
}

第二次尝试:

Image {
    source: "image_400x400.png"
    width:  100
    height: 100
    smooth: true
}

第三次尝试:

Rectangle {
    width:  400
    height: 400
    smooth: true

    Image {
        source: "image_400x400.png"
        width:  400
        height: 400
        smooth: true
    }

    transform {
        Scale {xScale: 0.25; yScale: 0.25}
    }
}

我每次都得到相同的结果.

更新:根据Nejat的建议,我尝试了新的Qt 5 antialiasing属性.结果确实有所改善,但当缩放到0.5x以下时,边缘仍然会有点锯齿.有没有办法改变抗锯齿质量？

从左到右:

• 预期输出(用Photoshop缩放,未经编辑)
• antialiasing并smooth启用
• 仅smooth启用

我还在想为什么smooth不做任何事情.

Answer 1

要获得平滑的下采样,您需要mipmap!

随着Qt 5.3(将很快发布),这将工作:

Image {
    source: "image_400x400.png"
    width: 100
    height: 100
    mipmap: true
}

对于Qt 5.2,您可以尝试以下方法作为多重采样方法的更高质量替代方案:

ShaderEffectSource {
    id: src
    sourceItem: Image { source: "image_400x400.png" }
    mipmap: true
}

ShaderEffect {
    width: 100
    height: 100
    property var source: src
}

如果您不需要动态更改图像的比例,则最佳方法(对于所有相关的Qt版本)是:

Image {
    source: "image_400x400.png"
    sourceSize.width: 100
    sourceSize.height: 100
}

图像将在CPU上进行高质量缩减,然后上传到GPU.请注意,由于图像信息丢失,当以原始图像的比例显示时,它看起来会更糟.

关于smooth财产:

启用线性插值的smooth属性Image.默认情况下它是打开的,它是对最近邻插值的改进,它在以下情况下使用smooth = false; 但它对降尺度没什么帮助.

关于antialising财产:

设置antialiasing = true 根本不会改变图像缩放的质量.它只是平滑边缘,这在旋转图像时可能很重要.