Editor Icons¶
Wenn eine neue Klasse erstellt und Skripten bereitgestellt wird, wird sie auf der Benutzeroberfläche des Editors mit einem Standardsymbol angezeigt, das die Basisklasse darstellt von der sie erbt. In den meisten Fällen wird weiterhin empfohlen, Symbole für neue Klassen zu erstellen, um die Benutzererfahrung zu verbessern.
Icons erstellen¶
Um neue Symbole zu erstellen, muss zunächst ein Vektorgrafik-Editor installiert sein. Zum Beispiel können Sie den Open-Source Editor Inkscape verwenden.
Klonen Sie das godot
Repository mit allen Editor-Symbolen:
git clone https://github.com/godotengine/godot.git
Die Symbole müssen in einem Vektorgrafik-Editor im SVG-Format erstellt werden. Es sind zwei Hauptanforderungen zu beachten:
- Symbole müssen 16×16 sein. In Inkscape können Sie die Dokumentgröße unter Datei -> Dokumenteigenschaften konfigurieren.
- Linien sollten nach Möglichkeit auf Pixel ausgerichtet werden, um bei niedrigeren DPI-Werten scharf zu bleiben. Um dies zu vereinfachen, können Sie in Inkscape ein 16×16-Raster erstellen.
Once you're satisfied with the icon's design, save the icon in the cloned
repository's editor/icons
folder. The icon name should match the intended
name in a case-sensitive manner. For example, to create an icon for
CPUParticles2D, name the file CPUParticles2D.svg
.
Farbkonvertierung für Lichteditor-Themen¶
If the user has configured their editor to use a light theme, Godot will convert the icon's colors based on a set of predefined color mappings. This is to ensure the icon always displays with a sufficient contrast rate. Try to restrict your icon's color palette to colors found in the list above. Otherwise, your icon may become difficult to read on a light background.
Icon optimieren¶
Because the editor renders SVGs once at load time, they need to be small in size so they can be efficiently parsed. Editor icons must be first optimized before being added to the engine, to do so:
Install svgcleaner by downloading a binary from its Releases tab and placing it into a location in your
PATH
environment variable.Run the command below, replacing
svg_source.svg
with the path to your SVG file (which can be a relative or absolute path):svgcleaner --multipass svg_source.svg svg_optimized.svg
The --multipass
switch improves compression, so make sure to include it.
The optimized icon will be saved to svg_optimized.svg
. You can also change
the destination parameter to any relative or absolute path you'd like.
Bemerkung
While this optimization step won't impact the icon's quality noticeably, it will still remove editor-only information such as guides. Therefore, it's recommended to keep the source SVG around if you need to make further changes.
Einfügen und teilen von Icons¶
If you're contributing to the engine itself, you should make a pull request to
add optimized icons to editor/icons
in the main repository. Recompile the
engine to make it pick up new icons for classes.
It's also possible to create custom icons within a module. If you're creating your own module and don't plan to integrate it with Godot, you don't need to make a separate pull request for your icons to be available within the editor as they can be self-contained.
For specific instructions on how to create module icons, refer to Creating custom module icons.
Fehlerbeseitigung¶
If icons don't appear in the editor, make sure that:
- Each icon's filename matches the naming requirement as described previously.
modules/svg
is enabled (it should be enabled by default). Without it, icons won't appear in the editor at all.