Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

2D Multiple Sprite - Not Perfect Grid Slice

Discussion in '2D' started by paolo_lionhg, Jan 30, 2015.

  1. paolo_lionhg

    paolo_lionhg

    Joined:
    Sep 5, 2013
    Posts:
    17
    Hello humans. Please forgive my English. I have a simple problem with my art work that I need some assistance with. For my images, I am using GIMP as my raster graphics editor. Then I export the image to png and use that in Unity.

    I have set the grid on GIMP to be 64x64 because in Unity I want to slice the atlas of the sprite using grid which would also have a size of 64x64. I was assuming at first that the slices would fit in perfectly in the 64x64 grid, but I was wrong, hence my problem.

    Please refer to the image below.

    As you can see, when I placed the sprites filled up with black and white in the scene, the pixels on their edges are getting some pixels from their neighbor sprites. For the white sprite, it may be hard to see. But for the black sprite, I have set its color to red and you can clearly see a thin red line on it's upper and left edge. That thin line is very visible in the game, specially when I'm using my other sprites.

    One possible solution for me is to simply have a 1 pixel space around the sprites. But that may introduce new problems when I try to connect "land" sprites, since I think it's possible there would be a 1 pixel gap between them. The game is still a prototype and it's no problem for me to adjust.

    I'm not sure where is the problem. Is the pixel units on gimp not the same with unity? Is my export settings wrong on gimp? Is my image format in unity wrong?

    Any ideas?

    ------------------------------------

    The main png info:
    Texture Type: Sprite (2D and UI)
    Sprite Mode: Multiple
    Packing Tag:
    Pixels Per Unit: 100
    Generate Mip Maps: No
    Filter Mode: Bilinear
    Max Size: 2048
    Format: Truecolor

    -------------------------------------

    Gimp Export settings:
    Export as: PNG
    Interlacing: No
    Save background color: Yes
    Save gamma: No
    Save layer offset: No
    Save resolution: Yes
    Save creation time: Yes
    Save comment: Yes
    Save color values from transparent pixels: Yes
    Compression level: 9

    problem.png
     
  2. Raiden-Freeman

    Raiden-Freeman

    Joined:
    May 7, 2013
    Posts:
    15
    You should certainly add at least 1 pixel between sprites*. When you go to the Sprite Editor's slicer, you can set it to grid mode, and specify the extra pixels that you have added in the "Padding" field.

    The reason for which you're getting this result, is probably because of your import settings. You are using bilinear filtering, instead of point. If you want every pixel to be exactly the same as in the .png, use point. Bilinear/trilinear filtering smooths the images, like antialiasing does. Point makes everything more pixely though (not desired for high fidelity games usually, but great for retro games).

    P.S. You can probably use the GIMP file itself, Unity will import it on its own, no need to export it to png. (at least it works for Photoshop)



    *you do not NEED to, but I have found it helpful most of the time, for example, the slicer itself automatically recognizes better the sprites.
     
  3. tarabout

    tarabout

    Joined:
    Jan 23, 2016
    Posts:
    11
    I'm seeing the same issue and I'm using photoshop. I think the problem comes from the sprite editor. Did you find a solution Paolo?

    Using point does not help. There is still a subpixel of the color of the next pixel in the sprite sheet. Even with a transparent pixel next to it it causes issues in places by having an empty subpixel space in between two tiles. Only way to avoid it I have found is to not use the sprite editor at all and importing each tile separately.
     
  4. Leo-Yaik

    Leo-Yaik

    Unity Technologies

    Joined:
    Aug 13, 2014
    Posts:
    435
    Hi

    Beside setting it to point filtering, you will probably need to disable anti-aliasing under Quality Settings (Edit->Project Settings->Quality)

    Cheers
     
  5. JRWidley

    JRWidley

    Joined:
    Nov 22, 2016
    Posts:
    18
    I had a similar problem while trying to rebuild the Roguelike 2D sample project/lesson from scratch, and this seemed to fix my issue. Thks!
     
  6. Untrustedlife

    Untrustedlife

    Joined:
    Apr 21, 2020
    Posts:
    78
    Sorry for bumping this but this did NOT fix it for me. I'ts grabbing an extra pixel even though my ppu is 16 and the grid is 16x16 grid sizes. Is there really no way to not have that extra pixel without manually adding padding my my sprite sheet?


    This is using the pixel perfect camera, these weird artifacts do not show up when not using the pixel perfect camera but in that case it has other weirdness (wobbly tilemap)

    Also, i confirmed that these extra pixels are in fact from the adjacent tile in the tilemap sprite. Also i am not compressing it and using point and everything, so this should be working. Also, its only happening for some of the tiles. In this case i have two different custom ruletile tiles for water and the darker one works while the lighter one has the weird pixel issue (even though they should be completely identical except one has slightly darker water)..
     
    Last edited: Jun 3, 2020
  7. Neomedus

    Neomedus

    Joined:
    May 14, 2020
    Posts:
    47
    Maybe try tweaking all of your pixel perfect camera settings? It seems like there shouldn't be a problem other than that if you've followed all of the previous input.
     
  8. Untrustedlife

    Untrustedlife

    Joined:
    Apr 21, 2020
    Posts:
    78
    How though, i have a 16 x 9 resolution, ppu is 16, so on theres no other settings to tweak Pixel snapping is gross, and having it upscale makes using pixel perfect pointless. I looked into it more and it turns out unity tile maps have always had this issue apparently they "bleed" and the only way to actually fix it would be to completely change my tilemap sprite to add 1 pixel of padding. Which is very unfortunate. https://answers.unity.com/questions/609736/gaps-sometimes-appearing-between-2d-sprites.html ahh well.
     
  9. Untrustedlife

    Untrustedlife

    Joined:
    Apr 21, 2020
    Posts:
    78
    I "fixed" it by just making my grid scale 1.001 instead 1, and that removed it.

    But its a very gross solution. heh


    For future folks, apparently if you add your tile set to a sprite atlas it also supposedly adds padding automatically, so that is another potential solution (which i haven't tried yet, but i will tomorrow or this weekend) but making the scale 1.001 doesn't viably stretch the sprite and looks alright.
     

    Attached Files:

    Last edited: Jun 3, 2020
    Neomedus likes this.
  10. Leo-Yaik

    Leo-Yaik

    Unity Technologies

    Joined:
    Aug 13, 2014
    Posts:
    435
    @Untrustedlife If you could share with us a sample, we would like to take a look and see if there is anything we can make it better
    @yuanxing_cai if you might be interested to take a look at the issue
     
  11. Untrustedlife

    Untrustedlife

    Joined:
    Apr 21, 2020
    Posts:
    78
    I just ended up using a sprite atlas. Thanks though!
    For future folks, using a sprite atlas fixed it, so just pack your sprites into a sprite atlas object
     
  12. SimonGylver

    SimonGylver

    Joined:
    Mar 15, 2022
    Posts:
    2
    This thread is two years old now, but the problem still persists. It only happens during runtime (and disappears if the game is paused in the editor), and, more importantly: It only happens on certain Orthographic camera sizes. Here are some screen-shots, two screenshots of the game with different camera sizes (one where the glitch appears and one where it displays as intended), and three shots from the editor preview, to show that it's not simply a mis-slice from my part. Screenshot 2022-03-20 140357.png Screenshot 2022-03-20 140327.png Screenshot 2022-03-20 140241.png Screenshot 2022-03-20 140139.png Screenshot 2022-03-20 135926.png