Tweening Difficulty

I am trying to create a menu where when you click a button it will fade out and fade in. I am doing this using Tweens, the only problem is sometimes the Ui will fade out and imminently become visible.

You can see it here:

Here is my code:

function fade(out, t, m, b)
	local tweendelay = 0.39
	local tween1 = nil
	local tween2 = nil
	local tween3 = nil
	local tween4 = nil
	local tween5 = nil
	local tween6 = nil
	local tweeninfograd = nil
	local goalgrad = nil
	local tweeninfotext = nil
	local goaltext = nil
	if out == true then
		tweeninfograd = TweenInfo.new(0.4, Enum.EasingStyle.Linear, Enum.EasingDirection.Out, 1, false, 0)
		goalgrad = {BackgroundTransparency = 1}
		tweeninfotext = TweenInfo.new(0.4, Enum.EasingStyle.Linear, Enum.EasingDirection.Out, 1, false, 0)
		goaltext = {TextTransparency = 1}
	elseif out == false then
		tweeninfograd = TweenInfo.new(0.4, Enum.EasingStyle.Linear, Enum.EasingDirection.Out, 1, false, 0)
		goalgrad = {BackgroundTransparency = 0}
		tweeninfotext = TweenInfo.new(0.4, Enum.EasingStyle.Linear, Enum.EasingDirection.Out, 1, false, 0)
		goaltext = {TextTransparency = 0}
	end
	if t == true then
		tween1 = tweenservice:Create(top, tweeninfograd, goalgrad)
		tween2 = tweenservice:Create(top.DisplayLabel, tweeninfotext, goaltext)
		tween1:Play()
		tween2:Play()
		wait(tweendelay)
		tween1:Cancel()
		tween2:Cancel()
	end
	if m == true then
		tween3 = tweenservice:Create(mid, tweeninfograd, goalgrad)
		tween4 = tweenservice:Create(mid.DisplayLabel, tweeninfotext, goaltext)
		tween3:Play()
		tween4:Play()
		wait(tweendelay)
		tween3:Cancel()
		tween4:Cancel()
	end
	if b == true then
		tween5 = tweenservice:Create(bot, tweeninfograd, goalgrad)
		tween6 = tweenservice:Create(bot.DisplayLabel, tweeninfotext, goaltext)
		tween5:Play()
		tween6:Play()
		wait(tweendelay)
		tween5:Cancel()
		tween6:Cancel()
	end
end

function topclicked()
	if running == false then
		running = true
		if currentscreen == 1 then
			currentscreen = 3
			fade(true, true, true, true)
			bot.DisplayLabel.Text = "Back"
			--wait(1.2)
			wait(0.2)
			ls.Visible = true
			fade(false, false, false, true)
		end
		wait(rundelay)
		running = false
	end
end

top.MouseButton1Click:Connect(topclicked)

If you know why that is happening, can you please help me out? Thanks.

You cancelled the tweens right after it’s done tweening, which reverts it back to the normal state, that’s why it does that.

I added this after the Ui would fade out and then, for a split second, become visible and then go invisible again. After I added the canceling function it wouldn’t flicker any more, but now it is doing the thing above.