Context2D.putImageData 无效

Question

我正在尝试在 QtQuick 上推送像素 Canvas

import QtQuick 2.4
import QtQuick.Window 2.1
import QtQuick.Controls 1.2

ApplicationWindow {
    Canvas {
        id: canvas
        width: 500
        height: 500
        Component.onCompleted:loadImage('kde.png');
        onImageLoaded:requestPaint();
        onPaint:{
            var ctx = getContext("2d");
            if (canvas.isImageLoaded('kde.png')) {
                var im = ctx.createImageData('kde.png');
                im.data[3] = 128;
                ctx.putImageData(im, 0, 0);
            }
        }
    }
}

但没有任何反应，canvas 保持空白。

问题不在于代码执行或图像加载，因为 if 中的 console.log 有效，检查 im.data 内容表明它包含数据。问题似乎是 putImageData 什么都不做。难道我做错了什么？有没有办法调试 putImageData?

Answer 1

我不明白为什么，但似乎应该使用 Context2D.putImageData() is not the right tool and that Context2D.drawImage() 来代替。

import QtQuick 2.4
import QtQuick.Window 2.1
import QtQuick.Controls 1.2

ApplicationWindow {
    Canvas {
        id: canvas
        width: 500
        height: 500
        Component.onCompleted:loadImage('kde.png');
        onImageLoaded:requestPaint();
        onPaint:{
            var ctx = getContext("2d");
            if (canvas.isImageLoaded('kde.png')) {
                var im = ctx.createImageData('kde.png');
                im.data[3] = 128;
                ctx.drawImage(im, 0, 0);
            }
        }
    }
}

按预期工作。

Context2D.putImageData 无效

Context2D.putImageData doesn't work

qt

canvas

qml