How to make interpolate smoother?

[FlyingSpoon]

counter = getTickCount()

alpha = 0

function firstShow()
        local progress = ( ( getTickCount() - counter ) / 5000 )
        local progress2 = ( ( getTickCount() - counter ) / 2000 )
        :Oanim1 = interpolateBetween(1800, 0, 0, 1545, 0, 0, progress2, "Linear" ) 
	    alpha = interpolateBetween(alpha, 0, 0, 255, 0, 0, progress, "Linear") 
	    dxDrawImage(:Oanim1, 35, 50, 50, ":not/img/circle.png", 0, 0, 0, tocolor(255, 255, 255, alpha), true)
		
		if progress >= 0.40 then
		addEventHandler("onClientRender", root, secondShow)
		end
end
addEventHandler("onClientRender", root, firstShow)

pawn = 0
function secondShow()
       pawn = pawn + 0.005
outputChatBox(pawn)
       local progress = ( ( getTickCount() - counter ) / 3000 )
       local progress2 = ( ( getTickCount() - counter ) / 1000 )
       local progress3 = ( ( getTickCount() - counter ) / 5000 )
       local :Oanim = interpolateBetween(0, 0, 0, 300, 0, 0, progress, "Linear" )
       local :Oanim2 = interpolateBetween(1569, 500, 0, 1868.3, 0, 0, progress, "Linear" )
	   local alpha = interpolateBetween(0, 0, 0, 150, 0, 0, progress, "Linear") 
	   local alpha2 = interpolateBetween(0, 0, 0, 255, 0, 0, progress, "Linear")  
	  
	  if progress2 >=0.2 then
	   	   alpha3 = interpolateBetween(0, 0, 0, 255, 0, 0, progress2, "Linear") 
      end
	   dxDrawRectangle(1569, 36, :Oanim, 48, tocolor(0, 0, 0, alpha), false)
       dxDrawText("Welcome to FTW Gaming! Enjoy!", 1608, 40, 1866, 79, tocolor(255, 255, 255, alpha3), 1.20, "default", "left", "center", false, false, true, false, false)
	   dxDrawImage(:Oanim2, 35, 26, 50, ":not/img/extend.png", 0, 0, 0, tocolor(255, 255, 255, alpha2), false)
	  
	  if progress3 <= 1 then
	  addEventHandler("onClientRender", root, thirdShow)
	  removeEventHandler("onClientRender", root, secondShow)
      removeEventHandler("onClientRender", root, firstShow)
	  end
end

function thirdShow()
       local progress = ( ( getTickCount() - counter ) / 5000 )
	   local progress3 = ( ( getTickCount() - counter ) / 2000 )
       local progress4 = ( ( getTickCount() - counter ) / 3000 )
       local progress5 = ( ( getTickCount() - counter ) / 4000 )

       local :Oanim = interpolateBetween(300, 0, 0, 0, 0, 0, progress, "Linear" )
       local :Oanim2 = interpolateBetween(1868.3, 500, 0, 1569, 0, 0, progress, "Linear" )
       local :Oanim3 = interpolateBetween(1868.3, 500, 0, 1569, 0, 0, progress, "Linear" )
	   local alpha = interpolateBetween(0, 0, 0, 150, 0, 0, progress, "Linear") 
			   
	   alpha5 = interpolateBetween(255, 0, 0, 0, 0, 0, ((getTickCount()-counter)/4000), "Linear")
	   alpha6 = interpolateBetween(100, 0, 0, 0, 0, 0, ((getTickCount()-counter)/4000), "Linear")
	   alpha7 = interpolateBetween(255, 0, 0, 0, 0, 0, ((getTickCount()-counter)/4000), "Linear")
   
	   dxDrawImage(1545, 35, 50, 50, ":not/img/circle.png", 0, 0, 0, tocolor(255, 255, 255, alpha5), true)
	   dxDrawRectangle(1569, 36, :Oanim, 48, tocolor(0, 0, 0, alpha6), false)
       dxDrawText("Welcome to FTW Gaming! Enjoy!", 1608, 40, 1866, 79, tocolor(255, 255, 255, alpha7), 1.20, "default", "left", "center", false, false, true, false, false)
	   dxDrawImage(:Oanim2, 35, 26, 50, ":not/img/extend.png", 0, 0, 0, tocolor(255, 255, 255, alpha6), false)
	   
setTimer ( function()
		removeEventHandler("onClientRender", root, thirdShow)
	end, 3000, 1 )
end

How can I make my animation smoother, also how can I clean up my code a little, looks messy.

[pa3ck]

The smoothest animation you will ever get is using interpolateBetween, what's wrong with it? Why is that not smooth enough?

[FlyingSpoon]

It looks like it kind of glitches or something, when it starts.

[3aGl3]

Perhaps your game only runs on a low FPS rate?
Other than that I'd try to get the start time the first time you calculate the progress, that might help.

 

Also proper tabs and spacing will help to make your code cleaner.

Edited June 12, 2017 by 3aGl3

[FlyingSpoon]

My FPS is 60, and and what do you mean by proper tabs and spacing? 

[Addlibs]

40 minutes ago, raysmta said:

My FPS is 60, and and what do you mean by proper tabs and spacing? 

The code is very messy, indentation isn't consistent, etc.

[Hale]

I already told you, manipulate with these:

local progress = ( ( getTickCount() - counter ) / 5000 ) -- try lowering or highering number 5000
local progress2 = ( ( getTickCount() - counter ) / 2000 ) -- try lowering or highering number 2000

 

[IIYAMA]

    function firstShow()
            local progress = ( ( getTickCount() - counter ) / 5000 )
            local progress2 = ( ( getTickCount() - counter ) / 2000 )
            :Oanim1 = interpolateBetween(1800, 0, 0, 1545, 0, 0, progress2, "Linear" )
            alpha = interpolateBetween(alpha, 0, 0, 255, 0, 0, progress, "Linear")
            dxDrawImage(:Oanim1, 35, 50, 50, ":not/img/circle.png", 0, 0, 0, tocolor(255, 255, 255, alpha), true)
            
            if progress >= 0.40 then
                    addEventHandler("onClientRender", root, secondShow)
            end
    end
    addEventHandler("onClientRender", root, firstShow)

 

Warnings and errors do have influence on the smooth fps. Even if your fps is 60 or even 100...

 

---

 

It could also be the images. If those are very large or unoptimised. (I do not know the file size, so I can't judge that)

":not/img/extend.png"

 

":not/img/circle.png"

You can optimised them with .dds files. https://en.wikipedia.org/wiki/DirectDraw_Surface

Tool to convert images in to .dds files: nightly.multitheftauto.com/files/shaders/DxTex.zip

(not recommended for very large images and must be a power of two)