Weave pattern

[Zelthor]

Hey guys,

I have a problem..
I'm working on this game where you have to lace a shoe in different patterns.

A lace can pass over or under the other laces, to create different patterns..
However, I can't seem to figure out a way to be able to display the following pattern:

Obviously, this can't eb done with z-index sorting.. I tried with Masking, but this soon became really really heavy on the CPU..

Can anyone think of another solution i might have overlooked?
Any leads would be much appreciated!

~ Bas

[IqAndreas]

The only solution (other than making a library which handles different depths of MovieClips at various areas, and then creates BitmapData based on those depths - long process!) is to break apart the MovieClip.

Either you can look at it as several "tiles"

(notice how the right side is just a rotated version of #2, and the bottom a rotated version of #3, and how you really only need 4 different tiles to make this image)


Or you can break apart each "line" into several segments, and then put each individual segment in depth order based on where you want it.


How good are you with ActionScript? This might be a bit of an undertaking if you are just getting started...

[Zelthor]

Call me a senior..

They problem i'm facing however is that it's not split up in tiles..
They real crux of the situation comes with patterns like this:

I think my best option might be to find some kind of balance between z-sorting the most obvious laces, and add masking where z-sorting is impossible..

(also, it should not be limited by this here example, it should be able to handle any pattern of lacing the user likes..)

The problem with performance is that all the laces are controlled by the physics engine Box2D, thus creating a really dynamic scene..
Instead of drawing just one mask, i will need to draw them every frame (only if they're moving though, but if more than three laces move at the same time, the performance just.. kills te experience..)

The way i'm drawing these masks, is by creating a new black filled bitmapData, looping through every pixel, and checking it against the pixels of the bitmapData of the lace that's supposed to go 'over' this lace.
If i encounter a pixel that is not seethrough, i will make the pixel in my black filled bitmap data see through:

[Zelthor]

Got it all figured out..
I just optimized my algorythm here and there,
and now it's running like crazy xD
No more frame drops!