Displaying tileset (or scrolling) shows grid-lines (SOLVED)

[stephenkalisch]

Hey there.

I have a little problem. I have a tileset as background with 2 layers.
The player is a GameObject. If the Player is moving the camera is moving too (both are in a collection).
Have to say that this “problem” also is present if I just move the player (camera fix and “untouched”)

If i move the player (and cam) there are visible gridlines. More and less while moving. These lines are not in the original graphics.
How to prevent this?

Moving-part:

    -- set posi
    self.pos = go.get_position()
    local newpos = self.pos + self.paul.movedirection * self.paul.movespeed * dt
    go.set_position(newpos)
    go.set_position(vmath.vector3(self.pos.x - GLOBAL.SCREEN_WIDTH/2, self.pos.y - GLOBAL.SCREEN_HEIGHT/2, 0), "camera")

Here are some screens:

One moment there are (nearly) no grids:

next “pixel” / movement:

Thats the tileset-graphic:

Any ideas?

[Mattias_Hedberg]

Have you tried fiddling with the tilesource file? For example adding a bit of extrude borders.

[stephenkalisch]

No. What to do with it?

I have another project with a tileset I am scrolling - there are no problems, these tileset is set via script.

This tileset here I’ve set manually and designed the level.

[stephenkalisch]

another thing…

The collider defined in the editor for the tileset is not fitting if game runs

Editor:

Drawn tileset in editor:

[Pkeod]

These kinds of issues show up more obviously in different situations. It is the color in the adjacent tile which is bleeding through because of the way the texture atlas works. In other games, it could be resolution, or similarity of color of other tiles which makes it less obvious.

If you add extrusion in your tilesource (set Extrude Borders to 2) like Mattias says it should solve it. It copies a little bit of the edge outward for the tiles so that its own color bleeds in instead of other tiles when it happens.

[Pkeod]

Could you try to make a small reproducible project with the collision object/ tile issue?

[stephenkalisch]

It helped!

Extrude Boder = 2 solved it for the grid-lines. Dont understand that really but nice to see it works

Why the collision isnt fitting to the tileset… dont know.

[stephenkalisch]

Worked also with Extrude-Border = 1.

May someone of the “defold-brains” may explain me that?

[sicher]

Sure. When the game renders a tile it samples from the texture. When it samples and draws at the very edge of a sprite or a tile, you run the risk of getting some information from outside the tile.

In this case the sprite or tile may get a touch of green on the left and a touch of red on the right. This has to do with the fact that the renderer does not measure whole pixels normally, but could measure anywhere on the image. If it samples right between two pixels, the resulting color is a 50-50 mix.

The solution is to extrude the border of each image on the texture atlas. All around the green image, green pixels are added, around mario, white is added and around the red image red pixels are added.

The number of pixels to add depends on how the image is going to be used. If you don’t scale the image 1 pixel is enough since the renderer won’t ever sample that far outside.

[stephenkalisch]

Thanks @sicher. Nice and clear to understand

[stephenkalisch]

Offtopic but maybe a comparable issue…

I have a gui.node.box with a graphic (a texture of the player-sprite). I scale it up to 10. (The original player is just 32px). In the editor the upscaled player looks very nice with fat pixels (nice old-school). In the game its been “aliased” and smoothed which looks terrible. I’ve already played a bit with the properties of the box, but dont get a nicer result.

Got a tip?

(maybe open new threads for this questions for easier finding ?)

• The left one looks like I am drunken

A screenshot (left game-window, right editor :):

[Mattias_Hedberg]

@Pkeod explains this in the “Big List Of Defold Tips”, post which is still brilliant. Big List of Defold Pro Tips!

[stephenkalisch]

oh nice. know that list. have to take a look at, thanks @Mattias_Hedberg

[stephenkalisch]

With this SIMPLE change in the game.project the “blurry” guy right top are now sharp like hell

Big List of Defold Pro Tips!

While you’re there change your graphic sampling so that they are set to nearest

Simply change at the GUI section from “linear” to “nearest”

Now:

[stephenkalisch]

At last…

Does anyone has a clue why the collider isnt fit to the tileset???

Screenshot with physic-debug:

For the player its ok, but for the tileset? its shiftet to the right for some pixels

[Pkeod]

Can you make a stripped down version of the project where it happens so you can share? Or a smaller example project where the problem is reproducible?

[sven]

Does the tilemap component have any position/offset (compared to the collisionobject component which don’t have any position property)? Like this:

[stephenkalisch]

hey guys.

Thanks for your answers. Will check that today evening when I am at home/Office.
Maybe Position? Not sure. Didn’t that conscious.

If thats not the solution maybe I can crop that Project. But…its a small one

[stephenkalisch]

hell shame on me

Thats really embarressing for me…
I quess sometimes ist simply too late or too easy to work on Projects

It was simply some coordinates at the GO / tilemap (9x2 shifted)… man man man… Stupid Little mistakes makes big headaches sometimes.

I’ve seached at the graphics, tilemap Content, Code etc… but never thought something simple

Sorry for you time and thanks for you help (again)

thread SOLVED SOLVED SOLVED now

[ryanscottlandry]

@stephenkalisch might seem like a silly problem, but these types of posts are very helpful to folks like me just starting out. I’ve run into the exact same issue when i was starting with defold (even worse is z position. If GO is z=1, and sprite is z=1, the sprite looks fine in editor but does not render in game. You have no idea how long it took me to find THAT problem…). As someone who reads basically every forum post on here, I’ve learned as much from other peoples’ mistakes as i have from the official defold manuals.

TLDR; no question is a stupid question