#Custom GraphNode Port Icon low quality in comparison to default

1 messages · Page 1 of 1 (latest)

modest shuttle
#

Just as the title says, I am trying to make _draw_port draw with a custom icon for certain nodes. This in of itself works, as shown in the image. However, when zooming in, the default icon (obtained via get_theme_icon("port", "GraphNode")) remains sharp, while my own icons look very blurry.
I used the original icon (found at https://github.com/godotengine/godot/blob/master/scene/theme/icons/graph_port.svg) as reference, but even when copy-pasting that into my project and using it, it still looks low-quality compared to the get_theme_icon one, so there must be more going on behind the scenes. Does anyone know the difference?

The only thing that stuck out to me was that, while the SVG file has a width and height of 10, the loaded icon has one of 12, and i don't know why.

I appreciate every bit of help!

image.png
#

For reference: Left is my copy of graph_icon.svg, and right is the one obtained from the theme
It is 1:1 the same file, so it must be something the engine does, and i dont know what :/

image.png
coral spire
#

When Godot imports an SVG file, it's only rasterized once (upon import). Meaning you can't really nicely/endless resize like you would normally be able to with an SVG.

modest shuttle
#

Yes, i know, but i am pretty sure that is not the issue here. The icon from godot is also just a texture, but is looks better when zooming in

#

Huh, i inspected the image itself (via a plugin) and it is clearly larger than 12x12

image.png
#

Counting the pixels, its 20x20

#

while the original file is 10x10

#

I am even more confused now

coral spire
#

But an SVG is a collection of vectors, so normally it could be any size... Kinda except in Godot since the one-off rasterization.

modest shuttle
#

Yes, and i am pretty sure that even this icon is one-off rasterized too

#

So this is a completely different issue altogether

#

I decided to look at the code, and i think i understand what is going on here

#

I assume that here, "scale" is 2

#

Hence why it is being upsampled by 2

#

i have no idea how it ends up displaying 12x12 tho

#

Okay, i definitely know how these files are set up now:

  • Loaded via ImageTexture.create_from_image
  • Padding of 1 pixel around the image
  • Upsampled by 2
  • Override size is set to original size + padding (in this case, 12x12)
    This means that the final image has a resolution of 24x24.
    I do must assume the padding gets added while loading the svg (somehow) as i couldnt find the code for it, but this is 100% the correct setup here, as evident by the matching memory
image.png image.png