How to fade out DX?

[FlyingSpoon]

showMenu = false

function showMenu()
  
dxDrawImage(x*0, y*0, x*1920, y*1080, "img/bg.png", 0, 0, 0, tocolor(255,255,255,255), false) -- Background Image

dxDrawRectangle(x*0, y*0, x*1920, y*80, tocolor(0, 0, 0, 126), false) -- Top Bar 
dxDrawRectangle(x*0, y*80, x*1920, y*10, tocolor(0, 96, 94, 126), false) -- Semi Top Bar

end

function bindMenu()
if showMenu == false then
   addEventHandler("onClientRender", root, showMenu)
   showMenu = true
else
   removeEventHandler("onClientRender", root, showMenu)
   showMenu = false
  end
end
bindKey("F1", "down", bindMenu)

I want to know how to fade this DX in, when it is visible, and fade out when it is turned off?

[LilDollaTechZone]

Try this

local sW, sH = guiGetScreenSize()
local startTick

local fadeTime = 1000

local started = false

function start()
	startTick = getTickCount() + fadeTime
	started = true
end
addCommandHandler("Sfade", start)

function render()
	if started then
		local progress = (fadeTime-(startTick-getTickCount()))/fadeTime
		local a = interpolateBetween(255, 0, 0, 0, 0, 0, progress, "Linear")
		dxDrawRectangle(0, 0, sW, 30, tocolor(55, 180, 0, a))
		if a == 0 then
			started = false
			startTick = nil
		end
	else
		dxDrawRectangle(0, 0, sW, 30, tocolor(55, 180, 0, 255))
	end
end
addEventHandler("onClientRender", root, render)

 

[FlyingSpoon]

local startTick

counter = getTickCount()
counteralpha = getTickCount()

function theRendered() 
progress = ( ( getTickCount() - counter ) / 5000 )
progressalpha = ( ( getTickCount() - counteralpha ) / 2000 )
local angle = interpolateBetween( 0, 0, 0, 360, 0, 0, progress, "Linear" )
alpha = interpolateBetween( 0, 0, 0, 255, 0, 0, progressalpha, "OutQuad" )
dxDrawImage(790, 308, 308, 328, "sh.png", angle, 0, 0, tocolor(255, 255, 255, alpha), false)

if progress >= 1 then
counter = getTickCount()
   end

if alpha == 0 then
			started = false
			startTick = nil
			removeEventHandler("onClientRender", root, theRendered)
   end
end
addEventHandler("onClientRender", root, theRendered)

function loggedIn()
startTick = getTickCount() + 1000
outputChatBox("logged in")

local progress = (1000-(startTick-getTickCount()))/1000
alpha = interpolateBetween(255, 0, 0, 0, 0, 0, progress, "Linear")
end
addCommandHandler("logged", loggedIn)

how can i make it fade out, once the ./logged command is used?