WebCanvas Image disappears

I open a Sheet WebDialog which has a WebCanvas.
I copy an image from another Canvas to the WebCanvas on the WebDialog sheet when it is open.
The image shows up for a split second and then disappears.

Has anyone seen this? How can I make the Webcanvas image stay shown?


Can you show the code in your paint event?

What I’m actually doing is when the Sheet Dialog opens that has the WebCanvas, I call a JavaScript function to populate the WebCanvas with the current image of another canvas using Hml5 canvas commands. See function below:
I can call this same function after the dialog box is shown, and it works. The problem is I have to press a button to call it again, I want to have it shown when I open the Dialog box. Like I said it shows, but then disappears.
If I put this call in the open or paint events it crashes because those events are triggered when the page loads, and my canvas have nothing in them yet.

//snapshotimage is my WebCanvas, I pass it in with _canvas
function quickSnapShot(snapshotimage){

  canvas1 = document.getElementById(drawingCanvas); //Get Current Canvas where image is drawn.

//grab the context from your destination canvas
var destCtx = document.getElementById(snapshotimage).getContext('2d');

    //Copy the image drawn on canvas1 to destCtx
destCtx.drawImage(canvas1, 0, 0,canvas1.width,canvas1.height);




The shown event if often triggering before everything finished to load completely. In your case, I suspect your quickSnapShot function is called before the WebCanvas is completely set up (from the Xojo framework perspective). After your function has been executed the canvas is probably receiving some commands to clear it up from the Xojo framework, hence the ‘split second’.

Here is my suggestion: set a boolean flag property on your WebCanvas (call it, say, m_invalidated). In the Shown event, do a WebCanvas.Invalidate() just after setting the ‘m_invalidated’ flag to True.

Then, in the Paint event, do nothing while the ‘m_invalidated’ flag is False. When you detect it is switched to True, ExecuteJavascript with your ‘quickSnapShot’ function. The function should then be triggered after any internal clearing command that the Xojo framework may send.

(If that’s not enough, perhaps the use of a Timer could do the trick)

Perhaps Xojo is even creating/setting up the 2d context at this point, invalidating the previous one you just used, hence the image disappearance.

If you want to control the canvas context yourself, I suggest digging into the WebSDK and creating your own control.

I was able to use a Timer and get it to work, Thanks Guy!
I will look into creating my own control as Greg suggested as well. Thanks Greg