Redraw scene in update

Phaser 3
1

I’m struggeling to understand basic concepts of how to use phaser I think. Coming from other engines I’m used to have something like this in my game loop:

scene.clear();
for all game objects I want to draw in this frame:
    scene.draw(object);

It seems to me that this is not the way phaser is meant to be used. Instead, the scene is set up in the create function and objects already there are moved or whatever in the update function, right? Thus, the whole scene is not redrawn every frame, but only the objects that need an update are updated.

I came to struggle with this on how to implement a zoom functionality in a strategy game. If I for example draw a line with a thickness of 1 pixel and then zoom in with the camera zoom, the line gets thicker, depending on how much I zoom in. What I want is for the line to always have a thickness of 1 pixel, independent of how much I’ve zoomed in. With the pseudo code above this can be trivially achieved, because I’m redrawing everything anyway.

How to do this properly with phaser? I guess I could just redraw everything in the update function. However, with phaser offering a create function I have doubts this is the way phaser is meant to be used. I mean, I would basically call the create function in the update function with that.

2

Phaser does all of the rendering. It redraws the canvas every frame.

For Graphics you could do

function update () {
  graphics
    .clear()
    .lineStyle(1 / this.cameras.main.zoom)
    .lineBetween(/*…*/)
    // etc.
}
3

Hi! I’m still beginner with Phaser, so if my question is stupid, please forgive me :slight_smile: Is there a way to control the canvas redrawing from my source code? E.g. I’m creating chess game, where I don’t need 60fps redrawing during my 5 minutes thinking and looking on static picture. It just eats my phone battery. :slight_smile: I found some autoUpdate and customUpdate settings, but it only works for my physics factory, I assumed… In my “pure js” games, I simply called requestanimationframe whenever I needed and when the animations were done, js was doing “nothing” and canvas was just a “static picture”. Thanks.

p.s. So far, I was able to achieve it only with g.sys.game.destroy(), but how to bring the game back to life again later :smiley: This method stops calling main update function and when I draw a rectangle to the canvas from console, only after calling this method it stays drawn. All the others autoUpdate disabling attempts ended up in clearing my console rectangle, beacause of redraw…

p.s.2 Seems, that I just need to find lockRender ability from v2 in v3?

p.s.3 :slight_smile: Can I use g.sys.game.pause() and g.sys.game.resume() for that purpose in v3? Is this approach correct? Thanks

4

You could but you wouldn’t be able to resume from Phaser’s input events while paused.

See