Jump to content

DX Login Animation


Recommended Posts

function dxDrawLogin()
	    
  	    dxDrawImage(x*0,y*0,x*1280,y*720, "bg.png", 0, 0, 0, tocolor(255, 255, 255, 255), false)
		
	    dxDrawText(guiGetText(edit_username), x*504, y*321, x*714, y*341, tocolor(255, 255, 255, 255), 1.00, "default", "left", "center", false, false, true, false, false)
        dxDrawText(string.rep ( "*", string.len ( guiGetText(edit_password) ) ), x*504, y*369, x*714, y*389, tocolor(255, 255, 255, 255), 1.00, "default", "left", "center", false, false, true, false, false)
		
		dxDrawText("Remember Credentials", x*560, y*416, x*700, y*438, tocolor(255, 255, 255, 255), 1.00, "default", "left", "top", false, false, true, false, false)
		

		local r,g,c
		if isMouseInPosition(x*452, y*448, x*335, y*41) then 
	    r,g,c = 0, 96, 93
		else
		r,g,c = 127, 169, 168
		end
	    dxDrawRectangle(x*452, y*448, x*335, y*41, tocolor(r,g,c, 127), true)
        dxDrawText("Sign In", x*451, y*448, x*787, y*489, tocolor(255, 255, 255, 255), 1.40, "default", "center", "center", false, false, true, false, false)
		
		
		local r,g,c
		if isMouseInPosition(x*452, y*499, x*335, y*41) then 
	    r,g,c = 0, 96, 93
		else
		r,g,c = 127, 169, 168
		end
		dxDrawRectangle(x*452, y*499, x*335, y*41, tocolor(r,g,c, 127), true)
        dxDrawText("Play As Guest", x*451, y*499, x*787, y*540, tocolor(255, 255, 255, 255), 1.40, "default", "center", "center", false, false, true, false, false)
	
end
addEventHandler("onClientRender", root, dxDrawLogin)

How would I slide all of this down with interpolateBetween? And what would the fastest way be to do this, because I want to animate multiple things in the same script?

Link to comment

startLogin = getTickCount()

function dxDrawLogin()
	
	-- ANIMATION --
	local now = getTickCount()
	local elapsedTime = now - startLogin
	local duration = 1000 -- Duration 1 second or you can change it
	local progress = elapsedTime / duration
	
	local x1, y1 = 0, 0 -- Start point x and y anim
	local x2, y2 = 400, 400 -- End point x and y anim
	
	local x, y = interpolateBetween ( 
		x1, x1, 0, -- Start point x, y
		x2, x2, 0, -- End point x, y
		progress, "Linear") -- You can change the "Linear" string with another easing type
	-- ANIMATION --
	
	dxDrawImage(x*0,y*0,x*1280,y*720, "bg.png", 0, 0, 0, tocolor(255, 255, 255, 255), false)

	dxDrawText(guiGetText(edit_username), x*504, y*321, x*714, y*341, tocolor(255, 255, 255, 255), 1.00, "default", "left", "center", false, false, true, false, false)
	dxDrawText(string.rep ( "*", string.len ( guiGetText(edit_password) ) ), x*504, y*369, x*714, y*389, tocolor(255, 255, 255, 255), 1.00, "default", "left", "center", false, false, true, false, false)

	dxDrawText("Remember Credentials", x*560, y*416, x*700, y*438, tocolor(255, 255, 255, 255), 1.00, "default", "left", "top", false, false, true, false, false)


	local r,g,c
	if isMouseInPosition(x*452, y*448, x*335, y*41) then 
	r,g,c = 0, 96, 93
	else
	r,g,c = 127, 169, 168
	end
	dxDrawRectangle(x*452, y*448, x*335, y*41, tocolor(r,g,c, 127), true)
	dxDrawText("Sign In", x*451, y*448, x*787, y*489, tocolor(255, 255, 255, 255), 1.40, "default", "center", "center", false, false, true, false, false)


	local r,g,c
	if isMouseInPosition(x*452, y*499, x*335, y*41) then 
	r,g,c = 0, 96, 93
	else
	r,g,c = 127, 169, 168
	end
	dxDrawRectangle(x*452, y*499, x*335, y*41, tocolor(r,g,c, 127), true)
	dxDrawText("Play As Guest", x*451, y*499, x*787, y*540, tocolor(255, 255, 255, 255), 1.40, "default", "center", "center", false, false, true, false, false)

end
addEventHandler("onClientRender", root, dxDrawLogin)

Don't forget to change x1, y1, x2, y2 value. That's just an example.

More details on wiki:

Link to comment
1 hour ago, raysmta said:

	local x, y = interpolateBetween ( 
		x1, x1, 0, -- Start point x, y
		x2, x2, 0, -- End point x, y
		progress, "Linear") -- You can change the "Linear" string with another easing type

x1, x1 or x1, y1, x2, y2

x1,y1,x2,y2

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...