Godot/Editor/Ventana principal

Una vez abierto un proyecto para edición aparece la ventana de edición principal:

Estas son las distintas secciones de la ventana, de izquierda a derecha y de arriba a abajo:

Panel superior

Menú de opciones

Es el típico menú desplegable de opciones que aparece en cualquier aplicación típica de escritorio. Cosas que nos gustaría remarcar de este menú (y alguno de sus atajos):

• Distintas opciones de abrir (Ctrl+O) y guardar escenas (Ctrl+S)
• Acceso a la ventana de Configuración del proyecto actual
• Acceso al diálogo de Exportar
• Acceso a la ventana de Configuración del editor (común a todos los proyectos)
• Acceso a la documentación (F1)

Botones de pantalla principal

En la parte superior aparecen, por defecto, 4 botones que controlan qué se muestra en la pantalla principal (panel central que ocupa la mayor parte de la pantalla, justo debajo). Los cuatro botones son, en orden:

• 2D: Usado para editar escenas 2D y de menús. Atajo: Ctrl + F1.
• 3D: Usado para editar escenas en 3 dimensiones. Atajo: Ctrl + F2.
• Script: Abre el editor integrado de código, para ver documentación y scripts, y editar estos últimos. Atajo: Ctrl + F3.
• AssetLib: Permite buscar y descargar addons y herramientas directamente al proyecto actual desde de la librería de recursos. Atajo: Ctrl + F4.

Botonera de ejecución

En la parte superior derecha tenemos 7 botones que permiten controlar la ejecución de nuestro programa, de izquierda a derecha:

• Reproducir proyecto (F5): Ejecuta el proyecto abierto, empezando en la escena marcada como principal. Si no hay ninguna escena marcada como principal abre un diálogo para que elijas tú la escena principal o selecciones la actual. Es la manera más habitual de ejecutar el proyecto desde su inicio normal. Si la escena está pausada manualmente o debido a un error, se transforma en un botón de Recargar escena reproducida para volver a iniciarla sin tener que pulsar parar antes.
• Pausar proyecto en ejecución (F7): Pausa la ejecución (sólo disponible si el proyecto está ejecutándose) y permite mirar o cambiar cosas en la ventana principal sin que avance el juego. La escena también se pausa automáticamente si encuentra un error fatal.
• Detener proyecto en ejecución (F8): Termina completemente la ejecución de la aplicación.
• Ejecución en remoto: permite mostrar un listado de opciones para ejecutar el proyecto en remoto, por ejemplo, para ejecutar y debuguear el proyecto en un móvil Android o en un servidor web, si hemos configurado la exportación de manera adecuada.
• Ejecutar escena actual (F6): Funciona como el botón de reproducir el proyecto, pero en vez de ejecutar la escena principal, ejecuta la actualmente abierta. Muy útil para probar escenas o niveles de manera separada, sin tener que pasar por el menú principal o niveles anteriores.
• Ejecutar escena específica (Ctrl + Mayús + F5): Como ejecutar la escena actual, pero en vez de la actual, muestra un diálogo para seleccionar qué escena se ejecutará de manera inmediata.
• Habilitar el modo de Fabricante de películas: No es un botón, sino un toggle que hace que si se ejecuta el proyecto, se grabe un vídeo con su ejecución. Requiere la configuración previa del proyecto en Configuración del proyecto > General > Editor > Escritor de Película (Movie Maker) para indicar la ruta del archivo de grabación. Útil para compartir una ejecución sin necesitar aplicaciones de captura externos. Normalmente debería estar deshabilitado, excepto para esas ejecuciones que queramos grabar.

Menú de selección de renderizador

Ya se ha hablado de estas opciones en la sección Administrador de proyectos, así que no se repetirá aquí. Tan solo recordar que cambiarlo con el proyecto abierto requerirá reiniciarlo.

Paneles de la izquierda

Panel de Escena

El panel de escena, por defecto situado arriba a la izquierda, mostrará la jerarquía de nodos que componen nuestra escena. Por defecto, ya que no tenemos ninguna escena abierta ni creada, sugerirá crear una nueva de tipo: Escena 2D, Escena 3D, Interfaz de usuario o de Otro nodo. Al pulsar uno de los primeros 3 botones (los 3 tipos más habituales para una escena principal- 2D, 3D e interfaz de usuario), el panel de escena cambiará a una vista de la escena recién creada, y su nodo raíz del tipo elegido. El cuarto botón abrirá un diálogo de "Crear nuevo nodo" que permite seleccionar otro tipo de nodo y que más adelante veremos.

