Custom Draw for Sprite

[hyude]

Hello.

 

I am currently developing a game with Phaser.

 

What is the best way to draw a sprite in multiple places at the same time.

 

Let say, I want to create a Snake-clone.

My usual approach is to have a spritesheet which represents a head, body, and tail.

I will then draw the part dynamically, depending on the current position, state, and length of the snake.

 

How do I achieve this in Phaser?

 

Creating tons of sprite might instantly solve the problems (create one sprite everytime the snake eat, and make it follow the head movement).

 

However, I suspect the multiple sprites approach will mess up game performance.

 

Is there any way I can create a sprite or game object with customized rendering logic? (not just draw this sprite here with given scale, position, and rotation angle).

 

Another note : The sprite won't need any physics feature, so if the solution will messed up physics, it is fine.

 

Thank you.

[rich]

I would use a RenderTexture for this, definitely!

[hyude]

Ah that was exactly what I was needed. Thanks rich.

[chg]

Aren't sprites reasonably cheap? Especially batched with the webgl renderer?

 

For the example of a snake game, you could even have horizontal/vertical spans of snake cells represented as TileSprites to further reduce drawing esp. for the canvas renderer, and only update the front and back spans as the snake moves to further simplify your drawing logic... if the Nokia 3310 could handle the complexities of rendering snake a 15 years ago without bursting into flames, I hope even modern mobiles should be able to do it with JavaScript.

[hyude]

Which one is the better approach performance-wise?

 

Having multiple sprites, or using renderTexture?

 

From what I have been reading, TileSprites is useful for Static Object. Does tilesprites also suitable for dynamic object (which change its attribute with every update)?

 

How about when I need my snake to be polished, so the head, body, tail part each consist of several frame for animation and transition smoothing purpose?