How To Stop Tween From Breaking

Before we begin, I just want to make clear that I am only a beginner at scripting and that I needed help from tutorials and a friend to achieve this so far.

Anyways the problem is, I have a button and basically when you press it the tween plays and the frame reaches it’s destination and if u click it again, it will go back to it’s original position. Now the script works fine however if u spam click the button the tween will not play/move until you wait a bit and press it again. Now is there a way to stop this from happening/ a way to make players not be able to spam click the button?

Here’s the script:

local Button = script.Parent
local Main = script.Parent.Parent.MainFrame
local MainBorder = script.Parent.Parent.Border
local TweenIt = false

Button.MouseButton1Click:Connect(function()
	if TweenIt then
		TweenIt = false
		print("tweened")
		Button.Text = "Close"
		Main:TweenPosition(UDim2.new(0.1, 0, 0.108, 0),Enum.EasingDirection.InOut,Enum.EasingStyle.Sine,1)
		MainBorder:TweenPosition(UDim2.new(0.1, 0, 0.13, 0),Enum.EasingDirection.InOut,Enum.EasingStyle.Sine,1)
		else
		TweenIt = true
		print("go back")
		Button.Text = "Open"
		Main:TweenPosition(UDim2.new(-1, 0, 0.108, 0),Enum.EasingDirection.InOut,Enum.EasingStyle.Sine,1)
		MainBorder:TweenPosition(UDim2.new(-1, 0, 0.13, 0),Enum.EasingDirection.InOut,Enum.EasingStyle.Sine,1)
	
end		
	end)

1 Like

Maybe right after button click make button invisible and after the tween finish playing make button visible again.

2 Likes

I already see one issue and its from my own experience, I didn’t know the best way to do tweens was to do this:

You’ll want to set a goal with whatever you want, in this case like so:

--local tweenservice for later creation
local TweenService=game:GetService("TweenService")
local goal = {Position=UDim2.new(-1, 0, 0.108, 0)}

Then a tween info on the specs for the tween:

local tweenInfo = TweenInfo.new(
	1, -- Time
	Enum.EasingStyle.Sine, -- EasingStyle
	Enum.EasingDirection.InOut, -- EasingDirection
	0, -- RepeatCount (when less than zero the tween will loop indefinitely)
	false, -- Reverses
	0 -- DelayTime
)

Then simply create the tween (this should all be done before the mouse button 1 click, also you may need to wait for child for the object in question)

local tween = TweenService:Create(Main, tweenInfo, goal)

Then inside mousebutton1click do:

tween:Play()

this method will solve your issues, they won’t need to wait at all between clicks and the tweens will execute regardless of status.

You’ll have to make a tween for each tweening you are wanting to do, so 4 tween locals will need 4 goals to be created they all use the same tween info so dont need to worry about that.

2 Likes

Dang, it actually worked. Thanks, I might go and check the other’s solutions first though.

1 Like

Thank you for this, I might have to study it a bit more though.

I highly suggest looking at the method I presented, It may take time to set up, but its worth it as it handles executions for you without needing to do anything else than setting up tweens and playing them when called upon

And of course make sure to have wait for childs, issues could arise where the script loads too fast and can’t identify the object because it doesn’t exist yet.

1 Like

Yeah, don’t worry that script above isn’t for a game. I’m just trying to learn more about tweens so that if I ever decide to make my own game I will know how to use it.

This method of creating the tween before the event fires and then calling the tween when the event fires just solved the issue I was struggling with.

I have another tween but it’s being created when the event fires, but it works fine. Coincidentally, (maybe not) the tween that needed to be created before the event also caused the button to leave the screen (like the guy who made this thread) and go to it’s original position.
Do you know why this is?

i would need more details (code, etc.) but I can assume it has something to do with your goals. I don’t see how it could interfere though cause all you would do is tweenservice:create a tween outside of any function and then it will have whatever goal you implemented it with, to be its goal. does you goal for the tween purposefully leave the screen?

This is the code I have for it. I didn’t include the other events or functions just because they work fine, it’s just when they click it would break. I did however include the function that brings the button into the screen.
In this, I created the tween for when the button leaves the screen before the event and called the tween inside of the event. But pretty much the issue was creating the buttonLeaveTween inside of the event vs before. Could this be because there’s already the “ring” (click/ripple effect) tween already there?

local TweenService = game:GetService("TweenService")
local PlayerGUI = game.Players.LocalPlayer.PlayerGui

local buttonLeaveGoal = { Position = UDim2.fromScale(0.5,-0.5) }
local buttonLeaveInfo = TweenInfo.new(3, Enum.EasingStyle.Bounce, Enum.EasingDirection.Out)
local buttonLeaveTween = TweenService:Create(btn, buttonLeaveInfo, buttonLeaveGoal)

--Button Sliding in upon join
local function enterUI()	
	local ScreenGui = script.ScreenGui:Clone()
	ScreenGui.Parent = PlayerGUI
	PlayerGUI:SetTopbarTransparency(1)
	btn = ScreenGui.PlayBtn
		
	local goal = {}
	goal.Position = UDim2.fromScale(0.5,0.682)

	local tweenInfo = TweenInfo.new(3,Enum.EasingStyle.Bounce,Enum.EasingDirection.Out)
	local tween = TweenService:Create(btn, tweenInfo, goal)
	tween:Play()
end
enterUI()

local btn = ScreenGUI.PlayBtn

btn.MouseButton1Down:Connect(function()
	buttonLeaveTween:Play()
	
	btn.ImageColor3 = pressedBtn
	local x, y = mouse.X, mouse.Y

--Clicking effect, makes a ripple effect via tweening
	local sizeFrame = Instance.new("Frame",btn.Parent.Parent)
	sizeFrame.Size = UDim2.new(0.1,0,0.1,0)
	sizeFrame.BackgroundTransparency = 1

	local ring = Instance.new("ImageLabel", btn.Parent)
	ring.Size = UDim2.fromScale(.025,0)
	ring.BackgroundTransparency = 1
	ring.ScaleType = 'Fit'
	ring.Image = "http://www.roblox.com/asset/?id=5221791428"
	ring.ImageColor3 = Color3.fromRGB(255,255,255)
	ring.Position = UDim2.new(0,x,0,y)
	ring.AnchorPoint = Vector2.new(0.5,0.5)

	local goal = {}
	goal.Size = UDim2.fromScale(.05,.05)
	goal.ImageTransparency = 1

--Create Tween for clicking effect
	local tweenInfo = TweenInfo.new(0.5, Enum.EasingStyle.Linear)
	local tween = TweenService:Create(ring, tweenInfo, goal)
	tween:Play()
	tween.Completed:Wait()
	Debris:AddItem(ring,1)
	
--Button Leaves Screen
	btn:TweenPosition(UDim2.fromScale(0.5,-0.5), Enum.EasingDirection.InOut, Enum.EasingStyle.Bounce)
end)

I don’t see anything particularly wrong, do you think you can provide a video and tell me which tween in particular is not functioning?

enteruitween

buttonleavetween

rippletween

leavescreentween