Création de plugins pour l'écran principal

Ce que couvre ce tutoriel

Comme on le voit dans la page Création de plugins, réaliser un plugin de base qui étend l'éditeur est assez facile. Ce mécanisme de plugin vous permet également de créer de nouvelles interfaces utilisateur dans la partie centrale de l'éditeur, de la même manière que les vues de base en "2D", "3D", "Script", et "AssetLib". Ces plugins éditeur sont appelés "Main screen plugins".

Ce tutoriel vous guide à travers la création d'un plugin de base pour l'écran principal. Par souci de simplicité, notre plugin pour l'écran principal contiendra un seul bouton qui imprimera du texte sur la console.

Initialisation du plugin

Créez d'abord un nouveau plugin à partir du menu Plugins. Pour ce tutoriel, nous le placerons dans un dossier appelé main_screen, mais vous pouvez utiliser le nom que vous souhaitez.

Le script du plugin sera fourni avec les méthodes _enter_tree() et _exit_tree(), mais pour un plugin pour l'écran principal, nous devons ajouter quelques méthodes supplémentaires. Ajoutez cinq méthodes supplémentaires de sorte que le script ressemble à ceci :

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 get_editor_interface().get_base_control().get_icon("Node", "EditorIcons")

La partie importante de ce script est la fonction has_main_screen(), qui est surchargée de sorte qu'elle renvoie true. Cette fonction est automatiquement appelée par l'éditeur lors de l'activation du plugin, pour lui indiquer que ce plugin ajoute une nouvelle vue centrale à l'éditeur. Pour l'instant, nous allons laisser ce script tel quel et nous y reviendrons plus tard.

Scène de l'écran principal

Créer une nouvelle scène avec un nœud racine dérivé de Control (pour cet exemple de plugin, nous allons faire du nœud racine un CenterContainer). Sélectionnez ce nœud racine, et dans la fenêtre d'affichage, cliquez sur le menu Layout et sélectionnez Full Rect. Vous devez également activer le drapeau de taille verticale Expand dans l'inspecteur. Le panneau utilise maintenant tout l'espace disponible dans la fenêtre d'affichage principale.

Ensuite, ajoutons un bouton à notre exemple de plugin pour l'écran principal. Ajoutez un nœud Button et définissez le texte comme "Print Hello" ou similaire. Ajoutez un script au bouton comme ceci :

tool
extends Button


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

Ensuite, connectez le signal "pressed" à lui-même. Si vous avez besoin d'aide pour les signaux, consultez l'article Utiliser les signaux.

Nous avons terminé pour le panneau de l'écran principal. Enregistrez la scène sous le nom main_panel.tscn.

Mettre à jour le script du plugin

Nous devons mettre à jour le script main_screen_plugin.gd afin que le plugin instance notre scène d'écran principal et la place là où elle doit être. Voici le script complet du plugin :

tool
extends EditorPlugin


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

var main_panel_instance


func _enter_tree():
    main_panel_instance = MainPanel.instance()
    # Add the main panel to the editor's main viewport.
    get_editor_interface().get_editor_viewport().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 get_editor_interface().get_base_control().get_icon("Node", "EditorIcons")

Quelques lignes spécifiques ont été ajoutées. Le MainPanel est une constante qui fait référence à la scène, et nous l'utilisons dans l'instance main_panel_instance.

La fonction _enter_tree() est appelée avant _ready(). C'est là que nous instancions la scène d'écran principal, et que nous les ajoutons en tant qu'enfants de parties spécifiques de l'éditeur. Nous utilisons la fonction get_editor_interface().get_editor_viewport() pour obtenir le viewport et y ajouter notre instance d'écran principal en tant qu'enfant. Nous appelons la fonction make_visible(false) pour cacher l'écran principal afin qu'il ne soit pas en compétition pour l'espace lors de la première activation du plugin.

La fonction _exit_tree() est appelée lorsque le plugin est désactivé. Si l'écran principal existe toujours, nous appelons la fonction queue_free() pour libérer l'instance et la supprimer de la mémoire.

La fonction make_visible() est surchargée pour cacher ou montrer le panneau principal selon les besoins. Cette fonction est automatiquement appelée par l'éditeur lorsque l'utilisateur clique sur les boutons de la fenêtre principale en haut de l'éditeur.

Les fonctions get_plugin_name() et get_plugin_icon() contrôlent le nom et l'icône affichés pour le bouton principal de la fenêtre de visualisation du plugin.

Une autre fonction que vous pouvez ajouter est la fonction handles(), qui vous permet de gérer un type de nœud, en focalisant automatiquement l'écran principal lorsque le type est sélectionné. Cette fonction est similaire à celle qui permet de cliquer sur un nœud 3D pour passer automatiquement à la fenêtre de visualisation 3D.

Essayez le plugin

Activez le plugin dans les Paramètres du projet. Vous observerez un nouveau bouton à côté de 2D, 3D, Script au-dessus de la fenêtre principale. En cliquant dessus, vous accéderez à l'écran principal de votre nouveau plugin, et le bouton du milieu imprimera du texte.

Si vous souhaitez essayer une version finalisée de ce plugin, consultez les démos du plugin ici : https://github.com/godotengine/godot-demo-projects/tree/master/plugins

Si vous souhaitez voir un exemple plus complet de ce dont sont capables les plugins d'écran principal, consultez les projets de démonstration 2.5D ici : https://github.com/godotengine/godot-demo-projects/tree/master/misc/2.5d