How to detect gui collision? PLEASE HELP

Hey there! I was wondering how I could easily detect gui collision.

I have been working on a pretty small gui game recently. In the game a bunch of small frames are spawning really quickly in random positions, and I want it so that if a frame spawns touching a certain gui then it will redirect itself back to another random position.

I only need to know how to detect the guis collision, also please try to keep your answer simple because i’m kind of new to scripting.

1 Like

This module should help you with that!

Gui collision isn’t easy. You can use the module @TheSuzerain sent. Since you’re kind of new to scripting the only way to detect gui collision is that module.

(Also please use the search bar)

Well you see, I did use the search bar and in fact I did try to use that same module, but sometimes when you install a plugin on roblox, it sometimes just doesn’t show up in your plugins.

How exactly do you use this? I put the module in ReplicatedStorage and required it in another script, that’s all it really says. Now what!

I kind of feel stupid because it’s probably something really obvious.

And also, why isn’t this script working:

local GuiCollisionService = require(game:GetService("ReplicatedStorage").GuiCollisionService)
local group = GuiCollisionService.createCollisionGroup()

group:addHitter(script.Parent)
group:addCollider(script.Parent.Parent.ImageLabel.Human)

local connection;

connection = group:getHitter(1).CollidersTouched.Event:Connect(function(hits)
	if hits then
		script.Parent:Destroy()
		connection:Disconnect()
	end
end)

I was hoping that when a frame(human) spawns it will destroy another frame if it touches it. Instead it just does nothing

Please reply about this script in the main post not this one.

Hi! To fix that you can try this code:

local GuiCollisionService = require(game:GetService("ReplicatedStorage").GuiCollisionService)
local group = GuiCollisionService.createCollisionGroup()

group:addHitter(script.Parent.Parent.ImageLabel.Human, {})
group:addCollider(script.Parent, false)

local connection;

connection = group:getHitter(1).CollidersTouched.Event:Connect(function(hits)
	if hits then
        hits[1]:Destroy()
		connection:Disconnect()
	end
end)

Or you can try this:

local GuiCollisionService = require(game:GetService("ReplicatedStorage").GuiCollisionService)

local collider = script.Parent
local hitter = script.Parent.Parent.ImageLabel.Human

game:GetService("RunService").Heartbeat:Connect(function()
    if GuiCollisionService.isColliding(hitter, collider) then
       collider:Destroy()
    end
end)
1 Like

@jaipack17, this code is not working, I tried using a localscript, the second code, switching that one to a localscript, and even switching the hitter/colliders. Yet nothing worked.

Can you maybe show a video/image of whats happening?

Any errors?

I’m having trouble with GUI collision too
it is colliding, but it seems like frame1 thinks frame2 is bigger than it really is. so it creates some sort of offset.

function GuiCollisionService.isColliding(guiObject0, guiObject1)		
	if not typeof(guiObject0) == "Instance" or not typeof(guiObject1) == "Instance" then error("argument must be an instance") return end
	
	
	local ap1 = guiObject0.Position.X.Offset
	local as1 = guiObject0.Size.X.Offset
	local sum = ap1 + as1

	local ap2 = guiObject1.Position.X.Offset
	local as2 = guiObject1.Size.X.Offset
	local sum2 = ap2 + as2
	
	local corners0 = getCorners(guiObject0)
	local corners1 = getCorners(guiObject1)
	
	local edges = {
		{
			a = corners1.topleft,
			b = corners1.bottomleft
		},
		{
			a = corners1.topleft,
			b = corners1.topright
		},
		{
			a = corners1.bottomleft,
			b = corners1.bottomright
		},
		{
			a = corners1.topright,
			b = corners1.bottomright
		}
	}
	
	local collisions = 0
	
	for _, corner in pairs(corners0) do
		for _, edge in pairs(edges) do			
			if intersects(corner, edge) then
				collisions += 1
			end			
		end
	end
	
	if collisions%2 ~= 0 then
		return true
	end
	
	if (ap1 < sum2 and sum > ap2) then
		return true
	end
	
	return false
end

anyone know whats wrong?

Sorry for bumping, but you can this to detect collisions

Basically, how it works is that it checks if frame 1 left side is less than frame 2 right side and frame 1 right side is greater than frame 2 left side, same for the bottom and top

Module Script
local module = {}

function getSides(Frame:Frame)
	local s = Frame.AbsoluteSize / 2
	local p = Frame.AbsolutePosition
	local c = p + (s / 2)

	return {
		t = c.Y - s.Y;
		b = c.Y + s.Y;
		l = c.X - s.X;
		r = c.X + s.X;
	}
end

function module.AreFramesColliding(Frame1:Frame,Frame2:Frame)
	local s1 = getSides(Frame1)
	local s2 = getSides(Frame2)

	if s1.l < s2.r and s1.r > s2.l then
		if s1.t < s2.b and s1.b > s2.t then
			return true
		end
	end
	
	return false
end

return module
1 Like