Iconos del editor¶
Cuando se crea una nueva clase y se expone a los scripts, la interfaz del editor la mostrará con un ícono predeterminado que representa la clase base de la cual hereda. En la mayoría de los casos, se recomienda crear íconos para las nuevas clases para mejorar la experiencia del usuario.
Creando iconos¶
Para crear nuevos íconos, primero necesitas tener instalado un editor de gráficos vectoriales. Por ejemplo, puedes utilizar el editor de código abierto Inkscape.
Clona el repositorio godot
que contiene todos los íconos del editor:
git clone https://github.com/godotengine/godot.git
Los íconos deben ser creados en un editor de gráficos vectoriales en formato SVG. Hay dos requisitos principales que debes seguir:
Los íconos deben tener un tamaño de 16×16 píxeles. En Inkscape, puedes configurar el tamaño del documento en Archivo > Propiedades del documento.
Las líneas deben alinearse con los píxeles siempre que sea posible para mantenerse nítidas en DPI más bajos. Puedes crear una cuadrícula de 16×16 en Inkscape para facilitar esto.
Una vez que estés satisfecho con el diseño del ícono, guarda el ícono en la carpeta editor/icons
del repositorio clonado. El nombre del ícono debe coincidir con el nombre previsto de manera sensible a mayúsculas y minúsculas. Por ejemplo, para crear un ícono para CPUParticles2D, nombra el archivo CPUParticles2D.svg
.
Conversión de color para temas de editor claros¶
Si el usuario ha configurado su editor para usar un tema claro, Godot convertirá los colores del ícono basándose en un conjunto de mapeos de color predefinidos. Esto asegura que el ícono siempre se muestre con una tasa de contraste suficiente. Trata de restringir la paleta de colores de tu ícono a los colores encontrados en la lista mencionada anteriormente. De lo contrario, tu ícono podría volverse difícil de leer sobre un fondo claro.
Optimización de iconos¶
Debido a que el editor renderiza los SVG una sola vez en el momento de carga, deben ser pequeños en tamaño para que puedan ser analizados de manera eficiente. Los íconos del editor deben ser optimizados antes de ser agregados al motor, para hacerlo:
Instala svgcleaner descargando un archivo binario desde su pestaña de lanzamientos y colocándolo en una ubicación dentro de la variable de entorno
PATH
.Ejecuta el siguiente comando, reemplazando
svg_source.svg
con la ruta a tu archivo SVG (que puede ser una ruta relativa o absoluta):svgcleaner --multipass svg_source.svg svg_optimized.svg
El interruptor --multipass
mejora la compresión, así que asegúrate de incluirlo. El ícono optimizado se guardará en svg_optimized.svg
. También puedes cambiar el parámetro de destino a cualquier ruta relativa o absoluta que desees.
Nota
Si bien este paso de optimización no afectará notablemente la calidad del ícono, aún eliminará información específica del editor, como guías. Por lo tanto, se recomienda mantener el archivo SVG original si necesitas realizar cambios adicionales.
Integrando y compartiendo los iconos¶
Si estás contribuyendo al motor en sí, debes hacer una solicitud de extracción (pull request) para agregar los íconos optimizados a la carpeta editor/icons
en el repositorio principal. Luego, vuelve a compilar el motor para que tome los nuevos íconos para las clases.
También es posible crear íconos personalizados dentro de un módulo. Si estás creando tu propio módulo y no planeas integrarlo con Godot, no es necesario hacer una solicitud de extracción separada para que tus íconos estén disponibles dentro del editor, ya que pueden ser autocontenidos.
Para obtener instrucciones específicas sobre cómo crear íconos para módulos, consulta Creación de íconos personalizados para módulos.
Solución De Problemas¶
Si los íconos no aparecen en el editor, asegúrate de que:
El nombre de archivo de cada ícono coincide con el requisito de nomenclatura descrito anteriormente.
modules/svg
está habilitado (debería estar habilitado de forma predeterminada). Sin él, los íconos no aparecerán en el editor en absoluto.