Tweening Transparency from a corner

Help and Feedback Scripting Support
1

Hey i need some help with this im trying to recreate the valve style intro where the text fades from top left to bottom right and i can’t do this it won’t work can you help me?

local IntroStart = game.ReplicatedStorage.IntroStart
IntroStart.OnClientEvent:Connect(function()
	local TweenService = game:GetService("TweenService")
	local Logo = script.Parent.CodeLogo
	local tween = TweenService:Create(Logo.ImageTransparency, TweenInfo.new(10), {Transparency = 1})
	tween:Play()
end)

Intro Start is when the player joins the game and if i just use normal transparency it just sets the background transparency i wanted to create and effect like valve where from the top left to the bottom right it slowly becomes transparent. Takes around 5 - 6 seconds. Anyway i can get help, Thanks!

2

Hey there!

If this is an ImageLabel/ImageButton, you need to set its ImageTransparency value. That way you change the image’s transparency.

1 Like
3

Instead of ```
TweenService:Create(Logo.ImageTransparency, TweenInfo.new(10), {Transparency = 1})

you need to do```
TweenService:Create(Logo, TweenInfo.new(10), {ImageTransparency = 1})
1 Like
4

Yeah thanks i tried that and it doesn’t start from the top left corner to the bottom right corner i would like that kind of effect with the ImageTransparency going down. How would i do that?

5 
TweenService:Create(Logo, TweenInfo.new(10), {ImageTransparency = 1, Position = UDim2.new(1,0,1,0)})

Make sure the logos position is in the top left corner before playing this tween

1 Like
6

I mean’t the top left of the image im not sure if an imagelabel has a bounding box that i can snap it to But all i need to do is change the Udim2 to the top left of my image.
image
Like the top left of the CODE image label an effect like Valve. where it starts from the top left of the logo to the bottom right

7

Create a UIGradient Instance and move it inside the Code logo. Put its rotation to about 30 and set its offset to -1,0
Change the Transparency in the beginning to 1.

grafik
grafik901×273 7.49 KB

In the script you then tween the Offset if this UIGradient to Vector2.new(1,0). It would look like this:

local IntroStart = game.ReplicatedStorage.IntroStart
IntroStart.OnClientEvent:Connect(function()
	local TweenService = game:GetService("TweenService")
	local Logo = script.Parent.CodeLogo
	local tween = TweenService:Create(Logo.UIGradient, TweenInfo.new(10), {Offset = Vector2.new(1,0})
	tween:Play()
end)

This creates the effect you wanted to have

grafik
grafik769×398 33.8 KB

1 Like
8

Thank you very much!

30 charsssssssssssss