Bad GUI animation via TweenService

  1. I want to achieve notifying the player through a local function with animation using TweenService

  2. the thing is, the animation doesn’t work the way I want it to here’s the video:
    robloxapp-20241230-2015475.wmv (809,7 КБ)

I want the notification window to go behind the player’s screen, but for some reason the animation works the other way around.

  1. I tried to look for a solution to this problem on the dev forum, but I did not find a solution.
local function notify_client(notify_title, notify_content, notify_lifetime)
	title_n.Text = notify_title
	TextLabel_n.Text = notify_content
	local a = TweenInfo.new(1)
	local b = notify
	local c = {Size = UDim2.new(0, 430, 0, 56)}
	local d = {Size = UDim2.new(0, 0, 0, 56)}
	local f = tweens:Create(b, a, c)
	local f2 = tweens:Create(b, a, d)
	notify.Visible = true
	f:Play()
	task.spawn(function()
		wait(notify_lifetime)
		f2:Play()
		f2.Completed:Connect(function()
			notify.Visible = false
		end)
	end)
end
wait(5)
notify_client('test', 'is test tes te gdeggegdehfebghbhdbfdhfbdhfd', 5)

Hello there.

First off, I would highly suggest you to use actually insightful variable names (instead of just letters), besides adding some extra spaces between variables to keep everything readable.

Once stated that, the problem with your code is that you’re modifying its size, when you stated you would like it to ‘hide’ through the side of the screen, you can move it out of the screen to achieve that behavior. Additionally, use Scale values for Udim2 instead of Offset if you would like the relations to be maintained throughout many screen sizes.
This would be your corrected script:

local function notify_client(notify_title, notify_content, notify_lifetime)
	title_n.Text = notify_title
	TextLabel_n.Text = notify_content

	local tweenInfo = TweenInfo.new(1)
	local guiInstance = notify

	local xScaleSize = 0.5 -- modify this until the notification opens up to your taste. From 0 to 1.
	local yScalePosition = 0.65 -- modify this to your taste. From 0 to 1.

	local openGoal = {Position = UDim2.fromScale(xScaleSize, yScalePosition)} -- fromScale since we're only using scales.
	local closedGoal = {Position = UDim2.fromScale(1, yScalePosition)}

	local openTween = tweens:Create(guiInstance, tweenInfo, openGoal)
	local closeTween = tweens:Create(guiInstance, tweenInfo, closedGoal)
	notify.Visible = true
	openTween:Play()
	task.spawn(function()
		task.wait(notify_lifetime) -- better than using wait()
		closeTween:Play()
		closeTween.Completed:Connect(function()
			notify.Visible = false -- technically, no longer needed, but you may keep it if you wish.
		end)
	end)
end
task.wait(5) -- better than using wait()
notify_client('test', 'is test tes te gdeggegdehfebghbhdbfdhfbdhfd', 5)

Exactly what I explained above implemented in a place I just created, it looks like this:

Hope this helps; Let me know if otherwise.

I’ve slightly adjusted your code to match mine, and the result is so cool.:
robloxapp-20241231-1530465.wmv (755,0 КБ)

Here is the final code:


local function notify_client(notify_title, notify_content, notify_lifetime)
	title_n.Text = notify_title
	TextLabel_n.Text = notify_content

	local tweenInfo = TweenInfo.new(1)
	local guiInstance = notify

	local xScaleSize = 0.51 -- modify this until the notification opens up to your taste. From 0 to 1.
	local yScalePosition = 0.67 -- modify this to your taste. From 0 to 1.

	local openGoal = {Position = UDim2.fromScale(xScaleSize, yScalePosition)} -- fromScale since we're only using scales.
	local closedGoal = {Position = UDim2.fromScale(1, yScalePosition)}

	local openTween = tweens:Create(guiInstance, tweenInfo, openGoal)
	local closeTween = tweens:Create(guiInstance, tweenInfo, closedGoal)
	notify.Visible = true
	openTween:Play()
	task.spawn(function()
		task.wait(notify_lifetime) -- better than using wait()
		closeTween:Play()
		closeTween.Completed:Connect(function()
			notify.Visible = false -- technically, no longer needed, but you may keep it if you wish.
		end)
	end)
end
task.wait(5) -- better than using wait()
notify_client('test', 'is test tes te gdeggegdehfebghbhdbfdhfbdhfd', 5)

Thank you For solving my problem!

1 Like

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