.png)
Table of Contents
GuiCollisionService is an easy to use module that focuses on helping you create collidable Guis and help you detect them using BindableEvents. It is one of the easiest and efficient Gui Collision Detector out there. It helps you to create intuative 2 dimensional physics in your roblox games.
- Get the module through this link: https://www.roblox.com/library/7145661386/GuiCollisionService
- Place the module inside ReplicatedStorage
Require the module in a LocalScript or a Script using the following code -
local GuiCollisionService = require(game:GetService("ReplicatedStorage").GuiCollisionService)
https://www.roblox.com/games/7111031857/Flappy-Wings
Before diving into the documentation, I would like to tell you, this module works on the basis of the 'hitter n collider' principle
The white frame is the collider - It is the frame that is hit by the hitter The green frame is the hitter - It is the frame that collides with the collider
Initializing
This function is the first step out of all, in order to create your colliders and hits.
- parameters: none
- returns: metatable
local GuiCollisionService = require(game.ReplicatedStorage.GuiCollisionService)
local group = GuiCollisionService.createCollisionGroup()Raw
- parameters: guiObjectHitter: instance, guiObjectCollider: instance
- returns: boolean
local instance1 = script.Parent.Frame1 -- example
local instance2 = script.Parent.Collider -- example [Frame]
GuiCollisionService.isColliding(instance1, instance2)- parameters: guiObjectHitter: instance, guiObjectCollider: instance
- returns: boolean
This function returns true if a gui is completely inside of another, else it returns false. If guiHitter's size is smaller than that of guiCollider, the function returns false.
local instance1 = script.Parent.Frame1 -- example
local instance2 = script.Parent.Collider -- example [Frame]
GuiCollisionService.isInCore(instance1, instance2)- parameters: shouldCollideAccordingToZIndex: boolean
- returns: nil
The function is used to determine if the hitter will collide with colliders that have different ZIndex values.
By default it is set to false
group:setZIndexHierarchy(true) -- hitter won't collide with colliders that have different Zindex values than the hittergroup:setZIndexHierarchy(false) -- hitter will collide with colliders that have different Zindex values than the hitter and also the colliders that have the same ZIndex as the hitterManaging Colliders
- parameters: guiObjectCollider: instance, solid: boolean
- returns: { index: number, instance: instance, solid: boolean }
The following function is used to declare a gui instance as a collider. Whenever a hitter collides with this gui instance, an event will be fired.
group:addCollider(script.Parent.Still)
group:addCollider(script.Parent.Frame)
local collider = group:addCollider(script.Parent.Frame2)
group:addCollider(script.Parent.Frame3, true) -- To make it impossible for a hitter to go through the collider
--[[
Colliders are saved as such:
{
Still,
Frame,
Frame2,
Frame3
}
]]--- parameters: index: number, instance: instance, solid: boolean
- returns: hitter: { index: number, instance: instance, solid: boolean }
This updates already existing collider's instance and solid property!
group:updateCollider(2, script.Parent.someCollider, false)- parameters: none
- returns: table
print(group:getColliders())- parameters: index: number
- returns: nil
group:removeCollider(1) -- removes the 1st collider that was addedManaging Hitters
- parameters: guiObject: instance, tweens: table
- returns: hitter: { index: number, hitterInstance: instance }
local tween = game:GetService("TweenService"):Create(script.Parent, TweenInfo.new(1, Enum.EasingStyle.Linear), {Position = UDim2.new(1,0,.5,0)})
group:addHitter(script.Parent.HitFrame, { tween })- parameters: index: number, instance: instance, tweens: table
- returns: hitter: { index: number, hitterInstance: instance }
This updates already existing hitter's instance and tweens!
group:updateHitter(1, script.Parent.SomeFrame, { tween1, tween2, tween3 })- parameters: index: number
- returns: instance
group:getHitter(1) -- returns the first hitter added- parameters: none
- returns: table
group:getHitters()- parameters: index: number
- returns: tweens: table
Returns all the tweens of the hitter
group:getHitterTweens(1) -- returns tweens of the 1st hitter- parameters: index: number
- returns: nil
group:removeHitter(1) -- removes the first hitter addedManaging Events
This event is fired when a hitter touches a collider! If it does, it returns a table of the colliders it is touching with
local hitter = group:getHitter(1) -- first hitter
hitter.CollidersTouched.Event:Connect(function(hits)
hitter.BackgroundColor3 = Color3.new(255,0,0) -- changes color of hitter to red when it collides.
end)This event is fired when a hitter is not in touch with any colliders at all
local hitter = group:getHitter(1) -- first hitter
hitter.OnCollisionEnded.Event:Connect(function(hits)
hitter.BackgroundColor3 = Color3.new(0,0,0) -- changes color of hitter to white
end)StarterGui:
Place a localscript inside ScreenGui:
local GuiCollisionService = require(game.ReplicatedStorage.GuiCollisionService)
local group = GuiCollisionService.createCollisionGroup()
group:addCollider(script.Parent.Still)
group:addCollider(script.Parent.Still2)
group:addCollider(script.Parent.Still3)
group:addHitter(script.Parent.Move)
group:getHitter(1).CollidersTouched.Event:Connect(function(hits)
group:getHitter(1).BackgroundColor3 = Color3.new(0.333333, 1, 0)
end)
group:getHitter(1).OnCollisionEnded.Event:Connect(function()
group:getHitter(1).BackgroundColor3 = Color3.new(255,255,255)
end)Place a localscript inside Move:
local player = game.Players.LocalPlayer
local RS = game:GetService("RunService")
RS.RenderStepped:Connect(function()
script.Parent.Position = UDim2.new(0, player:GetMouse().X, 0, player:GetMouse().Y)
end)
Thank you, Hope it helps you out, I would love to see the growth of 2 Dimensional games on roblox, and thats why I am bringing out a tutorial for making 2 dimensional roblox games pretty soon!
Peace!