Original post is outdated, jump to here to read the newest version.
Despite being on the forum for about a year and having used it extensively for information, I haven’t really contributed much myself so I felt it was time to change that, so this is my first ever resource!
Albeit; this is a small contribution.
Say hello to EzUISprings!
(Uses the spring module made by BlackShibe.)
- What is it?
EzUISprings, as the name suggests, is a module made to make spring-like movements for your GUI's as simple as possible, giving them some more life with little fuss. Geared mainly towards newer developers / people who don't typically script themselves (i.e, UI Designers). After all, who want's to write out all the CFrame math? Not you that's for sure. There's not a whole lot more to say since that's basically all it is.There’s only like 4 main functions, each of which is pretty simple to explain:
- Setting it up.
My module can be found the roblox library here just plop it wherever and you should be good to go:Once you have it, you can create a new instance simply by using EzUiSprings.new()
. Make sure to specify your GuiObject as the constructor.
local EzUISprings = require(...) --module path (wherever you have it stored)
local MyGuiObject = script.Parent
local UISpring = EzUISprings.new(MyGuiObject)
If you want to have multiple UI elements moving all at once, I would recommend having them all together in a Frame
or CanvasGroup
, and giving that as your GuiObject.
- 2D UI
I don't really know how to title my headers, but this is a straightforward one. It's "the standard" UI movement, goes along with your camera movement.local EzUISprings = require(...)
local MyGuiObject = script.Parent
local UISpring = EzUISprings.new(MyGuiObject)
UISpring:ApplySpringEffect(
3, --SpringIntensity: number
false) -- UseCameraFocus: boolean
Just change the intensity to be however much you’d like the spring to move.
You can also change UseCameraFocus
to true
if you only want change in focus to influence the spring. Good for UI movements only when the player moves. (Assuming you aren’t already doing some camera manipulation).
There’s also a passthrough for the shove function so that you can influence the spring yourself if you’d like to.
UISpring:Shove(Vector3.new(1,0,1))
- 3D UI
Alright, the main prize, this one is just as simple as 2D actually, EzUISprings will automatically apply your object to a SurfaceGui, and display that in (roughly) the same place as it was placed on-screen beforehand.
local EzUISprings = require(...)
local MyGuiObject = script.Parent
local UISpring = EzUISprings.new(MyGuiObject)
UISpring:Apply3DSpringEffect(
1, --SizeFactor: number (I recommend keeping this set to 1 unless you are having issues with the gui not fitting on screen.)
2, --SpringIntensity: number
Vector3.new(), --BaseRotationOffset: Vector3
false, --UseCameraFocus: boolean
{}) --SurfaceGuiProperties_OPTIONAL: {[string]: any}
You can apply a rotation before any spring effects to it by changing the BaseRotationOffset
property.
UISpring:Apply3DSpringEffect(..., ..., Vector3.new(0, -20, 0)) -- in degrees
20 Degrees to the left for example:
And if you’d like to change some properties of the SurfaceGui, just add a dictionary of properties that you’d like to change at the end of the function. (Similar to a tween goal)
local PropertiesTable = {
Brightness = 3,
AlwaysOnTop = false -- you CAN do this although I wouldn't as there would probably be clipping issues in first person
}
UISpring:Apply3DSpringEffect(..., ..., ..., ... PropertiesTable)
Personally, I think this goes great with fast-paced movement, as it gives a bouncier feel to everything.
- 3D Mouse Influence
This one follows your mouse. Wow. In all seriousness though, this one is pretty handy for main menu's and the like.
Same-ish constructors, you get the idea at this point.
UISpring:Apply3DMouseEffect(
1, -- SizeFactor: number
2, -- Spring Intensity: number
{}) --SurfaceGuiProperties_OPTIONAL: {[string]: any}
- Done With It?
Just use :Disconnect()
! Your GUI will automatically get sent back to it’s original parent, unless ReturnToParent
is set to false; in which case it just get deleted.
UISpring:Apply3DMouseEffect(1, 2)
task.wait(3)
UISpring:Disconnect(true) -- ReturnToParent: boolean (warning: will error if parent no longer exists)
As I’ve said at the beginning, this is my first module / resource that I’ve posted publicly. Feedback is greatly appreciated!