How to make ui visible slowly using ui gradient

Help and Feedback Scripting Support
#1

To the point, so i need a script that make ui slowly appears with ui gradient transparency. i tried using NumberSequence() but i cant get it to work

#2

I think these sequences should work, try to tween between them.

local startSequence = NumberSequence.new({
	NumberSequenceKeypoint.new(0, 1), NumberSequenceKeypoint.new(1, 1)
})
local middleSequence = NumberSequence.new({
	NumberSequenceKeypoint.new(1, 1), NumberSequenceKeypoint.new(1, 1)
})
local endSequence = NumberSequence.new({
	NumberSequenceKeypoint.new(1, 0), NumberSequenceKeypoint.new(1, 1)
})
#3

can you make it using tweenservice ?

#4

You want me to make it or asking if it’s possible?

#5

yea if its possible to do that?

#6

I don’t think it’s possible to tween sequences so I’ll see what I can do.

1 Like
#7

Thinking about it, you can just do it using the BackgroundTransparency property…

#8

oh yea, now you mention it. thx

#9

I thought you needed to make it like appear sideways and not all in the same time if that makes sense, I’ll write a quick code and send it.

#10

TweenService:Create property named 'Transparency' on object 'UIGradient' is not a data type that can be tweened

i got this error

#11 
local tweenService = game:GetService("TweenService")

local tweenInfo = TweenInfo.new(
	1, -- time
	Enum.EasingStyle.Sine, -- easing style
	Enum.EasingDirection.Out, -- easing direction
	0, -- reverse
	false, -- repeat count
	0 -- delay between repeats
)

local frame -- path to your frame

local function show()
	local tween = tweenService:Create(frame, tweenInfo, {BackgroundTransparency = 0})
	tween:Play()
	tween.Completed:Wait() -- optional
end

local function hide()
	local tween = tweenService:Create(frame, tweenInfo, {BackgroundTransparency = 1})
	tween:Play()
	tween.Completed:Wait() -- optional
end
#12

yea ik that, but i need a gradient

1 Like
#13

Ya well, you can’t tween NumberSequences, you can try lerping the value of “position” and the transparency from 1 to 0 .

#14

hmmm well thats unfortunate to hear

#15

I’ll just write you some code.

#16

Here you go, don’t forget to call the function when needed.

local iterations = 100 -- change 100 to increase/decrease smoothness

local uiGradient: UIGradient

local function lerp(v0, v1, t)
	return (1 - t) * v0 + t * v1
end

local function getShowSequence(t: number, keypoint2: NumberSequenceKeypoint): NumberSequence
	return NumberSequence.new{
		NumberSequenceKeypoint.new(lerp(0, 1, t), lerp(1, 0, t)),
		keypoint2
	}
end

local function getHideSequence(t: number, keypoint2: NumberSequenceKeypoint): NumberSequence
	return NumberSequence.new{
		NumberSequenceKeypoint.new(lerp(1, 0, t), lerp(0, 1, t)),
		keypoint2
	}
end

local function handle(show: boolean)
	local keypoint1 = NumberSequenceKeypoint.new(0, 1)
	local keypoint2 = NumberSequenceKeypoint.new(1, 1)
	
	task.spawn(function()
		for i = 1, iterations do
			uiGradient.Transparency = (show and getShowSequence or getHideSequence)(i / iterations, keypoint12)
		end
	end)
end
1 Like