How can i achieve this effect ? (Colliding two circle into each other)

I want to do an effect like this one for my game, but I have no idea how.

It’s basically 2 circles (sprites) that starts at separate places and cancel each other when they collide. But I don’t want the circles to simply disappear, I want only the parts that collide with a wall/the other circle to disappear.

Could someone help me with that ? Just give me the basic idea, I’ll work from that. Thanks !

A lot things are not clear here. You drawn two sprites that seem to grow in size but have equal size. Therefore the splitting wall / clipping plane is exactly between the two centers. However if those sprites can have different sizes that assumption wouldn’t hold true. How should the overlap looks like if say the blue one has double the size of the red one? Should the border between them still be a straight line? If so where should it be?

Another question is, how many of such “walls” do you plan to have? If it’s just two objects and maybe 4 “outer walls” this could be done with a custom shader by just introducing custom clipping planes. However you can’t have too many. In theory you could pass the planes as Vector4s through a texture to the shader, but it wouldn’t be great for performance. Since you would have to update all clipping planes each frame.

So the only concept you need to understand is the plane, especially the point-normal form:

ax + by + cz + d = 0;

Unity has a plane struct which represents such a mathematical plane. However it’s nothing more than a normal vector (a,b,c) and a distance from the origin (d). Of course we can’t use Unity’s plane struct in a shader, but as I said the plane equation is as simple as it gets.

In the fragment shader you would test each fragment against all planes and depending on in which direction you define your planes the fragment needs to be either behind all those planes or before all those planes. If one plane test fails, you just discard the fragment.

That’s the basic idea.

Using a Texture2D to define the planes probably won’t work well due to the bad number precision of textures. You would need to use a float texture. So instead of RGBA you would need to use RGBAFloat this texture format requires 4 times the memory, might be slower and might not be supported on all platforms. An alternative would be to a vector array shader parameter and set them with SetVectorArray.

Though as i said if you have several objects and define clipping planes for all of them this gets pretty expensive for both: CPU and GPU. If the amount of objects is relatively low this should work.

Hi. If I’m understanding correctly your problem: you want to make invisible the pixels that match the intersection of the two sprites. That can be done with the Stencil Buffer ( Basically, you mask what pixels are part of the intersection in that buffer and later on you can discard those fragments when you render the sprites.