UI Tweening Problem

Help and Feedback Scripting Support
#1

I want to tween some text so that it slides smoothly from behind this line, but the problem is that the tween is ignoring the scale of the textBox’s parent

How do I fix this?

What should happen after the tween:
image

What happens instead:

image
image894×604 36.2 KB

(The other text is there, it’s just gone out of view)

#2

Can you please share the code that operates this?

#3

Yeah, here it is!

function cutsceneModule.setText(label, message, blur)
	task.spawn(function()
		if blur then
			tweenService:Create(lighting.Blur, TweenInfo.new(1), {Size = 20}):Play()
			task.delay(4, function()
				tweenService:Create(lighting.Blur, TweenInfo.new(1), {Size = 0}):Play()
			end)
		end
		text[label][label].Text = message
		
		local textFadeIn = tweenService:Create(text[label], TweenInfo.new(1), {Position = UDim2.new(shown)})
		textFadeIn:Play()
		textFadeIn.Completed:Wait()
		task.wait(4)
		local textFadeOut = tweenService:Create(text[label], TweenInfo.new(1), {Position = UDim2.new(hidden)})
		textFadeOut:Play()
		textFadeOut.Completed:Wait()
		text[label][label].Text = ""
	end)
end
#4

So, the error here (I believe) is the UDim2 of the ui. It moves, right? If that’s the case, then it’s what u set as the shown and hidden. Can you show me the properties of what you want and also what’s in the script?

#5

here’s the properties of the title text -

image
image304×528 20 KB

And the properties of the title’s parent

image
image308×604 23.2 KB

Sorry, this is a little bit confusing :slight_smile:

#6

Something like this?
The implementation makes me dead. (You know what to do next time)

local TweenService = game:GetService("TweenService")
local Lighting = game:GetService("Lighting")

local Button = script.Parent
local Player = game:GetService("Players").LocalPlayer
local PlayerGui = Player.PlayerGui

Button.MouseButton1Click:Connect(function()
	setText("Title", "Message")
end)

function setText(Title, Message)
	task.spawn(function()
		local BlurEffect = Instance.new("BlurEffect", Lighting)
		
		local ScreenGui = Instance.new("ScreenGui", PlayerGui)
		local TextLabel1 = Instance.new("TextLabel", ScreenGui) -- Title
		local TextLabel2 = Instance.new("TextLabel", ScreenGui) -- Message
		local Frame = Instance.new("Frame", ScreenGui) -- Bar
		
		TextLabel1.AnchorPoint = Vector2.new(0.5, 0.5) -- Always setting AnchorPoint as {0, 0} or {0.5, 0.5} to reduce confusion
		TextLabel2.AnchorPoint = Vector2.new(0.5, 0.5)
		Frame.AnchorPoint = Vector2.new(0.5, 0.5)
		
		TextLabel1.Position = UDim2.new(0.5, 0, -0.5, 0)
		TextLabel1.Size = UDim2.new(0.3, 0, 0.1, 0)
		TextLabel1.TextScaled = true
		
		TextLabel2.Position = UDim2.new(0.5, 0, 1.5, 0)
		TextLabel2.Size = UDim2.new(0.3, 0, 0.1, 0)
		TextLabel2.TextScaled = true
		
		Frame.Position = UDim2.new(0.5, 0, 0.5, 0)
		Frame.Size = UDim2.new(0.5, 0, 0.05, 0)
		
		TweenService:Create(BlurEffect, TweenInfo.new(1), {Size = 20}):Play()
		
		task.delay(4, function()
			TweenService:Create(BlurEffect, TweenInfo.new(1), {Size = 0}):Play()
		end)
		
		TextLabel1.Text = Title
		TextLabel2.Text = Message

		local textFadeIn1 = TweenService:Create(TextLabel1, TweenInfo.new(1), {Position = UDim2.new(0.5, 0, 0.4, 0)})
		local textFadeIn2 = TweenService:Create(TextLabel2, TweenInfo.new(1), {Position = UDim2.new(0.5, 0, 0.6, 0)})
		textFadeIn1:Play()
		textFadeIn2:Play()
		textFadeIn2.Completed:Wait()
		
		task.wait(4)
		
		local textFadeOut1 = TweenService:Create(TextLabel1, TweenInfo.new(1), {Position = UDim2.new(0.5, 0, -0.5, 0)})
		local textFadeOut2 = TweenService:Create(TextLabel2, TweenInfo.new(1), {Position = UDim2.new(0.5, 0, 1.5, 0)})
		textFadeOut1:Play()
		textFadeOut2:Play()
		textFadeOut2.Completed:Wait()
		Frame.Visible = false
		
		TextLabel1.Text = ""
		TextLabel2.Text = ""
	end)
end
#7

(I’m using the top text as a reference for this post)

It’s similar to that, but instead of tweening from the top of the screen it tweens from behind the line, as if it was hiding behind the line.

In case that was confusing, it basically slides out from behind the line

#8

Like this, but it would be hidden when it’s under the line (via use of the property ClipDescendants)

#9

You create 2 Frames for containing use. One Frame per a TextLabel. You tween the same as I have mentioned but swap the direction.

I guess you need to implement it by your own as it is too much work for me, or just not worth. As I cannot see any action you did to encourage me to do so.

#10

I solved it.

Sorry for wasting your time guys, it turns out that the problem was that in the tween I accidentally used the wrong variable, other than that it was working perfectly.

Once again I’m sorry you guys spent time trying to solve my problem :frowning: