Replicate the path-drawing mechanic of this game.

Hi ! I need some help to replicate the path drawing mechanic seen in this kind of games : https://play.google.com/store/apps/details?id=com.badcrane.rgbexpress&hl=fr ;

I mean, things like : - path drawing when the player draws on the 'grid'
- path erasing
- path intersecting

I hope someone can help me, I'm having real troubles to understand how this is done ^^'

 

The old 2d way of doing it would be to have a 4-bit number for each block on the screen. The 4 bits would represent left/right/top/bottom. That gives you a total of 16 different combinations for each block sprite needed to represent part of the path.

For instance, if we assume the 4 bits are in this order: LRTB

And this is our path:

Code (CSharp):

1. --
2.  |
3.  --

We can see that (translated to LRTB) this is what the path looks like:

And this is our path:

Code (CSharp):

1. (LR)(LB)
2.     (TB)
3.     (TR)(LR)

So:

(LR) means that the block has an exit at the left and an exit at the right
(LB) means that the block has an exit at the left and an exit at the bottom
(TB) means that the block has an exit at the top and an exit at the bottom

etc...

Translating that to our bitfield LRTB (8421) we get:

Code (CSharp):

1. (12)(9)
2.     (3)
3.     (6)(12)

If you use those numbers to render different sprites then the path should work correctly.
Sprite '12' would be a horizontal path sprite where as sprite '9' would be one that comes in from the left and leaves at the bottom.

The nice thing about this system is that it automatically works if you were to go over an existing path - it would just set the new bits and the sprite would change to be the correct one required.

 

Very clever solution ! Thanks you