Pixel display problem

0 favourites
  • 15 posts
From the Asset Store
Vintage steam pixels for your UI! 125 unique assets in a single pack!
  • Hi guys, wondering if anyone can help me with a graphics problem that has plagued my project for years. My pixel art seems to display with inconsistent pixel widths - sprites with animation seem to have pixels that change thickness constantly. All of the lines in this image are supposed to be 1 pixel width, but some of them are thick and some are thin:

    I suspect it's something to do with sub-pixels but pixel rounding and Point sampling are on in my project and everything is positioned at integer coordinates. So, um... I'm stuck! Anyone fixed this issue before?

    Thanks

  • Is it a sprite or tilemap object? Are you scaling it at all? Is the image size in the editor the same as the size in the layout?

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • It's all sprites, all 1:1 size. Although, actually, come to think of it, my layout scale is set to like 1.8 or something in the events if I remember. Would that be the culprit? I like the size that things display in the output, is there a workaround that would allow me to retain that scale but display pixels properly?

  • The first thing I would do is disable the layout scaling and run the game to see if it fixes it or not and then you can go from there.

  • Are you cropping your sprite images in the editor?

    It looks like what happens when I forget to crop an image and it will leave odd spaces around sprites if you do that.

  • Right, I tried setting the layout scale back to 1, and things have improved, but some pixels are still displaying all fruity. Look:

    The differences are subtle, but the bricks in the background are missing lines, and part of the windowsill has disappeared.

    All images are cropped.

  • *Do you use effects on the sprites?

    *Maybe if you want to scale and keep the pixelated look - you should try the "Letterbox integer scale".

  • There is a tint layer with Overlay fx, otherwise no fx (and the problem occurs without it). I have tried every fullscreen scaling setting

  • Can you try without both fx, both of those fx have "lowp sampler2D samplerFront", and low precision (lowp) can be not so accurate.

  • Again, the problem still occurs whilst using no effects. :/

  • It is the horizontal lines that are disappearing. I had that happen in a game and if I remember correctly I fixed it by having the editor image at original size and then setting the image to the size I want in the settings and you may have to play with those settings to maintain the proper ratio.

    Also recheck your image points have not slipped out of line and if there is any white or light gray borders around images crop them off as that throws off the alignment for some reason and run it in letterbox integer scale.

    Oh and check your layout and view scale. They need to be in even increments of 16 pixels like 640x640 otherwise the raster will miss pixels and that would explain why the horizontal lines are missing.

    Best of luck because I remember fighting images that did that!

  • It is the horizontal lines that are disappearing. I had that happen in a game and if I remember correctly I fixed it by having the editor image at original size and then setting the image to the size I want in the settings and you may have to play with those settings to maintain the proper ratio.

    This sounds promising, could you elaborate? I'm not completely following you. The settings for the sprite object? Everything is currently in the layout editor at 1:1 scale, with the entire layout enlarged by 1.8 scale in events. What do I change, without rebuilding my entire game?

    Also recheck your image points have not slipped out of line and if there is any white or light gray borders around images crop them off as that throws off the alignment for some reason and run it in letterbox integer scale.

    My image points are okay and this occurs with tiled background objects too (ie the bricks in my example image) where the image point defaults to the top-left.

    Oh and check your layout and view scale. They need to be in even increments of 16 pixels like 640x640 otherwise the raster will miss pixels and that would explain why the horizontal lines are missing.

    My game's native resolution is 1280x720 so that shouldn't cause any problems, although it looks weird both in window and fullscreen. How would one set the view scale to something divisible by 16?

    Thank you for your detailed reply, it's encouraging to know somebody has fixed this problem, although I haven't found the fix I need yet

  • > It is the horizontal lines that are disappearing. I had that happen in a game and if I remember correctly I fixed it by having the editor image at original size and then setting the image to the size I want in the settings and you may have to play with those settings to maintain the proper ratio.

    >

    This sounds promising, could you elaborate? I'm not completely following you. The settings for the sprite object? Everything is currently in the layout editor at 1:1 scale, with the entire layout enlarged by 1.8 scale in events. What do I change, without rebuilding my entire game?

    > Also recheck your image points have not slipped out of line and if there is any white or light gray borders around images crop them off as that throws off the alignment for some reason and run it in letterbox integer scale.

    >

    My image points are okay and this occurs with tiled background objects too (ie the bricks in my example image) where the image point defaults to the top-left.

    > Oh and check your layout and view scale. They need to be in even increments of 16 pixels like 640x640 otherwise the raster will miss pixels and that would explain why the horizontal lines are missing.

    >

    My game's native resolution is 1280x720 so that shouldn't cause any problems, although it looks weird both in window and fullscreen. How would one set the view scale to something divisible by 16?

    Thank you for your detailed reply, it's encouraging to know somebody has fixed this problem, although I haven't found the fix I need yet

    There in lays the problem. If you have a bunch of graphics set 1:1 and they are all dropping horizontal pixels it would be a major chore to rework each one.

    The scaling will need to be 1:1 or it will continue to happen.

    You could select all the objects and use the scale control to scale them down and see if that fixes it.

    If you set your window and view to an odd number not divisible by 16 or 8 it will throw off the raster making it drop pixels in some games with very fine detail. It sounds like you would be OK but fiddle with it and see if it helps.

    I am using scaling in my project now and I found it better to use whole integers so try a scale of 2 instead of 1.8 and see if that works.

  • Aha! Progress!!

    Turns out I had two problems going on that were independently causing graphics bugs. I'd already tried setting the scale to an integer of 2 but had noticed there was still some weirdness in my tiled backgrounds so assumed that that wasn't the solution. Turns out that it was the way to go, and that I'd stupidly also made some of my tiled backgrounds at weird sizes, so they weren't tiling properly! Some of these graphics I made years ago when I was learning C2 and I guess I made them wrong - that brick texture was like 31x35 or something?? Wtf was I thinking? I remade it to be 32x32 and guess what, it displays properly now -_-

    Thank you for your help! I guess I'm going to have to adapt my game to the 2-scale now - it shouldn't be too drastic of a change, just a few levels need to be reworked but that's ok

    EDIT: Oh, and switching to Integer Scale mode was essential.

  • Aha! Progress!!

    Turns out I had two problems going on that were independently causing graphics bugs

    Right on and looks great!

    I have done that enough times to know the frustration. Now I set all my tiles and sprites and check the scale before I get too far into a design.

    Looking forward to seeing the finished game!

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)