Move over pixel distance over fixed amount of time

BlitzMax Forums/BlitzMax Programming/Move over pixel distance over fixed amount of time

Nennig

(Posted 2015) [#1]

Hi there,

I am looking for some help on how to code the move of a piece of text for a certain amount of pixel on the x-axis (from 800 to 0 )and a defined amount of milliseconds.

I need to have a variable for the "distance" in pixels to cover, the "amount_ of_ time" within which the move need to happen.

The distance should be travelled exactly in the time allocated and the speed of the computer should not affect this process (delta timing issues).

Anybody could help me with these few lines of code?
Many thanks for your help.


Graphics 1600,800


Global distance = 800 		'in pixels
Global amount_time = 2500   'in Millisecs

Global last_time:Int = MilliSecs()

pos = 800

While Not AppTerminate()  Or Not Confirm( "Terminate?" )
  	
	now  = MilliSecs()
	delta =now - last_time	'speed of the computer should not affect the time and distance travelled
	Cls
	
         pos = pos - ((distance / amount_time)* delta)  
         DrawText "Hi", pos, 100
	
	Flip
	
	last_time = now
	
Wend

col	(Posted 2015) [#2]

Hiya

Make the distance and amount_time variables floating point values so that the division works correctly.

Global distance# = 800 		'in pixels
Global amount_time# = 2500   'in Millisecs
....

There are many debates regarding delta timing etc. if you search this site there are hundreds of them.

Hope it helps!

Jesse

(Posted 2015) [#3]

Graphics 1600,800


Global distance:Float = 800 		'in pixels
Global amount_time:Float = 2500   'in Millisecs

Global last_time:Int = MilliSecs()

pos:Float = 800

While Not AppTerminate()  Or Not Confirm( "Terminate?" )
  	
	now:Float  = MilliSecs()
	delta:Float =now - last_time	'speed of the computer should not affect the time and distance travelled
	Cls
	
         pos = pos - ((distance / amount_time)* delta)  
         DrawText "Hi", pos, 100
	
	Flip
	
	last_time = now
	
Wend

Nennig

(Posted 2015) [#4]

Hi Dave and Jesse,

Many thanks for your help, I would have never figured this one out by myself.

The above code move the text over the correct distance and correct amount of time but the scrolling is very blocky.

Is there a way to get a smooth scrolling?

Eventually, I want to move musical notes on a staff that is why the distance and amount of time are constraints. I also want to share the end result with a friend that use a different computer (hence delta timing)

Thanks a lot for your help.

degac

(Posted 2015) [#5]

Hi
search for 'delta time' or 'tweening' in the forum.
There are several examples about smooth scrolling.

Derron

(Posted 2015) [#6]

Smoothest movement possible is: pixelsPerFrame - and this is defined by "distance/(amount_time*fps)". If you move more than 1px per frame you might run into a non-nicely-looking movement. If you use a way higher speed the eye gets lazy enough to make it "smooth" again.

@tweening:
Tweening is not useful for you if you do not split "physics" and "rendering". Tweening has to get done if your physics are done at a different interval then rendering (eg. 10times/second compared to 60rendertimes/second).

In that case your rendering has to store the "last position" and the "next position" and then use a factor to add to the last position (last position = factor * difference of next and last position). The factor is a value between 0.0 and 1.0. 1.0. If you know the interval of the "physics updates", you can calculate how many time is left until the next "physics update". So you then now: 85% of that interval is gone since last "physics update" - so your factor is 0.85.
Why do that? Because the next "physics update" will correctly move the object to the next position (refreshes "last position" etc.), it also checks for collisions with other objects etc..
If your physics updates are running more times a second than the rendering, you might not neet tweening, it might introduce jittering then (small numbers are not the best option in BlitzMax as floats like 0.05 are stored 0.0499... or 0.051... there, this might create some trouble). But as said: there are enough posts about this in the boards.

@delta
Jesses code mixes something up: Delta is somehow a "Milliseconds" number. This is of course NOT correct.

correct:
delta = (now - last_time) / 1000.0

now delta is a fraction of a second, eg. "0.5" means 500ms. Now the speed you define somewhere is in "pixels per second" instead of a "pixels per millisecond" which would lead to another too small float like 0.005px/ms - which gets rounded to 0.0048xyz or so. 4.8px/s is 4% less than 5px/s - see the difference?

bye
Ron

Nennig

(Posted 2015) [#7]

Hi Ron,

Thanks a lot for this information. Now, the text moves the correct distance for the correct amount of time but it is still doing so with blocky movements.

I found the following thread and will try to implement this solution.
I didn't expect that something as trivial to think about could be that complicated to program ;-)

Thanks all for your help.
I will share my code if I manage to do what I want.

http://www.blitzbasic.com/Community/posts.php?topic=70516#bottom