[SOLVED] Canvas asset distortion when scaling

even though I keep the aspect ratio, when I scale the asset to the window (scale up or down), image quality deteriorates in the html. how can I solve this problem? I’m using “global canvas scale” node right now.

1 Like

Hi, could you please share a simple test file. I think zip files are not allowed here, so preferably share a link to some online drive that has the project files.

Also, what platform are you targeting? Browser or desktop? And what OS?

2 Likes

Thanks for answer.

This is my files: https://file.io/6sp8p7j6li1n

This is my screen capture:

dist

please try with 1x scale and 0.75x scale you will understand me.

“Browser or desktop? And what OS?”

Browser, Windows, any browser.

how can I fix this?

thanks

Hi, this seems to be an aliasing effect. This also happens in the armory2d editor, when you scale the images. I am not sure if armory2D or zui has any anti aliasing or interpolation techniques, but I think not. So, if anyone has more ideas on this, would be great to hear :slightly_smiling_face:

1 Like

Kha does have an ImageScaleQuality enum which defaults to the low setting I think. A quick search on the armory3d repos shows that apparently it isn’t set for canvases…

@deathproof Unfortunately the link to your project files doesn’t work anymore, can you please replace <armory-sdk>/armory/Sources/armory/ui/Canvas.hx in your Armory SDK with the attached file, clean the exported game (there is a “Clean” button next to the “Play” button in the Blender properties panel) and try whether the new file fixes your scaling issues?

Canvas.hx (17.4 KB)

3 Likes

Hi, here is the re-uploaded test file:
(Will be removed after 24 hrs of posting)

2 Likes

Thanks, setting another image scaling quality indeed seems to fixes the issue for me. The 0.25x scaling still looks a bit pixelated though.

Now there is the question whether we should automatically default to the high quality or expose this as a user setting. @QuantumCoderQC what do you think about this? In case of the latter it might even be possible to make this a per-image setting, I sadly don’t know whether every image has a g2 attribute to which we can apply the quality… I can ask Rob though

I guess in most cases a global setting should be enough…

2 Likes

Nice!
Can confirm.

I would prefer exposing it as a global option.

2 Likes

Canvas.hx file is works (after update plugin) thanks guys. it’s working good 1x to 0.6x :slight_smile:

2 Likes

The canvas image scaling quality will be configurable in the Blender UI once Allow to configure canvas image scaling quality from Blender UI by MoritzBrueckner · Pull Request #2900 · armory3d/armory · GitHub is merged (hopefully before the next SDK release), thanks for your patience :+1:

2 Likes