How do I make a charging GUI?

I want to make a GUI that if you hold G, it charges up and when you release G, it stops charging and slowly depletes overtime. How can I do this?

(When holding G)
Screenshot_551

(When released G)
Screenshot_550

Just place the “white gui” under the other “darker gui”, now you have to try this

local maxtime = 5 --time taken for charging up
local draintime = 5 --time taken for battery to deplete
local cs = game:GetService("ContextActionService")
cs:BindAction("Charge", function(name,inputstate)
	local gui1 = game.Players.LocalPlayer:WaitForChild("PlayerGui"):WaitForChild("DarkGui")--assign the value of the parent darker gui
	local gui2 = gui1:WaitForChild("WhiteGui")
	gui2.AnchorPoint = UDim2.new(0.5,0,0,0)
	if inputstate == Enum.UserInputState.Begin then
		gui2:TweenSize(UDim2.new(0.5,0,1,0),Enum.EasingDirection.Out,Enum.EasingStyle.Linear,maxtime,true)
	else
		gui2:TweenSize(UDim2.new(0.5,0,0,0),Enum.EasingDirection.Out,Enum.EasingStyle.Linear,draintime,true)
	end
end,
true,
Enum.KeyCode.G)
3 Likes

works amazingly, thanks so much for the help

1 Like