Jump to content

Visibility of overlapping containers


Recommended Posts

I am making an arena shooter multiplayer game with destroyable obstacles.

You can see a pre-alpha here:


I have encountered a problem I'm not sure on how to proceed on and I surprisingly couldn't find any information on similar issues.

My game will have tall walls and other obstacles which can potentially cover the player's character. 
I would like to make an effect similar to RTS games, where an outline or a shadow of the player is visible on top of the obstacle. See the below picture to get an idea of what I mean.

Image result for unit behind wall highlight rts

My player container contains several sprites.

I have a few ideas on how to do this, but I do not think they are optimal.
One is rendering the player container to a texture and using that a mask for potential overlapping obstacles, along with a filter.
Secondly is just placing a simple GUI marker that shows where the player character is.
In both cases, I am unsure on how to detect overlapping sprites.

Is there an established solution for such cases?

Link to comment
Share on other sites

I think I understand what you mean:

the player would be on layer 1,

then you have the obstacles on layer 2,

then you have a filtered layer 3. Layer 3 uses layer 2 as a mask, and layer 3 has always highest Z-order.

Every frame, the image from layer 1 is copied to layer 3, creating the overlay effect.

Is this correct?

Link to comment
Share on other sites

Yeah. the only thing is zOrder and zIndex- they are applied only inside the layer and only if sorting is enabled. Z-index of layer/group is deprecated.

You have to experiment with it.

You can try to do it without pixi-layers first. Just separate layers as containers and add renderTexture. pixi-layers is just making the process simpler to write.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...