Drawing tiles in fractional coords, nasty flick

BlitzMax Forums/BlitzMax Beginners Area/Drawing tiles in fractional coords, nasty flick

Rixarn(Posted 2009) [#1]
Hi!

I'm doing a simple tile engine that draws itself nice when i scrolling using integer number, but when i use floating numbers for scrolling i get a nasty flickering while drawing.

I've searched the forums and it seems this is a know problem, but havent found a know solution. Is there any?

So far, the best workaround i have done is setting the image flag to maskedimage only, and it disables the antialias of the image... but that's the best i could do...any advice?

Thanks!


_Skully(Posted 2009) [#2]
Is there a particular reason you need fractional scrolling? why not just store the number as a float but cast it to int when drawing? Generally speaking, no-one is going to notice fractions of scroll anyway unless things move incredibly slowly


Rixarn(Posted 2009) [#3]
Hey man, thanks for asking :)

Well, the main reason is because i want the character to travel the same distance per cicle, no matter what direction he's moving. If he moves in diagonals, he moves faster!

A quick example:

Let's set the start point at 0,0 and character speed at 3, and let's assume i move my character for 1 cicle to the right..

he landed at 3,0 so, the total distance made is 3

Now ill move my character to bottomright.

Each cicle the code will check if keydown(key_blah) = true then move character to that direction. So far so good, but in the same cicle the character will move 3 pixels to the right, and 3 pixels to the bottom since both keys are pressed.

so at the end of the cicle, he lands at 3,3

the distance from 0,0 to 3,3 is as much as 40% longer than the distance to either 0,3 or 3,0

In other words, if my tile is made of 2 triangles, and you start moving from 0,0 to bottomright ,you actually move over the long line of the triangles. The character ended up moving 4.2426blah pixels while moving in diagonal vs 3 pixels while moving in straight lines ... so technically the character moves faster when moving in diagonal, as much as 40% faster.

The only way of making the character travel the same distance if he moves in diagonals is decreasing it's speed in the move logic. In the previous example, if the character is moving bottomright then the speed should be set to 1.7573blah instead of 3.

This way, landing at 1.75blah,1.75blah he's trully traveling the same distance...

If i don't use floats then i cant use that fix , that's why i cant cast :(


_Skully(Posted 2009) [#4]
Oh I get that...but why not render the map at an integer location and use that offset to place the character instead of trying to render your map at a float value?


Rixarn(Posted 2009) [#5]
Because at some point, the thing that will be "moving" it's the map and not the character (when camera is chasing the character for example) If the character "moves" in diagonal, the resulting cords for the map have to be floating values if i want to use that fix..

Or..I don't know if i understand what you´re trying to tell me, lol ...


_Skully(Posted 2009) [#6]
Lets say your "camera" is at 5.123235, 32.37

When you call to render the map just int them... 5,32 and then draw your player relative to 5,32 rather than 5.123235,32.37 since you already have a "chasing" camera it shouldn't be an issue really.


Nate the Great(Posted 2009) [#7]
I am not sure if you are farmiliare with it but the int function always comes in handy... do everything at floating values except this... in each of your drawimage img,x#,y# functions chang it to

drawimage img,int(x#),int(y#)

problem solved :)


Rixarn(Posted 2009) [#8]
Hi Nate, I'm familiar with casting variables, and that was also the solution _Skully suggested too... but i'm afraid that solution doesn't work for mi tile engine. I tried to cast the floats to int and see if that works. But the scrolling is not working quite right. As soon as i move in diagonals the thing is messed up. :( the top row of tiles are 1 pixel off from the correct location, dunno why...

BTW, so far i can't notice a big diference between FILTEREDIMAGE's and non Filtered ones when drawing them all together for the tilemap, perhaphs i'm not paying attention? if there is no easy solution i'm think i'll just leave it that way :|


ImaginaryHuman(Posted 2009) [#9]
Use doubles?

I am presuming maybe it's because floats are not quite accurate enough and maybe when you want to say 0.9 it's really saying 1.0 or whatever.


_Skully(Posted 2009) [#10]
not really seeing any code its hard to determine what might be causing that... are you drawing your map from left to right and giving it starting coordinates... and that starting coordinate is what is "off?"


Rixarn(Posted 2009) [#11]
@ImaginaryHuman haven't tried with doubles but i think i will and see what happens, thanks.

@_Skully You´re right man, without any code is hard, so...I'll post some of it, but i need to change my comments to English because they are in Spanish :) and i'm still working on the collision system. As soon as i finish that i'll post it :)


Floyd(Posted 2009) [#12]
If you are using PNGs with alpha then maybe they just need to be defringed.


Rixarn(Posted 2009) [#13]
@Floyd yes, i'm using PNGs with alpha. I'll do the defringe thing then and see how that works, then post the results back, thanks!


Rixarn(Posted 2009) [#14]
@Floyd i've used the code to defringe my png's. It looks better, but there´s still a flickering in the tiles (it's less evident now, but still there im afraid). Think I can live with the images being drawn with maskedimage flag only, because I didn't noticed a big difference removing the filteredimage flag.

@ImaginaryHuman Doubles didn't worked for me. I'm think this has to do with the way i designed the engine...

Anyways, i'm almost done with what i need the engine to do for now... I'll still post the code when i'm done in the showcase area. (I'm sure mine is at the most, Yet Another regular TileEngine :) )

Thank you all guys for your help :)