[Interest] QML Canvas - imagedata and context setup
francis_herne at yahoo.co.uk
Sat Sep 19 18:24:14 CEST 2015
For a couple of days now, I've been trying to use QML Canvas in my application.
Initially I ran into 'bugs' with tiling mode (not only is it completely broken
for any usage, according to a dev on IRC it always has been - yet it's
recommended for some purposes in the docs). http://i.imgur.com/MqfzSoM.png
Having given up on that, I can't find a way to reliably create and use
CanvasImageData objects. The image URL has to be 'loaded' first with
Canvas::loadImage(), then the object actually created with
My first problem is that Canvas::loadImage() is asynchronous, so for an unknown
time after calling it it's not possible to create the data object. The docs
suggest using the onImageLoaded handler for that, but:
- It doesn't specify _which_ image was loaded, so I have to try to check every
image that I might have been trying to load. Annoying but minor.
- There's no guarantee that the Canvas is even available when the signal is
emitted. So I get "QML NewCanvas: Unable to use getContext() at this time,
please wait for available: true", or a null context. Looping for the context to
become available just causes a hang. Not trying to create the image object
obviously leaves said object uncreated.
Even when that happens to work, I just get more trouble:
- There's also no guarantee that the context can be obtained before PAINT
EVENTS are received. This seems utterly ridiculous to me - the sole example
code for Context2D in the docs reads:
var ctx = canvas.getContext('2d');
yet this will actually fail a noticeable proportion of the time. As before,
looping just causes a hang. There's no return status from onPaint, so being
unable to draw anything results in blank bits of canvas.
- Same for image loading - images might not have finished loading, so
drawImage() has nothing to draw. I can't find a way to wait for this either.
Can anyone advise how I can use this API without all the race conditions?
So far I haven't even managed "load an image and draw it in the corner of the
canvas", so an example for that would be really useful.
Thanks in advance for any suggestions,
More information about the Interest