Hey there, your module is great, i decided to edit some of it with some a few more features for myself, such as:
That should be it, also sorry if the code formatting is weird it’s just how i do mines (i hate horizontal scrollbars, which is why I’ve wrapped some of the long lines of code.)
Module (No credit needed.)
--!nocheck
local SoundService = game:GetService("SoundService")
local TweenService = game:GetService("TweenService")
local HoveringSound = SoundService:FindFirstChild("HoveringSound")
local ClickingSound = SoundService:FindFirstChild("ClickingSound")
local UIFX = {}
UIFX.__index = UIFX
type tab = {[any]: any}
--[[
Applys a animations to the UI when hovered.
-------------------------------------------
#1 - Element - The UI itself.
#2 - SizeScale - The UI's original size times the size scale.
#3 - SwapColors - if true, inverts the UI's colors when hovered.
#4 - Rotates - if true rotates the UI based on the threshold parameter, or {-10, 10},
if no threshold is provided.
#5 - Threshold - it should only have two values, a minimum and maximum number respectively,
plus a 3rd value for the swapped color intensity, which goes from 0 - 1.
#6 - Duration - How long the animation will play.
#7 - Style - the easing style the animation uses.
#8 - Direction - the easing direction the animation uses.
#9 - AddToAConnectionsTable - since this function returns a stop function, (which you can do by calling
this function if it's a variable.) you can set this to true if you have a dedicated connections table.
]]
function UIFX:HoverBigger(
Element: GuiButton,
Size: UDim2,
SwapsColors: boolean,
Rotates: boolean,
Threshold: {any},
Duration: number,
Style: Enum.EasingStyle,
Direction: Enum.EasingDirection,
AddToAConnectionsTable: {boolean | tab}
)
local OriginalSize = Element.Size
local OriginalBGColor = Element.BackgroundColor3
local OriginalRotation = Element.Rotation
local OriginalTextColor, OriginalImageColor, OriginalIconImageColor, Icon
if Element:FindFirstChild("Icon") then
Icon = Element:FindFirstChild("Icon")
OriginalIconImageColor = Icon.ImageColor3
end
if Element:IsA("TextButton") or Element:IsA("TextBox") then
OriginalTextColor = Element.TextColor3
elseif Element:IsA("ImageButton") then
OriginalTextColor = Element.TextColor3
OriginalImageColor = Element.ImageColor3
end
local function OnMouseEnter()
task.wait(.0125)
if HoveringSound then
HoveringSound:Play()
end
local SwappedColorAmount
if Threshold then
if Threshold[3] then
SwappedColorAmount = Threshold[3]
else
SwappedColorAmount = 1
end
end
TweenService:Create(
Element,
TweenInfo.new(Duration, Style, Direction),
{Size =
UDim2.new(
OriginalSize.X.Scale + Size.X.Scale,
OriginalSize.X.Offset + Size.X.Offset,
OriginalSize.Y.Scale + Size.Y.Scale,
OriginalSize.Y.Offset + Size.Y.Offset
),
Rotation = (Rotates and math.random(Threshold[1], Threshold[2]) or OriginalRotation)
}
):Play()
if SwapsColors then
local InvertedBGColor3 = Color3.new(
SwappedColorAmount - Element.BackgroundColor3.R,
SwappedColorAmount - Element.BackgroundColor3.G,
SwappedColorAmount - Element.BackgroundColor3.B
)
local InvertedTextColor3, InvertedImageColor3
if Element:IsA("TextButton") or Element:IsA("TextBox") then
InvertedTextColor3 = Color3.new(
SwappedColorAmount - Element.TextColor3.R,
SwappedColorAmount - Element.TextColor3.G,
SwappedColorAmount - Element.TextColor3.B
)
TweenService:Create(
Element,
TweenInfo.new(Duration * 1.75, Style, Direction),
{TextColor3 = InvertedTextColor3, BackgroundColor3 = InvertedBGColor3}
):Play()
elseif Element:IsA("ImageButton") then
InvertedImageColor3 = Color3.new(
SwappedColorAmount - Element.ImageColor3.R,
SwappedColorAmount - Element.ImageColor3.G,
SwappedColorAmount - Element.ImageColor3.B
)
TweenService:Create(
Element,
TweenInfo.new(Duration * 1.75, Style, Direction),
{BackgroundColor3 = InvertedBGColor3, ImageColor3 = InvertedImageColor3}
):Play()
end
end
end
local function OnMouseLeave()
task.wait(.0125)
TweenService:Create(
Element,
TweenInfo.new(Duration, Style, Direction),
{Size = OriginalSize, Rotation = OriginalRotation}
):Play()
if SwapsColors then
if Element:IsA("TextButton") or Element:IsA("TextBox") then
TweenService:Create(
Element,
TweenInfo.new(Duration * 1.75, Style, Direction),
{BackgroundColor3 = OriginalBGColor, TextColor3 = OriginalTextColor}
):Play()
elseif Element:IsA("ImageButton") then
TweenService:Create(
Element,
TweenInfo.new(Duration * 1.75, Style, Direction),
{BackgroundColor3 = OriginalBGColor, ImageColor3 = OriginalImageColor}
):Play()
end
end
end
local EnterConnection
local LeaveConnection
EnterConnection = Element.MouseEnter:Connect(OnMouseEnter)
LeaveConnection = Element.MouseLeave:Connect(OnMouseLeave)
local function StopFunction()
OnMouseLeave()
EnterConnection:Disconnect()
LeaveConnection:Disconnect()
if Element:FindFirstChild("__uiFXMouseEntered") then
Element:FindFirstChild("__uiFXMouseEntered"):Destroy()
end
if Element:FindFirstChild("__uiFXMouseLeft") then
Element:FindFirstChild("__uiFXMouseLeft"):Destroy()
end
end
if AddToAConnectionsTable[1] and AddToAConnectionsTable[2] then
table.insert(AddToAConnectionsTable[2], StopFunction)
else
return StopFunction
end
end
--[[
Plays a animation when the UI is pressed..
-------------------------------------------
#1 - Element - The UI itself.
#2 - Size - The UI's original size times the size scale.
#3 - Rotates - if true rotates the UI based on the threshold parameter, or {-10, 10},
if no threshold is provided.
#4 - Threshold - it should only have two values, a minimum and maximum number respectively.
#5 - Duration - How long the animation will play.
#6 - Style - the easing style the animation uses.
#7 - Direction - the easing direction the animation uses.
#8 - AddToAConnectionsTable - since this function returns a stop function, (which you can do by calling
this function if it's a variable.) you can set this to true if you have a dedicated connections table.
]]
function UIFX:ButtonPress(
Element: GuiButton,
Size: UDim2,
Rotates: boolean,
Threshold: {any},
Duration: number,
Style: Enum.EasingStyle,
Direction: Enum.EasingDirection,
AddToAConnectionsTable: {boolean | tab}
)
local OriginalSize = Element.Size
local OriginalRotation = Element.Rotation
local function OnMouseDown()
if ClickingSound then
ClickingSound:Play()
end
TweenService:Create(
Element,
TweenInfo.new(Duration, Style, Direction),
{
Size = UDim2.new(
OriginalSize.X.Scale + Size.X.Scale,
OriginalSize.X.Offset + Size.X.Offset,
OriginalSize.Y.Scale + Size.Y.Scale,
OriginalSize.Y.Offset + Size.Y.Offset
),
Rotation = (Rotates and math.random(Threshold[1], Threshold[2]) or OriginalRotation)
}
):Play()
end
local function OnMouseUp()
TweenService:Create(
Element,
TweenInfo.new(Duration, Style, Direction),
{Size = OriginalSize, Rotation = OriginalRotation}
):Play()
end
local EnterConnection
local LeaveConnection
EnterConnection = Element.MouseButton1Down:Connect(function()
OnMouseDown()
end)
LeaveConnection = Element.MouseButton1Up:Connect(function()
OnMouseUp()
end)
local function StopFunction()
OnMouseUp()
EnterConnection:Disconnect()
LeaveConnection:Disconnect()
end
if AddToAConnectionsTable[1] and AddToAConnectionsTable[2] then
table.insert(AddToAConnectionsTable[2], StopFunction)
else
return StopFunction
end
end
return UIFX