godotengine / godot

Godot Engine – Multi-platform 2D and 3D game engine
https://godotengine.org
MIT License
89.1k stars 20.2k forks source link

Texture2D "convert_colors_with_editor_theme" import flag seems to do nothing #67929

Open SleepyTonia opened 1 year ago

SleepyTonia commented 1 year ago

Godot version

4.0 beta 3

System information

Linux Manjaro 6.0.3 (KDE Plasma 5.26.1 X11), AMD Ryzen 2500U, Radeon Vega 8

Issue description

I'm working on an editor plugin which adds various controls and types, all with their own svg icons. I follow the same color palette used by Godot's own icons and have turned on the scale_with_editor_scale and convert_colors_with_editor_theme flags from this merged pull request before re-importing all those icons. While the icons do scale up properly when I change the editor's scale (200% looks hilarious on my 1080p monitors) the colors don't change as they should when I switch between light and dark modes, whether the icon is given to an editor button, added in a class description with [img] or used as a class icon with @icon. Even when restarting the editor either with a dark or light icon theme. I've also tried borrowing Dialogic's own icon to see if I was doing something wrong on that end and it didn't work either.

Steps to reproduce

Create a project and give it plugin buttons or classes with a properly imported (With convert_colors_with_editor_theme set to true) svg icon following the proper color palette, then alternate between dark and light modes. The attached reproduction project has just that.

Minimal reproduction project

Icons_64938.zip

YuriSizov commented 1 year ago

The most likely culprit is the format in which the colors are stored. The system for color replacement in SVGs in the Godot editor is very rudimentary and doesn't work with arbitrary SVGs. It looks specifically for attributes, expressed like this:

    if (p_color_map.size()) {
        _replace_color_property(p_color_map, "stop-color=\"", p_string);
        _replace_color_property(p_color_map, "fill=\"", p_string);
        _replace_color_property(p_color_map, "stroke=\"", p_string);
    }

It seems your icons have colors inside of the style attribute instead, using CSS format. This is not supported at the moment.

This is something that we would need to improve upon in future, and something that we want to document, alongside our color map itself, in the meantime. But for the time being you need to save your icons the same way you'd save them if you were contributing them to the project itself.

SleepyTonia commented 1 year ago

Following the documentation I found there: https://docs.godotengine.org/en/latest/development/editor/creating_icons.html I shrank down one of my SVG icons to this: (With added line breaks for readability)

<svg height="16" viewBox="0 0 4.2333332 4.2333335" width="16" xmlns="http://www.w3.org/2000/svg">
<path d="m3 0c-.5539988 0-1 .44600109-1 1v13c0 .554.4460012 1 1 1h5.0000001 4.9999999c.553999 0 1-.446001 1-1v-4.9999999-8.0000001c0-.55399891-.446-1-1-1zm0 1h10v1h-10zm0 2h10v1.0000001h-10zm0 2.0000001h10v1h-10zm0 2h10v1h-10zm0 2h5.0000001 1.9999999 1 2v.9999999h-4.9999999-5.0000001zm0 1.9999999h5.0000001 4.9999999v1h-4.9999999-5.0000001zm0 2h5.0000001 4.9999999v1h-4.9999999-5.0000001z" fill="#e0e0e0" fill-rule="evenodd" stroke-dashoffset="4.2" stroke-linecap="square" stroke-width="2.5" transform="scale(.26458333)"/>
<path d="m2.38125 2.116667h1.058333v.79375h-1.058333z" fill="none"/>
</svg>

And even when I re-import with the flag set to off, then back to on, then reload the editor (Godot 4.0 Beta 5 as of now) nothing changes. I understand the expected constraints and I'm more than happy to work with those! No big deal when it's for a niche purpose such as this. I just still seem to be getting something wrong…

scriptsengineer commented 1 year ago

image image It worked for me when choosing this option in inkscape (Save as optimized svg)

scriptsengineer commented 1 year ago

Still investigating that some icons which have additional colors like my icon contains (+) symbol (5fff97) color did not convert even though the same editor icon did convert. image

andrejp88 commented 1 year ago

I'm seeing the same thing, but scaling is affected too. Oddly enough, both scale and color conversion is applied in the icon's thumbnail in the FileSystem dialog, but not in the SceneTree or in the list of nodes when adding a new node. I had to run the icons through svgcleaner to even get to this point though. Before that they didn't even show up right in the FileSystem dock.

I also notice that the editor's current scale and color theme are stored in those icons' corresponding .import files. That sort of stuff is going to vary between installations, but to my understanding `.import files are supposed to be committed to version control, so it seems like the sort of thing that would cause some annoyance when committing files.

(at first I accidentally commented this on the merge request linked in the OP, like the fool I am. Whoops 😛 sorry if I annoyed anyone!)

YuriSizov commented 1 year ago

I also notice that the editor's current scale and color theme are stored in those icons' corresponding .import files. That sort of stuff is going to vary between installations, but to my understanding `.import files are supposed to be committed to version control, so it seems like the sort of thing that would cause some annoyance when committing files.

This oversight has been reported already, there is a PR: https://github.com/godotengine/godot/pull/75949

Oddly enough, both scale and color conversion is applied in the icon's thumbnail in the FileSystem dialog, but not in the SceneTree or in the list of nodes when adding a new node.

Both tweaks are applied upon the import, not upon usage. Everything uses the same texture, so you shouldn't see any differences. Unless you change something, then you might need to manually hit the Reimport button or restart the editor. There are also some issues with the editor support of icons for custom types, but it should be fixed in 4.1: https://github.com/godotengine/godot/pull/75472

andrejp88 commented 1 year ago

it should be fixed in 4.1

I just compiled Godot on the master branch and tried it out, and can confirm that I'm not seeing the problem anymore. All custom class icons work perfectly, colors and scaling are adjusted flawlessly.

It's such a nice feeling when you learn a bug was fixed before you even get the chance to notice it, and when the project's development is transparent enough for that to happen :) Thanks for the great work and for the quick response!

SleepyTonia commented 1 year ago

I just compiled the current master and it's still present in my case for the most part… The icons for my addon now do change colors with the editor theme as expected, but only in the filesystem dock and svg preview in the inspector. Not in the editor's interface. Re-importing from the editor or restarting the editor didn't help either…

The color change also only happens when the svg file has been modified and re-loaded by the editor. Going in the Import dock to try and force the editor to re-import the image does nothing.

In light text/icon mode: image And in dark mode: image

However any other changes, the most important ones, don't seem to happen properly. image image image