How can I make a BillboardGUI animate when It's going visible for the player?

Hi :hidere: !

So what i wanted to do is a billboard gui that have a small tween animation when you approach ( a bit like pet simulator you know when you approach an egg it have a pop-up thing) it instead of the default thing which makes it unsmooth

The issue is I don’t know how to locally detect the player distance from the billboard

I tried to use a fake proximity prompt to detect the position but I didn’t manage to make it work

Hope someone can help me on this :happy3: ! Thanks already!

1 Like

I don’t know how PetSim scripts their animation system, but I personally do it this way:

I create the billboard GUI.
Insert the frame I’m gonna animate and the UIListLayout (use to make so the frame scales in all directions) into the Billboard gui
And insert UIScale into the frame (used to scale the frame)

Here is vid example:
robloxapp-20240908-1013110.wmv (481.5 KB)

And the code I used:

local RunService = game:GetService("RunService")
local Players = game:GetService("Players")
local TweenService = game:GetService("TweenService")

local LPlayer = Players.LocalPlayer
local Char = LPlayer.Character or LPlayer.CharacterAdded:Wait() -- wait for char

local Cam = game.Workspace.CurrentCamera -- camera

local part_Billboard = game.Workspace.BillboardPart


local BillboardGui = script.Parent

local frm = BillboardGui.Frame

local UIScale = frm.UIScale

local MaxDist = BillboardGui.MaxDistance


--
local SecondsBeforeAnim = .45
local SecondsToPopup = .3
local SecondsToRemovePopup = .1
--


local IsBusy = false


local tween_Popup = TweenService:Create(UIScale, TweenInfo.new(SecondsToPopup, Enum.EasingStyle.Elastic, Enum.EasingDirection.InOut), {Scale = 1.3}) -- tweens the Scale value in UIScale


local function func_PopUpAnim()
	
	task.wait(SecondsBeforeAnim) -- wait a little before to Popup
	
	tween_Popup:Play() -- plays the anim (tweens the UIScale)
	
	task.wait(SecondsToPopup)
	
	IsBusy = false
end


RunService.Heartbeat:Connect(function()
	
	if(IsBusy == true) then
		return -- checks if it is currently playing or already played before
	end
	
	
	local magnitude = (Cam.CFrame.Position - part_Billboard.Position).Magnitude -- simple magnitude calculation (checks if player is the min distance for the frame to become visible)
	
	if(magnitude <= MaxDist) then -- if yes
		IsBusy = true -- makes it so it won't animate anymore ( does not disturb the playing anim )
		print("Playing")
		func_PopUpAnim() -- plays the anim
	end
end)

If you don’t understand something, something went wrong or anything else fell free to reply! :grin:
Also I can send you the script and billboard gui if you prefer :slightly_smiling_face:

:happy3: Hi ! First thank you very much for the help!
Could you please send me the billboard GUI so I can look into it and see how you did this better :huh:?

Don’t worry if you don’t want tho ! I’d understand!

Here is the file:
AnimExample.rbxm (9.0 KB)

BillboardPart → Workspace
BillboardGui → StarterGui

It keeps printing “Playing” but it don’t seems to work despite moving up everything where it should be?

Can you send me whole picture of workspace, and ScreenGui from the explorer

Nevermind its perfectly working, thanks for your help :happy3:!

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.