How to render certain sprites only inside of a given area?

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By Adam Volný

Hello!

So I embarked on a journey to make my first Godot game, I decided to start simple - with a match-3 game. There is, however, one thing that I am not quite sure how to achieve simply.

I have a grid with gems and when some gems are matched and disappear, the grid gets refilled from the top. However, the grid does not take up the whole window and there is a significant free area around the grid.

Now, I want the refilling gems be visible ONLY inside the grid area and not outside the grid. There is a background picture however, and the grid is partly transparent.

Here is a picture of the game. Now I would like the blue gem at the top to be completely invisible and have the green gem cutoff at the top.

gems

I know of a solution that will work but I really would like to avoid it. That would be to create a sprite above the grid, that’s duplicate of the background and simply give it higher Z-index than the gems.

I suspect there must be simpler and nicer solution than this, do you have any ideas?

Thanks in advance!

:bust_in_silhouette: Reply From: LoneDespair

You could enable clip content in the parent container