2D Collision Resource

This model detects collisions between two rectangles.

Included also: Drag handler, lets you drag two rectangles; Use as you may need.

Resources I used to build this:

Some help from Coding Math
He has a really useful playlist on youtube about 2D/3D physics, math application and Kinematics (Here)

Link to model: Model (Will not let me open for sale for now, I will maybe reply when I can.)
Link to game: Game
Download for model: 2D-Collision (1).rbxm (4.6 KB)
Download for new model: 2D-Collisions-New.rbxm (4.9 KB)

Documentation

Methods
module.newrect(): Takes 6 paramaters
Name: String
Parent
Position: UDim2
Size: UDim2 or nil; For default size
BoundToCollisions: Boolean; Wether the module checks for collisions on this object
Draggable: boolean; Wether the player can drag the ui
Returns: Frame (In the future I will change it to allow different UI types, most likely tomorrow)

rectangle.Collision: Fires when the rectangle collides with another rectangle that is bound by collision, and passes that rectangle as a function parameter
rectangle.CollisionEnded: Fires when the rectangle ends contact with another rectangle, passes that rectangle as a function parameter

module.collide: Takes two rectangles and determines if they are colliding or not
Returns: boolean
Setup
Download the module above, and insert it into StarterGui, Then creating a new ScreenGui and adding a local script

Start by requiring the module

local module = require(path.to.module)

Then we create two rectangles

local rectangle1 = module.newrect("Rectangle1",script.Parent,UDim2.fromScale(math.random(), math.random()), UDim2.fromScale(0.13,0.267), true, true)
local rectangle2 = module.newrect("Rectangle1", script.Parent,UDim2.fromScale(math.random(), math.random()), UDim2.fromScale(0.13,0.267), true, true)

We can use

rectangle1.Collision.Event:Connect(function(hit)
        --Fires when rectangle 1 hits another rectangle, in this case rectangle2
        print("Rectangle 1 collided with Rectangle 2")
end)

To do something whenever one rectangle hits another.

Now what if I wanted to do something whenever any rectangle collides with another? Well theres an event for that.

local master = path.to.module.MasterCollision -- Different from before, do not require

master.Event:Connect(function(hit1, hit2)
        print("A collision happened!") --Hit 1 and 2 are the two rectangles that collided
end)

Full Code

local module = require(path.to.module)

local rectangle1 = module.newrect("Rectangle1",UDim2.fromScale(math.random(), math.random()), UDim2.fromScale(0.13,0.267), true, true)
local rectangle2 = module.newrect("Rectangle1",UDim2.fromScale(math.random(), math.random()), UDim2.fromScale(0.13,0.267), true, true)

rectangle1.Collision.Event:Connect(function(hit)
        --Fires when rectangle 1 hits another rectangle, in this case rectangle2
        print("Rectangle 1 collided with Rectangle 2")
end)

local master = path.to.module.MasterCollision -- Different from before, do not require

master.Event:Connect(function(hit1, hit2)
        print("A collision happened!") --Hit 1 and 2 are the two rectangles that collided
end)
--Wasn’t included in tutorial but you can use
rectangle1.CollisionEnded.Event:Connect(function(hit)
        print("Rectangle 1 stopped hitting "..hit.Name)
end)

It does work on mobile, but it does also change camera direction when dragging; Just a heads up.

Use Cases

2D Games
Any UI collision needs
Maybe simulating 2D physics?

Feel free to use the models to your personal needs.

2 Likes

This post isn’t very informative. I’d encourage you to add a bit more documentation to provide people with the practical uses of this.

1 Like

image

might wanna fix this

1 Like

I’m still not able to make it up for sale unfortunately. I’ll update the post when it lets me.

Edit: I’ve added the download for it in the post.

1 Like

The title is misleading. I thought this would detect when a GUI is touching another. This seems to be completely oriented in a script, not an instance that can be interacted with in Roblox. Can you please elaborate on what this does? So far, I don’t know if this has anything to do with Roblox other than the fact that it is coded in Lua.

Other than that, though, it seems like a very cool resource! I can’t wait to play around with it!

This is cool. I used something a bit differently for my 2d physics thing I made a while back. basically I just treated each vertex on the particle (square) as a point, then applied the AABB checks from that and if one of the verticies would not be colliding within the other square (the background) based on its current position and velocity in the next step then I would have its velocity be flipped based on the normal (manually defined, it was literally just like 0,1 0, -1, 1,0, -1, 0) across its velocity so it was like the DVD thing in the old VHS’s. I do wish you did what @Officiall_Studios said by making the collision for frames built-in and not just providing the math but also providing the boiler code for actual UI too

1 Like

I’ve taken your (and @Officiall_Studios 's) feedback into consideration and made a module from it, it can now do multiple rectangles also.

2 Likes