Si creas una Escena de tipo 2D y seleccionas con el botón izquierdo del ratón el nodo raíz de la escena, por defecto llamado Node2D, aparecerán 3 botones en la parte superior (además de un campo de filtrado de nodos), de izquierda a derecha:

• Añadir nodo hijo (Ctrl + A): permite añadir más nodos a nuestra escena
• Instanciar escena hija (Ctrl + Mayús + A): permite añadir una subescena como si fuera un nodo hijo
• Añadir script: permite asociar un script nuevo o existente con ese nodo

Dentro de la jerarquía de nodos, cada nodo tendrá varias partes:

• Un icono (en este caso, un círculo azul para denotar que es de tipo 2D)
• Un nombre, que se puede editar haciendo doble click o con el atajo F2
• Unas propiedades (por defecto aparece un ojo, indicando que el nodo es visible), y que se pueden activar o desactivar pulsándolas. Más adelante aparecerán aquí otras opciones como "bloqueado/desbloqueado", asociación con un script, nodo marcado como nombre único, etc.

Si ha usado en el pasado programas de edición como Blender o Gimp, encontrará esta pestaña bastante familiar, ya que todos los nodos y subescenas que forman nuestra escena abierta aparecerán aquí. Es más, por defecto, esto también controla el orden en el que se dibujan, de arriba abajo, por lo que los nodos que estén más abajo en el inspector aparecerán delante de los que estén más arriba.

Panel «Importar»

Detrás de la pestaña de Escena, en la pestaña Importar, pero ocupando el mismo espacio encontraremos el panel de importación de recursos. Por defecto estará vacío, pero si seleccionamos en el panel inferior (Sistema de Archivos) un archivo- por ejemplo, icon.svg, veremos las opciones usadas al importarse.

Godot, habitualmente, no preguntará ninguna opción cuando detecte archivos nuevos o se arrastren a su carpeta de proyecto- los importará con las opciones por defecto del motor o aquellas que nosotros habremos configurado por defecto en la configuración del proyecto. Sin embargo, si hay alguna de estas opciones que queramos especificar distintas para un archivo en particular, podremos cambiarlas aquí y luego pulsar el botón de Reimportar de la parte inferior.

Típicas opciones que querremos cambiar serán, por ejemplo, el tipo de recurso que importar (por ejemplo, si un mismo archivo puede importarse como varios tipos de recursos distintos), su compresión o si un archivo de sonido se debe repetir en bucle. Sin embargo, no comentaremos en detalle las opciones de todos los tipos de archivo, ya que en muchos casos será deseable cambiarlas en las preferencias generales, si es posible.

Sistema de archivos

Esta es la visión a nivel de archivos del proyecto. Aquí aparecerán todos los archivos que estén físicamente dentro de la carpeta del proyecto, siempre que Godot los reconozca como relevantes para el proyecto (escenas, scripts, assets, etc.) y no hayan sido excluidos.

Para añadir un archivo al proyecto podremos crearlo mediante las herramientas que proporciona el propio editor, exportar archivos con un programa externo dentro de esta ruta o copiar o arrastrar archivos en el gestor de archivos o directamente a este panel. Siempre que Godot, estando abierto y teniendo el foco detecte archivos nuevos o archivos anteriores hayan cambiado intentará importarlos o reimportarlos para que aparezcan sus nuevas versiones en nuestro proyecto. Los archivos importados normalmente crearán un archivo adicional .import con las opciones de importado, que no aparecerán en el Sistema de archivos virtual.

El arbol del sistema de archivos tendrá las funcionalidades habituales de un explorador de archivos normal, como: filtrado, creación de nuevos archivos y carpetas, borrado y renombrado/movimiento de archivos de ruta. También permite asignar colores a distintas subcarpetas para una mejor identificación.

Si deseamos tener archivos que estén dentro de nuestra carpeta de proyecto pero no sean importada por Godot podemos crear una archivo .gdignore y esto hará que todos los archivos de esa carpeta y subcarpetas se ignoren de cara al proyecto- godot no intentará importarla o tocarla de ninguna manera.

consejo

Modos de división

El sistema de archivos de Godot tiene 3 modos de visualización, el por defecto, y 2 adicionales que separan las carpetas y archivos en dos vistas separadas verticalmente u horizontalmente. Puedes probarlas pulsando el botón de Cambiar Modo de División de la parte superior derecha.

Pantalla principal

