Pixel art looks messy when on exact integer position

Godot Version

v4.2.stable.official [46dc27791]

Question

When I place a 3x3 pixel art object (a tower) on or near an exact integer position on either the x or the y axis, it gets messy and looks nothing like it should. I’m really not sure how else to describe it so here’s some pictures.

The tower should look like this, and does whenever it is placed not on an integer position
6862-B3

If I travel directly along the x or y axis from where the player character (the vehicle) starts, and place a tower it looks like this
6862-B2
or this
6862-B4
Both of these are on exactly 120 on either the x or y axis

This is the code that determines the position of the tower when it is placed.

func _ready():
	position = $/root/Main/Vehicle.position

If I make it always place on an integer position by using int(round(position.x)) and int(round(position.y)) then it always appears like one of the previous images as opposed to only sometimes.

The problem goes away completely if I just do this

func _ready():
	position.x = int(round($/root/Main/Vehicle.position.x)) + 0.1
	position.y = int(round($/root/Main/Vehicle.position.y)) + 0.1

But that’s ridiculous and I’d quite like a better way of fixing it.

Here’s the settings that I could imagine are related to this problem:

  • Viewport is set to 240 x 240
  • Stretch mode is viewport
  • Stretch aspect is keep
  • Stretch scale is 1
  • Scale mode is integer

It’s not a project-ruining problem by any means but I am absolutely baffled by it. Maybe it’s just because I’m quite new to this and I’m missing something simple. Any ideas, solutions would be lovely. I’m also happy to provide more information if I missed something relevant. Thank you!

It can be intended depending on your settings but you can look at here about an explanation :

Hi, thanks for replying.

As far as I can tell, that link isn’t really related to what I’m asking? The tower image in on an AnimatedSprite2D node (I just haven’t added animations yet). Could you tell me what I’m missing here? Or at the very least which settings affect sprites in this way?

Thanks again

There is another post in the forums about this. I’ll have a search.

Here:

hth

AnimatedSprite2D has a property called centered. If centered is true and the texture height/width is odd, the image will be offset by n + 0.5 pixels, and the pixels won’t line up with the canvas. The easiest solution is probably to set centered to false and use whole numbers for the offset.