Attention: Here be dragons

This is the latest (unstable) version of this documentation, which may document features not available in or compatible with released stable versions of Godot.

Creare estensioni per la schermata principale

Cosa tratta questo tutorial

Le estensioni per la schermata principale consentono di creare nuove interfacce utente nella parte centrale dell'editor, che appaiono accanto ai pulsanti "2D", "3D", "Script", "Gioco" e "AssetLib". Queste estensioni dell'editor sono chiamate "estensioni per la schermata principale".

Questo tutorial ti guiderà attraverso la creazione di un'estensione basilare per la schermata principale. Per semplicità, la nostra estensione conterrà un singolo pulsante che stampa testo sulla console.

Inizializzare l'estensione

Per prima cosa, crea un nuovo plugin dal menu Estensioni. In questo tutorial, lo metteremo in una cartella chiamata main_screen, ma puoi usare qualsiasi nome tu voglia.

Lo script dell'estensione includerà i metodi _enter_tree() e _exit_tree(), ma per un'estensione per la schermata principale dobbiamo aggiungere alcuni metodi in più. Aggiungi quattro metodi in più in modo che lo script appaia così:

@tool
extends EditorPlugin


func _enter_tree():
    pass


func _exit_tree():
    pass


func _has_main_screen():
    return true


func _make_visible(visible):
    pass


func _get_plugin_name():
    return "Main Screen Plugin"


func _get_plugin_icon():
    return EditorInterface.get_editor_theme().get_icon("Node", "EditorIcons")

The important part in this script is the _has_main_screen() function, which is overridden to return true. This function is automatically called by the editor on plugin activation, to tell it that this plugin adds a new center view to the editor. For now, we'll leave this script as-is and we'll come back to it later.

Scena della scena principale

Crea una nuova scena con un nodo radice derivato da Control (per questa estensione di esempio, trasformeremo il nodo radice in CenterContainer). Seleziona questo nodo radice e, nella viewport, clicca sul menu Layout e seleziona Full Rect. Devi anche abilitare il flag di dimensione verticale Expand nell'ispettore. Il pannello ora utilizza tutto lo spazio disponibile nella viewport principale.

Adesso, aggiungiamo un pulsante alla nostra estensione di esempio per la schermata principale. Aggiungiamo un nodo Button e impostiamo il testo su "Print Hello" o simile. Aggiungiamo uno script al pulsante come questo:

@tool
extends Button


func _on_print_hello_pressed():
    print("Hello from the main screen plugin!")

Poi connetti il segnale "pressed" a se stesso. Se hai bisogno di aiuto con i segnali, consulta l'articolo Utilizzo dei segnali.

Abbiamo finito con il pannello della schermata principale. Salviamo la scena come main_panel.tscn.

Aggiornare lo script dell'estensione

We need to update the main_screen_plugin.gd script so the plugin instantiates our main panel scene and places it where it needs to be. Here is the full plugin script:

@tool
extends EditorPlugin


const MainPanel = preload("res://addons/main_screen/main_panel.tscn")

var main_panel_instance


func _enter_tree():
    main_panel_instance = MainPanel.instantiate()
    # Add the main panel to the editor's main viewport.
    EditorInterface.get_editor_main_screen().add_child(main_panel_instance)
    # Hide the main panel. Very much required.
    _make_visible(false)


func _exit_tree():
    if main_panel_instance:
        main_panel_instance.queue_free()


func _has_main_screen():
    return true


func _make_visible(visible):
    if main_panel_instance:
        main_panel_instance.visible = visible


func _get_plugin_name():
    return "Main Screen Plugin"


func _get_plugin_icon():
    # Must return some kind of Texture for the icon.
    return EditorInterface.get_editor_theme().get_icon("Node", "EditorIcons")

A couple of specific lines were added. MainPanel is a constant that holds a reference to the scene, and we instantiate it into main_panel_instance.

The _enter_tree() function is called before _ready(). This is where we instantiate the main panel scene, and add them as children of specific parts of the editor. We use EditorInterface.get_editor_main_screen() to obtain the main editor screen and add our main panel instance as a child to it. We call the _make_visible(false) function to hide the main panel so it doesn't compete for space when first activating the plugin.

La funzione _exit_tree() viene chiamata quando l'estensione viene disattivata. Se la schermata principale è ancora presente, chiamiamo queue_free() per liberare l'istanza e rimuoverla dalla memoria.

La funzione _make_visible() è sovrascritta per nascondere o mostrare il pannello principale a seconda delle necessità. Questa funzione viene chiamata automaticamente dall'editor quando l'utente clicca sui pulsanti della finestra principale in alto all'editor.

Le funzioni _get_plugin_name() e _get_plugin_icon() controllano il nome e l'icona visualizzati per il pulsante dell'estensione nella viewport principale.

Another function you can add is the _handles() function, which allows you to handle a node type, automatically focusing the main screen when the type is selected. This is similar to how clicking on a 3D node will automatically switch to the 3D viewport.

Main screen icons

You can either use one of the built-in icons from the editor, or provide your own icon for the main screen plugin. In both cases, this is done by overriding the _get_plugin_icon() method in the plugin script.

To use a built-in icon, copy an icon name from the Godot editor icons website. Use the name copied from the website as the first parameter of EditorInterface.get_editor_theme().get_icon() (the second parameter should remain "EditorIcons").

You can use a custom icon by returning something such as preload("res://addons/main_screen/icon.svg"). When designing your own icon, you should follow the same guidelines as for node icons (SVG format recommended, 16×16 size). See Icone dell'editor for information on how to create icons for your plugin.

Provare l'estensione

Attiva il plugin nelle Impostazioni del progetto. Noterai un nuovo pulsante accanto a 2D, 3D, Script, sopra la viewport principale. Cliccandoci verrai indirizzato alla tua nuova estensione nella schermata principale e il pulsante al centro stamperà del testo.

Se vuoi provare una versione completa di questa estensione, dai un'occhiata alle demo di estensioni qui: https://github.com/godotengine/godot-demo-projects/tree/master/plugins

Se vuoi vedere un esempio più completo di ciò di cui sono capaci le estensioni per la schermata principale, dai un'occhiata ai progetti demo 2.5D qui: https://github.com/godotengine/godot-demo-projects/tree/master/misc/2.5d