Tweening a Clipping UI

I am unsure on how to make this tween smoothly, i attempted this myself however it cam eout with working, but odd results

	clipping.Size = UDim2.new(sizeRatio, clipping.Size.X.Offset, clipping.Size.Y.Scale, clipping.Size.Y.Offset)
	top.Size = UDim2.new((sizeRatio > 0 and 1 / sizeRatio) or 0, top.Size.X.Offset, top.Size.Y.Scale, top.Size.Y.Offset) -- Extra

the example of me attempting it

function resizeCustomLoadingBar(sizeRatio, clipping, top,wentdown)
	if wentdown then
		local tweenInfo = TweenInfo.new(0.2)
		local tween2 = tweenservice:Create(clipping, tweenInfo, {Size = UDim2.new(sizeRatio, clipping.Size.X.Offset, clipping.Size.Y.Scale, clipping.Size.Y.Offset)})
		local tween1 = tweenservice:Create(clipping, tweenInfo, {Size = UDim2.new(sizeRatio, clipping.Size.X.Offset, clipping.Size.Y.Scale, clipping.Size.Y.Offset)})
		
		spawn(function()
			tween1:Play()

		end)
		tween2:Play()
	else
		clipping.Size = UDim2.new(sizeRatio, clipping.Size.X.Offset, clipping.Size.Y.Scale, clipping.Size.Y.Offset)

		top.Size = UDim2.new((sizeRatio > 0 and 1 / sizeRatio) or 0, top.Size.X.Offset, top.Size.Y.Scale, top.Size.Y.Offset) -- Extra check in place just to avoid doing 1 / 0 (which is undefined)
	end
	

end

the top is the current, it doesnt tween it at all just instantly changes it.

the latter is the attempt of me doing it.
same fuction for both but for the first one “wentdown” does not exist so ignore that.

2 Likes