Como hemos comentado antes al hablar de los botones, en la pantalla principal, por defecto, podremos navegar por nuestra escena, editar scripts, leer la documentación integrada o bajar addons y herramientas desde la librería de assets. Es posible que ciertos addons añadan también pantallas extra. La pantalla principal es la parte de la interfaz que más usaremos y hablamos de cada una más en detalle en una sección aparte:

• Escena 2D
• Escena 3D
• Editor de código
• Librería de Assets

La única cosa que vamos a remarcar es que, aunque las vistas 2D y 3D sí tienen una correspondencia 1:1 con la escena abierta en el panel de escena (abrir una escena distinta la mostrará en la ventana principal, y cambiar la vista principal a otra pestaña la cambiará en la escena), la vista del editor de código no tiene porqué- una escena puede contener más de un script, e incluso podemos visualizar un script o texto que no corresponda con la actual escena activa. Esto es una funcionalidad muy útil pero que suele confundir bastante a la gente que está empezando a usar el editor, por lo que recomendamos al principio asegurarnos siempre que estamos editando el script correcto en cada caso.

consejo

Si en algún momento necesitas más espacio para trabajar en la ventana principal, puedes pulsar el botón de la parte superior derecha (Modo sin distracciones), o pulsar el atajo Ctrl + Mayús + F11, para que la pantalla central ocupe todo el ancho de la pantalla, ocultando los paneles laterales.

Para volver al modo normal, púlsalo de nuevo.

Paneles de la derecha

Inspector

El Inspector muestra las propiedades del nodo o subescena que tengamos seleccionado en el panel Escena. Si pulsamos el nodo raíz de escena que hemos creado antes (Node2D, a la izquierda), veremos que aparecen una serie de propiedades desplegables, organizadas de mayor a menor especificidad. Es decir, Un Nodo 2D es de tipo Node2D propiamente dicho, y eso le da una propiedades de transformación (Position, Rotation, Scale, etc.). Sin embargo, un Node2D es un subtipo de CanvasItem, así que también tendrá las propiedades de ese nodo (Visible, Z_Index, etc.). Por último, todos los CanvasItems son a su vez nodos (Node), con sus propiedades (Proces_mode), Script, ... Si conoces la programación orientada a objetos, este modelo te resultará familar como distintas clases, cada una heredando de otra sus propiedades y métodos.

Echa un vistazo a todas las propiedades que aparecen para un Nodo 2D, que están ordenadas de menos a más genéricas y organizadas por grupos desplegables. Si desplegamos un grupo (Transform), podremos editar dichas propiedades usando el ratón y el teclado con los controles típicos de una interfaz de usuario (cajas de texto, barras de deslizamiento, etc). Al igual que Blender, todos los campos de edición numéricos funcionan como una calculadora, así que si en vez de poner un 2 en Node2D > Position > x, puedes escribir 1 + 1 y calculará el resultado al pulsar intro. Para revertir el cambio, puedes editar el campo o pulsar la fechita curvada que aparece a la izquierda y que te permite revertir al valor por defecto (además de marcar que el campo ha sido modificado).

Adicionalmente, comprueba que si mantienes el ratón encima del nombre de una propiedad durante un segundo, te muestra un consejo con la documentación de dicha propiedad. Por ejemplo, si pones el ratón sobre CanvasItem > Visibility > Visible, te dirá que si es verdad (marcado como Activado en el editor), de dibujará, pero que además tienen que estar visibles todos los nodos padre. Si pulsas con el botón derecho en el nombre de una propiedad tendrás opciones extra- no sólo copiar y pegar su valor, sino también copiar la ruta (su nombre) -algo que será útil más delante cuando manejemos estas propiedades desde el código- y Abrir documentación, que permitirá leer información más detallada sobre sí misma en la pantalla principal.

Veremos más en profundidad las propiedades de cada nodo más adelante, así como los botones superiores de este panel cuando veamos los recursos, pero aquí van algunos consejos de usabilidad del inspector:

• Un nodo puede contender decenas de propiedades, así que el buscador superior Filtrar propiedades te permite filtrar rápidamente propiedades mostradas si conoces su nombre. Por ejemplo, si escribes sca, te aparecerá solo la escala para modificar justo debajo.
• Si dejas los grupos colapsables muy desordenados, puedes utilizar las utilidades rápidas del botón Administrador de propiedades de los objetos para colapsar y descolapsarlos. También puedes elegir entre ver los nombres de las propiedades en su valor original, con mayúsculas o traducido a tu idioma local.
• Es posible copiar y pegar todas las propiedades de un nodo a otro sin necesidad de duplicarlo por completo- pero asegúrate que no estás abusando de esta funcionalidad, porque puede indicar que tu arquitectura de desarrollo tiene duplicados poco eficientes

