Outils pour utilisateurs

Outils du site


godot_scenes_et_scripts

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision
Révision précédente
Dernière révisionLes deux révisions suivantes
godot_scenes_et_scripts [2018/09/04 06:36] – [Code final] sergegodot_scenes_et_scripts [2020/02/07 16:35] – ↷ Liens modifiés en raison d'un déplacement. serge
Ligne 21: Ligne 21:
 Allez dans l'onglet **"Scène" et cliquez "Nouvelle Scène"**. Allez dans l'onglet **"Scène" et cliquez "Nouvelle Scène"**.
  
-{{:godot_instance_a.png?600|godot_instance_a.png}}+{{media_04:godot_instance_a.png?600|godot_instance_a.png}}
  
 Dans l'onglet "Scène", **ajoutez un nouveau nœud**. Cette fois-ci, **servez-vous de la barre de recherche pour sélectionner "Sprite"**. C'est le type de nœud qui permet de manipuler des images. Renommez-le "flocon" et sauvegardez-le dans le dossier "core", à côté de la scène "pluie". Dans l'onglet "Scène", **ajoutez un nouveau nœud**. Cette fois-ci, **servez-vous de la barre de recherche pour sélectionner "Sprite"**. C'est le type de nœud qui permet de manipuler des images. Renommez-le "flocon" et sauvegardez-le dans le dossier "core", à côté de la scène "pluie".
  
-{{:godot_instance_b.png?600|godot_instance_b.png}}+{{media_04:godot_instance_b.png?600|godot_instance_b.png}}
  
 Vous pouvez maintenant alterner, dans l'éditeur, entre les deux scènes facilement. Vous pouvez maintenant alterner, dans l'éditeur, entre les deux scènes facilement.
  
-{{:godot_instance_c.png?400|godot_instance_c.png}}+{{media_04:godot_instance_c.png?400|godot_instance_c.png}}
  
 Mais nous restons pour l'instant sur la scène "flocon". Nous pourrions utiliser les différents onglets pour changer les paramètres du Sprite, par exemple l'image qu'il affiche, mais ce ne serait pas tout à fait une bonne idée. Ces onglets sont faits pour travailler plus rapidement, et permettent, dirons-nous, de manipuler du code en cliquant sur des boutons. Mais développer un jeu vidéo passe nécessairement par du code, et l'idée ici est justement de se faire la main sur les principes de base du code. Le **code est contenu dans un script**, et nous allons ici en attacher un au Sprite "flocon", en **cliquant sur le petit parchemin surmonté d'un plus**, en haut à droite de l'onglet scène, en ayant sélectionné "flocon". Mais nous restons pour l'instant sur la scène "flocon". Nous pourrions utiliser les différents onglets pour changer les paramètres du Sprite, par exemple l'image qu'il affiche, mais ce ne serait pas tout à fait une bonne idée. Ces onglets sont faits pour travailler plus rapidement, et permettent, dirons-nous, de manipuler du code en cliquant sur des boutons. Mais développer un jeu vidéo passe nécessairement par du code, et l'idée ici est justement de se faire la main sur les principes de base du code. Le **code est contenu dans un script**, et nous allons ici en attacher un au Sprite "flocon", en **cliquant sur le petit parchemin surmonté d'un plus**, en haut à droite de l'onglet scène, en ayant sélectionné "flocon".
  
-{{:godot_instance_d.png?400|godot_instance_d.png}}+{{media_04:godot_instance_d.png?400|godot_instance_d.png}}
  
 On nous propose de créer un nouveau fichier nommé "flocon.gd", dans le dossier "core". Ce fichier est le script en lui-même : il déterminera comment se comporte la scène "flocon". Appuyez sur "Créer". On nous propose de créer un nouveau fichier nommé "flocon.gd", dans le dossier "core". Ce fichier est le script en lui-même : il déterminera comment se comporte la scène "flocon". Appuyez sur "Créer".
  
-{{:godot_instance_e.png?400|godot_instance_e.png}}+{{media_04:godot_instance_e.png?400|godot_instance_e.png}}
  
 Vous voilà dans le code en lui-même ! Vous voilà dans le code en lui-même !
  
-{{:godot_instance_f.png?600|godot_instance_f.png}}+{{media_04:godot_instance_f.png?600|godot_instance_f.png}}
  
 Les **lignes en blanc sont des commentaires** pour rappeler aux débutants comment le script s'organise. Comme vous êtes avec moi, **commencez par les enlever**, pour ne garder que les éléments utiles. Le code ressemble maintenant à ça : Les **lignes en blanc sont des commentaires** pour rappeler aux débutants comment le script s'organise. Comme vous êtes avec moi, **commencez par les enlever**, pour ne garder que les éléments utiles. Le code ressemble maintenant à ça :
  
-{{:godot_instance_g.png?600|godot_instance_g.png}}+{{media_04:godot_instance_g.png?600|godot_instance_g.png}}
  
 La première ligne, **  extends   Sprite, indique que le script est attaché à un nœud de type Sprite** et, en tant que tel, contient des fonctionnalités préconçues qui lui sont adaptées, par exemple la possibilité de lui attribuer une image. La première ligne, **  extends   Sprite, indique que le script est attaché à un nœud de type Sprite** et, en tant que tel, contient des fonctionnalités préconçues qui lui sont adaptées, par exemple la possibilité de lui attribuer une image.
Ligne 59: Ligne 59:
 Retournez maintenant dans l'éditeur. Elle apparaît dans l'onglet **"Système de fichiers", qui représente le dossier du projet**. Vous pouvez si vous le souhaitez copier le chemin qui permet d'y accéder. Retournez maintenant dans l'éditeur. Elle apparaît dans l'onglet **"Système de fichiers", qui représente le dossier du projet**. Vous pouvez si vous le souhaitez copier le chemin qui permet d'y accéder.
  
-{{:godot_instance_h.png?400|godot_instance_h.png}}+{{media_04:godot_instance_h.png?400|godot_instance_h.png}}
  
 Un petit mot sur les chemins. **Les chemins dans Godot sont toujours représentés sous forme de string**, c'est-à-dire une suite de caractères. En tant que tels, ils commencent et terminent par des guillemets ( " ). Le chemin commence toujours par <nowiki>res://</nowiki>, qui fait référence au dossier du jeu. Ensuite viennent le nom du ou des dossiers, puis le nom du fichier, chacun séparés par un slash ( / ). Donc pour accéder au fichier flocon.png, situé dans le dossier data, situé dans le dossier du projet, nous utilisons le chemin suivant:  Un petit mot sur les chemins. **Les chemins dans Godot sont toujours représentés sous forme de string**, c'est-à-dire une suite de caractères. En tant que tels, ils commencent et terminent par des guillemets ( " ). Le chemin commence toujours par <nowiki>res://</nowiki>, qui fait référence au dossier du jeu. Ensuite viennent le nom du ou des dossiers, puis le nom du fichier, chacun séparés par un slash ( / ). Donc pour accéder au fichier flocon.png, situé dans le dossier data, situé dans le dossier du projet, nous utilisons le chemin suivant: 
Ligne 66: Ligne 66:
 Nous allons d'abord le stocker dans une variable, c'est-à-dire demander à l'ordinateur de créer, dans une petite partie de sa mémoire, un endroit où la stocker afin qu'il puisse aller la chercher : Nous allons d'abord le stocker dans une variable, c'est-à-dire demander à l'ordinateur de créer, dans une petite partie de sa mémoire, un endroit où la stocker afin qu'il puisse aller la chercher :
  
-{{:godot_instance_i.png?600|godot_instance_i.png}}+{{media_04:godot_instance_i.png?600|godot_instance_i.png}}
  
 **  var** signifie que nous créons une nouvelle variable, **  image** est son nom, **  preload()** permet de lui attribuer un fichier externe, et nous lui indiquons le **chemin** où la trouver. **  var** signifie que nous créons une nouvelle variable, **  image** est son nom, **  preload()** permet de lui attribuer un fichier externe, et nous lui indiquons le **chemin** où la trouver.
Ligne 72: Ligne 72:
 Très bien, maintenant que nous avons mis en place le chargement de l'image, nous allons **l'attribuer au Sprite** lorsque celui-ci arrive dans l'application. Pour cela, une fonction a déjà été mise en place au sein de Godot : **  set_texture()**. Elle est disponible puisque le script commence par la ligne   extends   Sprite. Si la scène avait été un Node2D, cela n'aurait pas été permis. Entre parenthèses, nous indiquons la variable que nous souhaitons lui attribuer, ici   image : Très bien, maintenant que nous avons mis en place le chargement de l'image, nous allons **l'attribuer au Sprite** lorsque celui-ci arrive dans l'application. Pour cela, une fonction a déjà été mise en place au sein de Godot : **  set_texture()**. Elle est disponible puisque le script commence par la ligne   extends   Sprite. Si la scène avait été un Node2D, cela n'aurait pas été permis. Entre parenthèses, nous indiquons la variable que nous souhaitons lui attribuer, ici   image :
  
-{{:godot_instance_j.png?600|godot_instance_j.png}}+{{media_04:godot_instance_j.png?600|godot_instance_j.png}}
  
 Puisque la fonction   _ready(): doit effectuer une action, la ligne   pass n'est plus utile, nous l'avons remplacée. Puisque la fonction   _ready(): doit effectuer une action, la ligne   pass n'est plus utile, nous l'avons remplacée.
Ligne 78: Ligne 78:
 Petite précision : nous en parlerons un peu plus tard, mais vous pouvez apercevoir une petite flèche avant certaines lignes de code dans mes exemples. Il s'agit de **l'"indentation", que l'on ajoute en appuyant sur tabulation**. Si elle est absente, elle empêchera votre programme de fonctionner, veillez-donc à la respecter selon mon modèle. Petite précision : nous en parlerons un peu plus tard, mais vous pouvez apercevoir une petite flèche avant certaines lignes de code dans mes exemples. Il s'agit de **l'"indentation", que l'on ajoute en appuyant sur tabulation**. Si elle est absente, elle empêchera votre programme de fonctionner, veillez-donc à la respecter selon mon modèle.
  
-{{:godot_instance_indent.png?400|godot_instance_indent.png}}+{{media_04:godot_instance_indent.png?400|godot_instance_indent.png}}
  
 Appuyer maintenant sur **F6**, cela lancera la **scène active**, dans notre cas "flocon.tscn". Petit rappel : **F5 lance la scène principale, F6 lance la scène active**, celle en cours d'édition. Voici ce qui apparaît : Appuyer maintenant sur **F6**, cela lancera la **scène active**, dans notre cas "flocon.tscn". Petit rappel : **F5 lance la scène principale, F6 lance la scène active**, celle en cours d'édition. Voici ce qui apparaît :
  
-{{:godot_instance_flocon00.png?400|godot_instance_flocon00.png}}+{{media_04:godot_instance_flocon00.png?400|godot_instance_flocon00.png}}
  
 Le flocon apparaît bien, mais est **situé en haut à gauche de l'écran**. Pourquoi donc ? La position de base d'un Sprite est la suivante : **Vector2(0,0)**. Vector2 indique le type de données dont il s'agit. **Un Vector2 contient deux données qui correspondent l'une à l'espace horizontal ( x ), l'autre à l'espace vertical ( y )**. La position du Sprite est donc actuellement de 0 sur l'axe x, 0 sur l'axe y. **Ces coordonnées sont relatives au coin haut/gauche de l'écran**, il est donc normal qu'il se trouve là. Le flocon apparaît bien, mais est **situé en haut à gauche de l'écran**. Pourquoi donc ? La position de base d'un Sprite est la suivante : **Vector2(0,0)**. Vector2 indique le type de données dont il s'agit. **Un Vector2 contient deux données qui correspondent l'une à l'espace horizontal ( x ), l'autre à l'espace vertical ( y )**. La position du Sprite est donc actuellement de 0 sur l'axe x, 0 sur l'axe y. **Ces coordonnées sont relatives au coin haut/gauche de l'écran**, il est donc normal qu'il se trouve là.
Ligne 88: Ligne 88:
 Mon projet étant configuré en 600 pixels par 600 pixels, le centre de l'écran se trouve à la position Vector2(300,300). Plaçons y notre Sprite, en rajoutons une nouvelle ligne de code : **  set_pos(Vector2(300,300))**. Mon projet étant configuré en 600 pixels par 600 pixels, le centre de l'écran se trouve à la position Vector2(300,300). Plaçons y notre Sprite, en rajoutons une nouvelle ligne de code : **  set_pos(Vector2(300,300))**.
  
-{{:godot_instance_set_pos.png?600|godot_instance_set_pos.png}}+{{media_04:godot_instance_set_pos.png?600|godot_instance_set_pos.png}}
  
 Une vérification en appuyant sur F6 nous permet de voir que **la position a bien été modifiée** ! Une vérification en appuyant sur F6 nous permet de voir que **la position a bien été modifiée** !
  
-{{:godot_instance_mid.png?400|godot_instance_mid.png}}+{{media_04:godot_instance_mid.png?400|godot_instance_mid.png}}
  
 Bien. C'est là que les choses sérieuses commencent. Nous souhaiterions que le flocon soit affiché au hasard sur l'écran. Puisque l'écran fait 600 pixels de large, il faudrait que nous puissions obtenir un nombre au hasard entre 0 et 600. Il existe déjà une fonction qui permet de l'obtenir : **  randi()     n**. **Assigné à une variable, cette formule donnera a cette variable un nombre au hasard entre 0 et n-1**. Nous allons donc créer une nouvelle variable,   position_x, que nous mettrons égale à   randi()     601. Comme cela : Bien. C'est là que les choses sérieuses commencent. Nous souhaiterions que le flocon soit affiché au hasard sur l'écran. Puisque l'écran fait 600 pixels de large, il faudrait que nous puissions obtenir un nombre au hasard entre 0 et 600. Il existe déjà une fonction qui permet de l'obtenir : **  randi()     n**. **Assigné à une variable, cette formule donnera a cette variable un nombre au hasard entre 0 et n-1**. Nous allons donc créer une nouvelle variable,   position_x, que nous mettrons égale à   randi()     601. Comme cela :
  
-{{:godot_instance_randi1.png?600|godot_instance_randi1.png}}+{{media_04:godot_instance_randi1.png?600|godot_instance_randi1.png}}
  
 Qu'il suffit de **dupliquer avec Ctrl-C Ctrl-V** pour créer une autre variable :   position_y. Qu'il suffit de **dupliquer avec Ctrl-C Ctrl-V** pour créer une autre variable :   position_y.
  
-{{:godot_instance_randi2.png?600|godot_instance_randi2.png}}+{{media_04:godot_instance_randi2.png?600|godot_instance_randi2.png}}
  
 Enfin il suffit maintenant de **remplacer les valeurs de   set_pos()** par nos nouvelles variables. Enfin il suffit maintenant de **remplacer les valeurs de   set_pos()** par nos nouvelles variables.
  
-{{:godot_instance_randi3.png?600|godot_instance_randi3.png}}+{{media_04:godot_instance_randi3.png?600|godot_instance_randi3.png}}
  
 Appuyez sur F6, et contemplez le résultat ! Le flocon est maintenant situé au hasard ! Appuyez sur F6, et contemplez le résultat ! Le flocon est maintenant situé au hasard !
  
-{{:godot_instance_random.png?400|godot_instance_random.png}}+{{media_04:godot_instance_random.png?400|godot_instance_random.png}}
  
 Mais si vous fermez la fenêtre, et refaites F6, le flocon reste à la même position. Fichtre. En fait, la formule **  randi() n'est pas complètement aléatoire**. Il est nécessaire de la rafraîchir régulièrement pour qu'elle fonctionne. Avant vos variables, insérez la fonction **  randomize()** qui permet à l’aléatoire d'être remis à jour. Mais si vous fermez la fenêtre, et refaites F6, le flocon reste à la même position. Fichtre. En fait, la formule **  randi() n'est pas complètement aléatoire**. Il est nécessaire de la rafraîchir régulièrement pour qu'elle fonctionne. Avant vos variables, insérez la fonction **  randomize()** qui permet à l’aléatoire d'être remis à jour.
  
-{{:godot_instance_randomize.png?600|godot_instance_randomize.png}}+{{media_04:godot_instance_randomize.png?600|godot_instance_randomize.png}}
  
 Faîtes plusieurs essais avec F6 : le flocon est maintenant distribué aléatoirement sur l'écran ! Faîtes plusieurs essais avec F6 : le flocon est maintenant distribué aléatoirement sur l'écran !
Ligne 122: Ligne 122:
 Retournez sur la **scène "pluie.tscn", et attachez lui un script**. Enlevez les commentaires. Bien. Premièrement, nous allons **importer le flocon dans la pluie**. Pour cela, il faut le charger. Rien de compliqué : une variable nommée flocon, qui charge le chemin de la scène ( donc   <nowiki>res://core/flocon.tscn</nowiki>). Cependant, comme il s'agit d'une scène, il faut l'instancier pour qu'elle fonctionne, en rajoutant la commande **  .instance()** à la fin. Le code ressemble désormais à cela : Retournez sur la **scène "pluie.tscn", et attachez lui un script**. Enlevez les commentaires. Bien. Premièrement, nous allons **importer le flocon dans la pluie**. Pour cela, il faut le charger. Rien de compliqué : une variable nommée flocon, qui charge le chemin de la scène ( donc   <nowiki>res://core/flocon.tscn</nowiki>). Cependant, comme il s'agit d'une scène, il faut l'instancier pour qu'elle fonctionne, en rajoutant la commande **  .instance()** à la fin. Le code ressemble désormais à cela :
  
-{{:godot_instance_soloflocon.png?600|godot_instance_soloflocon.png}}+{{media_04:godot_instance_soloflocon.png?600|godot_instance_soloflocon.png}}
  
 Pour l'instant, nous n'avons fait que charger la scène. Dans la fonction **  _ready():, nous allons maintenant l'ajouter, grâce à la fonction   add_child()** : Pour l'instant, nous n'avons fait que charger la scène. Dans la fonction **  _ready():, nous allons maintenant l'ajouter, grâce à la fonction   add_child()** :
  
-{{:godot_instance_l.png?600|godot_instance_l.png}}+{{media_04:godot_instance_l.png?600|godot_instance_l.png}}
  
 Appuyez maintenant sur F5, et non sur F6. Cela va **lancer la scène "pluie", qui est la scène principale**. Et pouf ! Le flocon apparaît ! Appuyez maintenant sur F5, et non sur F6. Cela va **lancer la scène "pluie", qui est la scène principale**. Et pouf ! Le flocon apparaît !
Ligne 132: Ligne 132:
 C'est assez chouette, mais loin d'être une pluie en bonne et due forme. Il faudrait qu'il y ait d'autres flocons qui apparaissent. Nous allons d'abord essayer d'en ajouter plusieurs à la fois. Pour cela, **supprimons le   .instance()**. Lorsque celui-ci est présent à la fin d'une scène (plus précisément d'une variable qui contient une scène), il permet de l'ajouter à la scène actuellement active. Lorsqu'il en est absent, **il permet d'utiliser la scène comme un modèle** pour créer plusieurs copies de cette scène. C'est assez chouette, mais loin d'être une pluie en bonne et due forme. Il faudrait qu'il y ait d'autres flocons qui apparaissent. Nous allons d'abord essayer d'en ajouter plusieurs à la fois. Pour cela, **supprimons le   .instance()**. Lorsque celui-ci est présent à la fin d'une scène (plus précisément d'une variable qui contient une scène), il permet de l'ajouter à la scène actuellement active. Lorsqu'il en est absent, **il permet d'utiliser la scène comme un modèle** pour créer plusieurs copies de cette scène.
  
-{{:godot_instance_m.png?600|godot_instance_m.png}}+{{media_04:godot_instance_m.png?600|godot_instance_m.png}}
  
 Une fois le modèle prêt, **créons une nouvelle variable et utilisons là pour copier la scène** avant de l'ajouter. Le code sera plus simple à appréhender : Une fois le modèle prêt, **créons une nouvelle variable et utilisons là pour copier la scène** avant de l'ajouter. Le code sera plus simple à appréhender :
  
-{{:godot_instance_flocon1.png?600|godot_instance_flocon1.png}}+{{media_04:godot_instance_flocon1.png?600|godot_instance_flocon1.png}}
  
 Pour l'instant nous n'en avons créé qu'un. **Ajoutons en un deuxième**. Pour l'instant nous n'en avons créé qu'un. **Ajoutons en un deuxième**.
  
-{{:godot_instance_n.png?600|godot_instance_n.png}}+{{media_04:godot_instance_n.png?600|godot_instance_n.png}}
  
 Lancez la scène principale : Lancez la scène principale :
  
-{{:godot_instance_o.png?400|godot_instance_o.png}}+{{media_04:godot_instance_o.png?400|godot_instance_o.png}}
  
 Et voilà ! Nous avons maintenant deux flocons qui s'affichent. Nous pourrions aisément créer de nombreuses variables pour ajouter autant de flocons que nous le souhaitons, mais ce serait fastidieux. Regardons plutôt le code suivant : Et voilà ! Nous avons maintenant deux flocons qui s'affichent. Nous pourrions aisément créer de nombreuses variables pour ajouter autant de flocons que nous le souhaitons, mais ce serait fastidieux. Regardons plutôt le code suivant :
  
-{{:godot_instance_q.png?600|godot_instance_q.png}}+{{media_04:godot_instance_q.png?600|godot_instance_q.png}}
  
 La ligne de code **  for     in   range       ):** permet d'exécuter un bout de code 8 fois. C'est là que nous faisons une petite pause pour parler d**'indentation**. L'indentation est la petite flèche qui apparaît au début de certaines lignes de codes. **Elle permet d'indiquer à quel fonction ce code appartient**. Avant la fonction   _ready():, il n'y a pas d'indentation. Après la fonction   _ready():, dans nos codes précédents, il y a une indentation pour les lignes de code à l'intérieur de la fonction   _ready():. Cela signifie que toute ligne de code qui a une indentation sera exécutée lorsque la fonction   _ready(): sera exécutée (au moment où la scène est lancée). Nous remarquons qu**'il y a une deuxième indentation après la ligne   for     in   range       ):** dans le code ci-dessus. **Ces lignes de codes seront donc toutes exécutées 8 fois**, puisque l'indentation signifie qu**'elles font partie de la fonction   for     in   range       ):**. Pour ajouter une indentation, il faut appuyer sur la touche tabulation. Cependant, Godot les ajouté automatiquement. La ligne de code **  for     in   range       ):** permet d'exécuter un bout de code 8 fois. C'est là que nous faisons une petite pause pour parler d**'indentation**. L'indentation est la petite flèche qui apparaît au début de certaines lignes de codes. **Elle permet d'indiquer à quel fonction ce code appartient**. Avant la fonction   _ready():, il n'y a pas d'indentation. Après la fonction   _ready():, dans nos codes précédents, il y a une indentation pour les lignes de code à l'intérieur de la fonction   _ready():. Cela signifie que toute ligne de code qui a une indentation sera exécutée lorsque la fonction   _ready(): sera exécutée (au moment où la scène est lancée). Nous remarquons qu**'il y a une deuxième indentation après la ligne   for     in   range       ):** dans le code ci-dessus. **Ces lignes de codes seront donc toutes exécutées 8 fois**, puisque l'indentation signifie qu**'elles font partie de la fonction   for     in   range       ):**. Pour ajouter une indentation, il faut appuyer sur la touche tabulation. Cependant, Godot les ajouté automatiquement.
Ligne 154: Ligne 154:
 Si le concept n'est pas encore clair, pas de panique. Pour l'instant, regardons ce qui se passe lorsque nous lançons la scène principale. Si le concept n'est pas encore clair, pas de panique. Pour l'instant, regardons ce qui se passe lorsque nous lançons la scène principale.
  
-{{:godot_instance_p.png?400|godot_instance_p.png}}+{{media_04:godot_instance_p.png?400|godot_instance_p.png}}
  
 Parfait, il y a maintenant bien huit flocons qui apparaissent à l'écran. Malgré tout, cela reste beaucoup trop statique. Nous allons maintenant voir comment **Godot permet d'agir dans le temps**, en utilisant le pendant de la fonction   _ready():, la fonction **  _fixed_process(delta):** . Parfait, il y a maintenant bien huit flocons qui apparaissent à l'écran. Malgré tout, cela reste beaucoup trop statique. Nous allons maintenant voir comment **Godot permet d'agir dans le temps**, en utilisant le pendant de la fonction   _ready():, la fonction **  _fixed_process(delta):** .
Ligne 160: Ligne 160:
 Avant tout, il faut l'activer et la créer, comme cela : Avant tout, il faut l'activer et la créer, comme cela :
  
-{{:godot_instance_r.png?600|godot_instance_r.png godot_instance_r.png}}+{{media_04:godot_instance_r.png?600|godot_instance_r.png godot_instance_r.png}}
  
 Plusieurs choses sont importantes ici. Tout d'abord, pour revenir au concept d'indentation, **regardez la ligne 11. Il n'y a pas d'indentation**. Cela permet d'indiquer à Godot que **la fonction   _ready(): est terminée**. C'est pour la même raison que la ligne de code **  set_fixed_process(true) n'a qu'une seule indentation** : elle ne fait pas partie de   for     in   range       ): car elle ne doit être exécutée qu'une seule fois. Plusieurs choses sont importantes ici. Tout d'abord, pour revenir au concept d'indentation, **regardez la ligne 11. Il n'y a pas d'indentation**. Cela permet d'indiquer à Godot que **la fonction   _ready(): est terminée**. C'est pour la même raison que la ligne de code **  set_fixed_process(true) n'a qu'une seule indentation** : elle ne fait pas partie de   for     in   range       ): car elle ne doit être exécutée qu'une seule fois.
Ligne 168: Ligne 168:
 La fonction **  _fixed_process(delta):** est particulièrement utile : c'est une fonction qui, si elle est activée, **s'exécutera à chaque frame du jeu**, c'est-à-dire, par défault, 25 fois par seconde. Faisons un essai, et utilisons là pour ajouter un nouveau flocon. Lancez ensuite l'application. La fonction **  _fixed_process(delta):** est particulièrement utile : c'est une fonction qui, si elle est activée, **s'exécutera à chaque frame du jeu**, c'est-à-dire, par défault, 25 fois par seconde. Faisons un essai, et utilisons là pour ajouter un nouveau flocon. Lancez ensuite l'application.
  
-{{:godot_instance_process.png?600|godot_instance_process.png godot_instance_process.png}}+{{media_04:godot_instance_process.png?600|godot_instance_process.png godot_instance_process.png}}
  
 On ne saurait être plus clair ! **25 fois par seconde, une copie de la scène flocon est ajoutée à la scène pluie**. Cela commence à ressembler à quelque chose. Mais l'écran est rapidement rempli. Le mieux serait de faire disparaître le flocon peu à peu, comme s'il fondait. Pour cela, ce n'est pas la pluie qu'il faut modifier, mais le flocon lui-même. Cliquez sur "flocon.gd", dans le menu à gauche du script. On ne saurait être plus clair ! **25 fois par seconde, une copie de la scène flocon est ajoutée à la scène pluie**. Cela commence à ressembler à quelque chose. Mais l'écran est rapidement rempli. Le mieux serait de faire disparaître le flocon peu à peu, comme s'il fondait. Pour cela, ce n'est pas la pluie qu'il faut modifier, mais le flocon lui-même. Cliquez sur "flocon.gd", dans le menu à gauche du script.
  
-{{:godot_instance_gd.png?400|godot_instance_gd.png godot_instance_gd.png}}+{{media_04:godot_instance_gd.png?400|godot_instance_gd.png godot_instance_gd.png}}
  
 Rajoutez lui une variable **  opacite** (sans accent) égale à 1, et activez sa fonction **  _fixed_process(delta):**. Rajoutez lui une variable **  opacite** (sans accent) égale à 1, et activez sa fonction **  _fixed_process(delta):**.
  
-{{:godot_instance_t.png?600|godot_instance_t.png godot_instance_t.png}}+{{media_04:godot_instance_t.png?600|godot_instance_t.png godot_instance_t.png}}
  
 **L'opacité est la valeur de transparence d'une image.** À 1, elle est complètement opaque, à 0, elle devient complètement transparente. Nous allons effectuer une opération intéressante : **L'opacité est la valeur de transparence d'une image.** À 1, elle est complètement opaque, à 0, elle devient complètement transparente. Nous allons effectuer une opération intéressante :
  
-{{:godot_instance_u.png?600|godot_instance_u.png godot_instance_u.png}}+{{media_04:godot_instance_u.png?600|godot_instance_u.png godot_instance_u.png}}
  
 **  if** est un outil très utilisé en code. Il permet d'effectuer une opération **si et seulement si sa condition est respectée**. La condition qui lui est ici assignée est le fait qu**'  opacite soit supérieure à 0**. **Tant qu'  opacite sera supérieure à 0**, elle effectuera les deux opération qui suivent (et qui sont indentées puisqu'elles appartiennent à   if). D'abord   opacite est baissée de 0.05, puis l'opacité du Sprite est changée pour la valeur actuelle d'  opacite, grâce à la fonction **  set_opacity()**. Ainsi, à chaque frame, l'opacité du Sprite sera baissée de 0.05 jusqu'à ce qu'il devienne transparent. Lancez la pluie avec F5. **  if** est un outil très utilisé en code. Il permet d'effectuer une opération **si et seulement si sa condition est respectée**. La condition qui lui est ici assignée est le fait qu**'  opacite soit supérieure à 0**. **Tant qu'  opacite sera supérieure à 0**, elle effectuera les deux opération qui suivent (et qui sont indentées puisqu'elles appartiennent à   if). D'abord   opacite est baissée de 0.05, puis l'opacité du Sprite est changée pour la valeur actuelle d'  opacite, grâce à la fonction **  set_opacity()**. Ainsi, à chaque frame, l'opacité du Sprite sera baissée de 0.05 jusqu'à ce qu'il devienne transparent. Lancez la pluie avec F5.
  
-{{:godot_instance_pluie.png?400|godot_instance_pluie.png godot_instance_pluie.png}}+{{media_04:godot_instance_pluie.png?400|godot_instance_pluie.png godot_instance_pluie.png}}
  
 Bravo ! Le programme semble terminée, mais une dernière chose reste à régler. Si les Sprites disparaissent bien à l’œil, ils sont en fait gardés en mémoire. Comme ils ne servent plus à rien une fois qu'ils sont devenus transparents, nous allons les supprimer grâce à l'outil **  else** : Bravo ! Le programme semble terminée, mais une dernière chose reste à régler. Si les Sprites disparaissent bien à l’œil, ils sont en fait gardés en mémoire. Comme ils ne servent plus à rien une fois qu'ils sont devenus transparents, nous allons les supprimer grâce à l'outil **  else** :
  
-{{:godot_instance_v.png?600|godot_instance_v.png godot_instance_v.png}}+{{media_04:godot_instance_v.png?600|godot_instance_v.png godot_instance_v.png}}
  
 **  else ne s'utilise qu'après   if**. Il permet d'effectuer une opération **si les conditions d'  if ne sont pas remplies**. Ici, si la valeur d'  opacite est supérieure à 0, la ligne de code   queue_free() ne sera pas exécutée. Mais **si   opacite devient égale ou inférieure à 0**, alors ce sont **les deux lignes de codes qui suivent   if qui ne seront pas exécuté, et   queue_free() sera exécuté à la place**. **  queue_free() est une fonction qui permet de supprimer une scène** lorsqu'elle n'est plus utile. Ainsi, nous pourrions laisser la pluie tourner des heures durant, elle ne surchargerait pas la mémoire de l'ordinateur. **  else ne s'utilise qu'après   if**. Il permet d'effectuer une opération **si les conditions d'  if ne sont pas remplies**. Ici, si la valeur d'  opacite est supérieure à 0, la ligne de code   queue_free() ne sera pas exécutée. Mais **si   opacite devient égale ou inférieure à 0**, alors ce sont **les deux lignes de codes qui suivent   if qui ne seront pas exécuté, et   queue_free() sera exécuté à la place**. **  queue_free() est une fonction qui permet de supprimer une scène** lorsqu'elle n'est plus utile. Ainsi, nous pourrions laisser la pluie tourner des heures durant, elle ne surchargerait pas la mémoire de l'ordinateur.
Ligne 194: Ligne 194:
 Pour terminer, je vous laisse essayer le code suivant et comprendre par vous-même ce qu'il change au programme : Pour terminer, je vous laisse essayer le code suivant et comprendre par vous-même ce qu'il change au programme :
  
-{{:godot_instance_final.png?600|godot_instance_final.png godot_instance_final.png}}+{{media_04:godot_instance_final.png?600|godot_instance_final.png godot_instance_final.png}}
  
 ===== Conclusion ===== ===== Conclusion =====
godot_scenes_et_scripts.txt · Dernière modification : 2020/10/28 12:14 de serge