Difficulty with Canvas and Screens


My daughter is trying to create a more complicated app with many screens and a single screen with a canvas that handles a simple game. I’ve produced a simplified version with Thunkable that has an intro screen, a directions screen that auto switches, and a screen with a canvas that has a thunkable beaver falling.

In preview mode, if you navigate to the canvas screen and press back, and go through the screens again it almost always crashes or doesn’t start the canvas the second time around. Chrome’s debug tools says it loads Phaser sound the first time, but it’s not defined the second time on this line of the javascript VM:

var mode = ‘SCALE’ === ‘SCALE’ ? Phaser.Scale.FIT : Phaser.Scale.ENVELOP

There seems to be an issue with mixing the two ways of development - screens and canvas with scenes - and it doesn’t properly reload Phaser if you return to a canvas screen. Is there a workaround for this issue or a better way to do this short of using canvas everywhere?


1 Like

Are you designing for the web? If not, I’d test this in Thunkable Live on a mobile device. On my iPhone, it moves the sprite to a random position and then the sprite falls. If I go back and press start again, it does the same thing.

If I preview it in a browser, the results are unpredictable. Sometimes the sprite disappears completely.

1 Like

She’s doing it as part of a class, so more for education than for the web. It would make the iteration time of testing the app easier if it reliably worked in the web browser preview. It seems like a bug in the underlying virtual machine running the app in the web browser. I’m glad it works on a phone - I might have to set her up with one once she’s pretty sure it works.

1 Like

You might consider submitting a bug report. I don’t use the Canvas enough to really have a good sense for what’s happening here but I find it unpredictable – which is the reason I don’t use it often. It would be nice to have some of these issues fixed.