UIBberration Module
INTRODUCTION
Hey all!, Its been a while since I’ve posted something, so I made this community resource. UIBberration lets you make chromatic aberration for GUIs without the hassle of making it yourself, this module is still a WIP, let me know if there is any errors or bugs I might have to fix or features that you would like me to add. You can get the module on the top or below this paragraph.
Follow along for the usage guide!
USAGE GUIDE
Requiring
Before we start, we first need to require the module for it to work, first get the module from the 2 top links and insert it into your game, place it where you can require it later, preferably in your gui or StarterGUI. Next require the script my typing:
local UIberration = require(*The Location*.UIBberration)
And your ready to go!
New Object
For this module to work, you have to specify what element and what 2 colours you will be using for the chromatic abberration. So start by making a variable and assigning it the UIBberration.new() function.
local Frame = UIberration.New()
Now the main things you have to specify in the brackets are the GUI Object, the Left colour, and the right Colour. So the code might look something like this.
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 0), Color3.fromRGB(0, 0, 255))
The colour on the left side always goes first, so make sure the colour you want on the left is first. Then follows the right colour.
if you want a little more control and imbed a little more into your function, you can continue with a table and specify more properties.
The first property is Offset, this is how much the chromatic aberration is offset from the original GUI. This is a Vector2 not a UDim2.
Then follows the transparency, this is the transparency of the chromatic aberration.
and last but not least, the Z index, this is the index indicates if the chromatic aberration is in front of GUI elements or not.
So with all of that in mind, the whole function might look something like this:
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(3,3), transparency = 0.8, zIndex = -1})
METHODS
:ApplyAbberation()
The main method that you’re going to be using is :ApplyAbberation(). So when you’re ready to trigger the chromatic aberration. Fire this function and it should show up. The whole code should look something like this:
local UIberration = require(script.Parent.UIBberration)
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(4,4), transparency = 0.8, zIndex = -1})
Frame:ApplyAbberation()
now lets talk about the side functions you might also need to use.
:RemoveAbberation()
This function Removes the chromatic aberration effect from the GUI. It can be triggered with :RemoveAbberation()
local UIberration = require(script.Parent.UIBberration)
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(4,4), transparency = 0.8, zIndex = -1})
Frame:ApplyAbberation()
task.wait(3)
Frame:RemoveAbberation()
:CreateClone()
This function creates a clone of the right or the left colour of the chromatic aberration. The parameter in the function determines if it’s the right or left.
true for right, false for left.
local UIberration = require(script.Parent.UIBberration)
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(4,4), transparency = 0.8, zIndex = -1})
Frame:ApplyAbberation()
Frame:CreateClone(true)--Copies the right abberration
:CheckGUIType()
Checks the GUI type of the GUI, not really necessary for a normal developer but the module relies on it.
:UpdateTransparency()
This function and the rest of the functions below are self explanatory, this one updates the transparency of the chromatic aberration.
local UIberration = require(script.Parent.UIBberration)
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(4,4), transparency = 0.8, zIndex = -1})
Frame:ApplyAbberation()
Frame:UpdateTransparency(0.5)--0 to 1
:UpdateColors()
Updates the colour of the chromatic aberration.
local UIberration = require(script.Parent.UIBberration)
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(4,4), transparency = 0.8, zIndex = -1})
Frame:ApplyAbberation()
Frame:UpdateColors(Color3.fromRGB(0, 255, 0), Color3.fromRGB(0,0,255))
:UpdateOffset()
Updates the Offset of the chromatic aberration from the original, this is a Vector2 not a UDim2.
local UIberration = require(script.Parent.UIBberration)
local Frame = UIberration.New(script.Parent.Frame, Color3.fromRGB(255, 0, 7), Color3.fromRGB(0, 255, 255), {offset = Vector2.new(4,4), transparency = 0.8, zIndex = -1})
Frame:ApplyAbberation()
Frame:UpdateOffset(Vector2.new(2,2))
That concludes this post, this is my second community resource, let me know if I should make more, tell me any improvements I can make or features I can add. Get the module on the links on the top, or on the link below. That’s all for today, See you!
Module:
Portfolio:
JAcoboiskaka1121.