Nodos

En el mismo espacio que el panel del Inspector, pero una pestaña más atrás encontraremos el panel denominado Nodos. Se trata en realidad de un panel con dos subpaneles no demasiado relacionados entre sí llamados Señales y Grupos, cada uno accesible pulsando la subpentaña correspondiente.

Señales

Este panel muestra todas las señales que el nodo seleccionado puede emitir. Hablaremos de señales más adelante en este curso. De momento deberías ver una lista de nombres con un icono rojo (indicando que están desconectados por defecto) y que se organizan de manera parecida que las propiedades (por clase en la que se definen) e igualmente si ponemos el ratón encima de una de ellas podremos ver su documentación. Por ejemplo, Un Nodo 2D contendrá la señal visibility_changed(), heredada de la clase CanvasItem, y su documentación nos indica que esta señal se emite cuando su visibilidad cambia.

Veremos cómo conectar señales en un capítulo posterior.

Grupos

El subpanel Grupos aparecerá vacío por defecto. Este panel permite visualizar y editar los grupos a los que pertenece este nodo, así como acceder al diálogo dedicado de administración de grupos. Los grupos permiten básicamente poner etiquetas y clasificar los nodos de nuestro proyecto, sin embargo, su uso suele ser bastante limitado ya que es posible realizar este tipo de clasificación mediante otros métodos de programación más mantenibles. Pero puede usarse en casos concretos en los que clasificar nodos de manera visual en el editor tenga sentido, sin necesidad de utilizar código.

Más delante veremos cómo acceder desde el código a comprobar si un nodo forma parte de un determinado grupo u obtener un listado de todos los nodos de un grupo.

Historial

El panel de historial no es más que un registro ordenado de todos los cambios hechos desde que se cargó el proyecto actual, tanto globales como sólo del nodo actual. Simplemente recordar que Godot permite deshacer y rehacer cambios con los atajos habituales (Ctrl + Z para deshacer y Ctrl + Mayús + Z o Ctrl + Y para rehacer). O bien mediante el menú de escena.

Panel inferior

El panel inferior es en realidad un conjunto de paneles que normalmente están plegados, pero que se despliegan o pueden desplegarse y se muy útiles dependiendo del contexto o qué elemento del interfaz se tenga seleccionado. Vamos a explicar por encima ahora los que aparecen por defecto, pero más delante los volveremos a mostrar más en detalles cuando sean relevantes para la funcionalidad explicada.

Puedes pulsar en su nombre en la parte baja de la ventana principal y se desplegará. Si vuelves a pulsar en el nombre de un panel desplegado se volverá a plegar.

• Salida: muestra la salida estándar del editor y/o del proyecto. Lo veremos más adelante cuando veamos el editor de código.
• Depurador: muestra errores del proyecto y permite visualizar y controlar el debugger y herramientas de monitorización integradas en godot. Especialmente útil cuando la ejecución está pausada. Lo veremos más adelante cuando veamos el editor de código.
• Resultados de la Búsqueda: Muestra los resultados de búsqueda y reemplazo globales (menú Buscar > Buscar en archivos)
• Audio: Permite realizar la mezcla, así como crear y editar distintas pistas de audio globales a todo el proyecto (cambiar su volumen, silenciar, añadir efectos). Lo veremos más con detalles cuando hablemos de audio en Godot.
• Animación: Permite editar las pistas de animación de los nodos AnimationPlayer. Lo veremos más adelante cuando hablemos de este nodo.
• Editor de Shader: Permite abrir y editar shaders tanto en código (gsshader) como gráficamente, mediante nodos (visualShader)

Existen muchos otros tipos de nodos, recursos y plugins que permiten abrir paneles inferiores, pero estos aparecen por defecto porque, o bien son globales al proyecto o bien es muy frecuente usarlos mientras se editan otros nodos (por ejemplo, AnimationPlayer require habitualmente tenerlo abierto mientras se usan otros nodos).

Sin embargo, estos no son los únicos paneles que pueden aparecer aquí. Otros son: MSBuild (el resultado de la compilación con C#), los editores de TileMaps y TileSets, AnimationTree,AnimatedSprite, el editor de temas de interfaz, y más, que sólo aparecerán cuando sean relevantes y/o se seleccione el nodo o recurso correspondiente.