Allegro.cc - Online Community

Allegro.cc Forums » Programming Questions » [A5] Flickering with tile map...

This thread is locked; no one can reply to it. rss feed Print
[A5] Flickering with tile map...
Baryon
Member #15,609
May 2014

Hello,
I am getting some flickering/shimmering effect on a tile map, mostly around the joins between the tiles, but only sometimes (depending on the player's position on the map and direction of movement). It is only noticeable when the map is zoomed out using a scale transformation. I originally thought it was because I was using floats instead of ints, but I have since changed them all to ints and there is no noticeable difference.

I think there may be some problem with the code I am using to draw the tile map. The idea is to calculate exactly which tiles are visible on the screen at each point in time and use al_draw_bitmap_region to draw only the visible bits of the visible tiles. The map wraps around on the x-axis.

Maybe you can see a problem? Or tell me that there is a better way to do this? Thanks :)

#SelectExpand
1void draw_row(int width_left, int t, int ix, int iy, int startw, int rowh, int posy) { 2 int thisw = startw; 3 int posx = 0; 4 while (width_left > 0) { 5 al_draw_bitmap_region(tiles[t], ix, iy, thisw, rowh, posx, posy, 0); 6 width_left -= thisw; 7 posx += thisw; 8 t++; 9 if (t % tilesx == 0) t -= tilesx; /* wrap around */ 10 ix = 0; 11 if (width_left > tilesize) thisw = tilesize; 12 else thisw = width_left; 13 } 14} 15 16/* draw visible tiles with the viewpoint co-ordinates sx,sy. Called for redrawing at 60fps */ 17void draw_tiles(int sx, int sy, int w, int h) { 18 int posy = 0; 19 int height_left = h; 20 21 int to = sy/tilesize*tilesx + sx/tilesize; 22 int tsx = sx % tilesize; 23 int tsy = sy % tilesize; 24 25 int startw = tilesize - tsx; 26 int rowh = tilesize - tsy; 27 int t = to; 28 while (height_left > 0) { 29 draw_row(w, t, tsx, tsy, startw, rowh, posy); 30 height_left -= rowh; 31 posy += rowh; 32 if (height_left > tilesize) rowh = tilesize; 33 else rowh = height_left; 34 tsy = 0; 35 t = t + tilesx; 36 if (t >= (tilesx*tilesy)) break; 37 } 38} 39 40... 41 42 w = al_get_display_width(display); 43 h = al_get_display_height(display); 44 w = w/zoom; h = h/zoom; 45 46 sx = pcx - w/2; /* pcx,pcy is player's position */ 47 sy = pcy - h/2; 48 if (sx < 0) sx = mapw + (sx % mapw); 49 if (sy < 0) { 50 sy = 0; 51 } else if (pcy+h/2 > maph) { 52 sy = maph-h; 53 } 54 55 al_identity_transform(&transform); 56 al_scale_transform(&transform,zoom,zoom); 57 al_use_transform(&transform); 58 59 draw_tiles(sx, sy, w, h);

I am a bit of a newbie... I admit it.

Eric Johnson
Member #14,841
January 2013
avatar

Hi there. I've had similar issues in the past, but they were always related to floating point values. Nothing about your code pops out at me. Are you sure you've replaced all floats to ints? What is your player's movement speed, and what is zoom set to?

Baryon said:

depending on the player's position on the map and direction of movement

Do you notice a common trait when this happens? Does it always, for example, happen when the player is moving right, or on tile 52? When exactly does this happen? Also, by "flickering/shimmering" between tiles, do you mean that the clear_to_color is seen between tiles?

Sort of like this? This happened to me when my camera pan speed was 0.5; it resulted in half-pixel misplacement.
{"name":"ef0ebffbd1a685f8ea20e16c27b20319.png","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/e\/f\/ef0ebffbd1a685f8ea20e16c27b20319.png","w":482,"h":509,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/e\/f\/ef0ebffbd1a685f8ea20e16c27b20319"}ef0ebffbd1a685f8ea20e16c27b20319.png

--
EricII on #allegro.
My Games
Momo (my JS game-making library)

Baryon
Member #15,609
May 2014

Thanks for your reply! I have now managed to get a much better result, and eliminate the flickering, by enabling linear filtering. (In other words: al_set_new_bitmap_flags(ALLEGRO_MIN_LINEAR); )

It was a kind of rippling effect, where the rippling went in the direction of travel. When the zoom level was around 0.5 it reduced to a flickering effect but only when the viewport was moving vertically.

Like I say, linear filtering seems to have done the trick.

Eric Johnson
Member #14,841
January 2013
avatar

You are welcome. I am glad to hear you got it all sorted out. :)

--
EricII on #allegro.
My Games
Momo (my JS game-making library)

Go to: