Introduction au chronomètre/temp

3

Statistiques

1,636 visites, 2,208 vues

Outils

Partager

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 15 Jun, 2021.

INTRO

Bien qu'il existe des didacticiels sur les minuteries ici, nous allons explorer différentes choses que vous pouvez faire avec les minuteries.

La variable de temps est une variable intégrée qui commence chaque fois que le jeu démarre. Avec cette variable, vous pouvez

1. prendre le temps de combien de temps le jeu est en cours d'exécution. Dans certains jeux, les joueurs obtiennent des points lorsqu'ils sont capables de survivre ou de continuer à jouer aussi longtemps qu'ils le peuvent.

2. enregistrez l'heure actuelle dans une variable globale à des fins ultérieures, par exemple pour faire quelque chose pendant x secondes. Un exemple est le temps de vitesse de l'hyperespace que j'ai utilisé dans l'un de mes autres tutoriels. Une autre idée serait d'utiliser la variable à des fins de compte à rebours.

METTRE EN PLACE

Créez un nouveau projet, laissez la taille de la fenêtre/disposition telle quelle.

Insérez un objet texte et nommez-le "Timer_txt"

Dans la feuille d'événement, nous dirons à Construct 2 de nous montrer l'heure.

Condition : Système -> À chaque tick

Action : Timer_txt -> Définir le texte sur l'heure

Lancez le jeu en appuyant sur F5.

Remarque : si vous ne voyez rien, vérifiez si la longueur de votre objet texte n'est pas trop étroite.

Vous verrez un nombre flottant indiquant les secondes et les millisecondes. Pas de minutes, ni d'heures, etc.

Remplacez le terme de temps par (int(time)) et l'objet texte affichera les secondes.

Changez à nouveau le terme en zeropad(int(time),2) et maintenant nous verrons des zéros non significatifs en raison de la fonction zeropad, qui est définie sur 2, ce qui signifie remplir avec des zéros non significatifs, jusqu'à ce que le nombre soit composé de deux chiffres .

Pour afficher les minutes et les heures, nous avons besoin de quelques calculs, car après 59 secondes, le temps continuera avec 60, 61, etc...

Nous aimerions voir quelque chose comme 1h30 ou même 01h30 (avec des zéros non significatifs, bien sûr).

Ici, l'opérande modulo (%) va nous aider. En terme mathématique, il renverra le reste d'un calcul de division. Exemples:

5%2 = 1 (5 divisé par 2 est 2, au repos 1)

10%6 = 4 (10 divisé par 6 est 1, au repos 4)

Pour calculer avec le temps, nous avons besoin de modulo 60 :

5%60 = 5 (5 divisé par 60 est 0 minutes, repos 5 secondes)

59 %60 = 59

60%60=0 (60 divisé par 60 est 1 minute, repos 0 seconde)

61%60=1 (1 minute, 1 seconde)

etc...

formule pour les secondes

temps % 60

formule pour les minutes

temps/60 % 60

Pour l'objet texte, nous allons définir le terme

zeropad(int(time/60% 60), 2) & ":" & zeropad(int(time%60), 2)

Remarque : dans d'autres tutoriels ou forums, certains utilisent le sol au lieu de int. Vous pouvez utiliser n'importe lequel.

DÉMARRER / ARRÊTER / REDÉMARRER

Utilisons maintenant les déclencheurs !

Chaque fois que quelque chose se passe (via un déclencheur avec appuyez sur un bouton, tuant un monstre, peu importe !), l'heure actuelle est enregistrée et dure un certain temps jusqu'à ce que le prochain déclencheur s'active pour arrêter le décompte du temps.

Dans la fenêtre Mise en page, insérez un bouton avec

- le nom "SSR"

- la propriété Text "Start/Stop/Restart" au lieu de "OK"

- variable d'instance appelée "checkit"

Insérez ensuite un nouveau texte avec le nom SSR_Timer_txt

Dans la feuille d'événement, ajoutez une variable globale appelée "Timer_SSR".

Que voulons-nous faire :

1. Lorsque le bouton est cliqué, l'heure actuelle est enregistrée dans Timer_SSR

2. Le checkit est défini sur 1, pour indiquer à Construct 2 qu'il a été pressé une fois

3. La zone de texte affichera une nouvelle horloge à partir de 00:00 (en soustrayant l'heure de référence dans Timer_SSR de l'heure actuelle), uniquement si checkit=1

4. Lorsque le bouton est cliqué à nouveau, checkit sera défini sur 0. Le temps de la zone de texte ne continuera pas à compter.

5. Si vous appuyez à nouveau sur le bouton, tout recommencera à partir de 0 (car l'heure actuelle est enregistrée dans Timer_SSR !)

Plus tard, nous verrons comment arrêter le temps et continuer à compter le temps sans réinitialiser.

Ajoutons donc en conséquence quelques événements :

Condition : Bouton SSR -> Sur cliqué

1er sous-événement : Bouton SSR -> Comparer la variable d'instance -> checkit = 0

Actions : Système -> Définir la valeur -> Timer_SSR -> heure

Bouton SSR -> Définir la valeur de checkit sur 1

Ajouter un else au premier sous-événement et la condition supplémentaire

Bouton SSR -> Comparer la variable d'instance -> checkit = 1

Action : Bouton SSR -> Définir la valeur de checkit sur 0

Bien, ajoutons maintenant le sous-événement suivant Every tick-condition :

Bouton SSR -> Comparer la variable d'instance -> checkit = 1

Action : SSR_Timer_txt -> Définir le texte sur zeropad(floor((time-Timer_SSR)/60% 60), 2) & ":" & zeropad(floor((time-Timer_SSR)%60), 2)

Exécutez et testez!

Cliquez d'abord : la minuterie commence à compter à partir de 0

Cliquez à nouveau : la minuterie arrête de compter

Cliquez une troisième fois : la minuterie recommence à compter à partir de 0

DÉMARRER / ARRÊTER / CONTINUER

Pour accélérer les choses, nous allons cloner le bouton SSR et le texte dans la mise en page. Utilisez le bouton droit de la souris au-dessus d'un objet et sélectionnez "Cloner le type d'objet". Cela créera des objets complètement nouveaux et non une nouvelle instance de ces objets.

Modifiez les noms des boutons et des objets texte de "SSR2" à "SSC".

Renommez le texte du bouton en "Start/Stop/Cont."

Ajoutez au bouton une nouvelle variable d'instance appelée "memorize_me"

Dans la feuille d'événement, ajoutez la variable globale Timer_SSC.

Vous pouvez copier l'intégralité du code Button SSR et le dupliquer par copier-coller (pour sélectionner l'intégralité du code, cliquez sur la flèche verte à gauche de l'événement).

Il faut cliquer sur chaque événement et action pour le changer en conséquence de SSR à SSC !

Faites de même avec le sous-événement dans "Chaque tick". Copiez-le et collez-le et renommez SSR en SSC en conséquence.

Votre fenêtre de code d'événement devrait maintenant ressembler à ceci :

TESTEZ D'ABORD AVANT DE CONTINUER

Cliquez sur les boutons pour voir si les deux réagissent de la même manière. Lorsque tout va bien, nous devons implémenter la variable memorize_me.

Jetez un œil à ce tableau pour comprendre ce qui se passe :

Le temps commence à courir à partir de 0 lorsque le jeu commence.

Dès que le bouton SSR est déclenché, le temps est enregistré dans la variable. La différence avec le temps, c'est le nouveau compteur ! A la seconde 9, on appuie sur le bouton et le compteur s'arrête. Quand on appuie à nouveau sur la seconde 14, tout recommence. temps (14) - Timer_SSR (14) = 0

Avec le bouton SSC, nous voulons réaliser quelque chose de différent. Lorsque nous nous arrêtons à la seconde 9, la variable memorize_me obtient le décalage horaire, qui peut ensuite être transmis à la seconde 14. Maintenant, le compteur peut continuer à partir de 6.

Remarque : vous remarquerez peut-être que les calculs sont corrects dans la capture d'écran Excel. Mais le compteur ne restera pas sur 6 secondes deux fois plus de temps ! Pourquoi? Parce que le bouton ne se déclenche pas exactement à ce moment-là ! Au lieu de cela, il pourrait être à 5,2 ou 5,8. Et il continuera à compter à partir de ce moment-là.

Nous pouvons laisser les événements Every tick tels qu'ils sont. La seule modification est effectuée lorsque nous devons enregistrer la valeur déclenchée dans memorize_me et lorsque la minuterie doit redémarrer, où nous insérons également la valeur memorize_me. Voici le code :

AUTRES UTILISATIONS PRATIQUES AVEC BARRES ET JAUGES

Je vais vous montrer comment utiliser les deux boutons comme déclencheurs pour remplir la jauge de réservoir ou augmenter une barre de santé ou de temps. Les deux résultats peuvent sembler similaires, mais

- appuyer sur le bouton 1 remplira toujours la jauge - remettre le temps à 0 n'aura aucun effet sur la jauge

--> La fonction du bouton 1 est de faire le plein ! L'aiguille du réservoir monte en conséquence, garde sa position lorsque le bouton 1 est à nouveau cliqué et ne revient pas à 0.

- l'appui sur le bouton 2 est différent. La barre verte (c'est sa largeur, en fait) assumera toujours le réglage du bouton 2 fois. Je l'ai réglé pour remplir la barre dans les 30 secondes.

BARRE DE SANTÉ VERTE

Nous remplirons la barre verte de santé dans les 30 secondes lorsque le bouton SSC (Démarrer / Arrêter / Continuer) est cliqué. Chaque fois que le bouton SSC est cliqué, la barre verte s'arrête de bouger. Un autre clic continue sa croissance et ainsi de suite. Cela se produit jusqu'à ce que la barre verte atteigne la largeur de la barre grise. Le compteur continuera, mais la barre verte cessera de bouger lorsque la pleine largeur sera atteinte.

Nous aurons besoin des deux images suivantes :

Bar_fg

Bar_bg

Chargez-les dans le calque en tant que sprites. Leurs points d'origine sont centrés - définissez leurs coordonnées x sur 0. Positionnez-les dans la mise en page avec les mêmes coordonnées et vous verrez qu'ils correspondront parfaitement les uns au-dessus des autres. Bien sûr, Bar_fg devrait être au-dessus de Bar_bg.

Dans la feuille d'événement, nous allons définir la barre de premier plan (verte) sur une largeur de 0.

Condition : Système -> Au début de la mise en page

Action : Bar_fg -> Définir la largeur sur 0

Dans l'événement Every tick, ajoutez un sous-événement sous le SSC / checkit=1-event :

Condition : Bar_fg -> Comparer la largeur -> Inférieur ou égal à Bar_bg.Width

Action : Bar_fg -> Définir la largeur sur (time-Timer_SSC)[]Bar_bg.Width/30*

DÉPLACEMENT DE L'AIGUILLE DE LA JAUGE

Ici, nous allons faire quelque chose de différent. Notre réservoir "carburant" est vide. Avec le bouton SSR (Start / Stop / Restart) nous allons remplir le réservoir. Un deuxième clic sur le bouton arrêtera le mouvement de l'aiguille. Un troisième clic pour remettre l'aiguille à sa position d'origine et recommencer le remplissage.

Nous faisons cela pour que vous compreniez la différence.

Chargez la jauge et l'aiguille des objets sprite et positionnez-les en conséquence.

Dans la feuille Événement, nous allons tourner l'aiguille en position Vide (à 302°). Ajoutez une action au début de l'événement de mise en page.

Action : Aiguille -> Définir l'angle à 302 degrés

Dans l'événement Every tick, ajoutez un sous-événement sous le SSR / checkit=1-event :

Condition : Aiguille -> Est entre les angles -> 302 et 57

Action : Aiguille -> Faire pivoter de 5[]dt degrés dans le sens des aiguilles d'une montre*

Enfin lorsque le compteur est remis à zéro, l'aiguille revient à 302°, c'est-à-dire en position vide.

Sous le SSR on clicked-event et sous le sous-événement checkit=1, ajoutez l'action suivante :

Aiguille -> Régler l'angle à 302 degrés

Code complet :

Vérifiez les comportements comme décrit !

Disabled Comments have been disabled by the owner.