Share
Bienvenue à la deuxième partie de la Comment souffler avec le SDK Corona série de tutoriels. Dans ce tutoriel, nous allons améliorer notre application de démonstration de la partie I en permettant à l'utilisateur de placer un graphique d'une bombe sur l'écran avec une explosion retardée. Nous allons également modifier l'effet d'explosion afin que de temps en temps les caisses explosent au lieu de simplement quitter l'écran..
Dans la partie I de cette série, nous avons eu une idée de la façon de configurer un environnement dynamique avec la bibliothèque de physique facile à utiliser de Corona. L'environnement comprenait des objets statiques, tels que le sol, et des objets dynamiques générés par programme, tels que des caisses. Un événement tactile de l'utilisateur générerait alors une force explosive qui ferait voler les caisses. Si vous n'avez pas encore lu la partie I, je vous suggère de le faire avant de continuer. Le lecteur devrait avoir une certaine compréhension des concepts de physique essentiels expliqués dans la première partie pour pouvoir comprendre la deuxième partie..
Commençons par un bref rappel de la configuration de notre environnement physique dans la partie I. Nous inclurons notre ensemble de caisses générées par programme qui sont empilées et reposent sur notre sol:
Accentsconagua
physics local = require ("physics") physics.start () physics.setScale (40) display.setStatusBar (display.HiddenStatusBar) - Le dernier paramètre "true" annule la mise à l'échelle automatique de grandes images de Corona local background = display.newImage ("bricks.png", 0, 0, true) background.x = display.contentWidth / 2 background.y = display.contentHeight / 2 local floor = display.newImage ("floor.png", 0, 280, true) physics.addBody (sol, "statique", friction = 0.5) caisses locales = pour i = 1, 5 pour j = 1, 5 pour les caisses [i] = display.newImage ("crate.png", 140 + (i * 50), 220 - (j * 50)) physics.addBody (caisses [i], densité = 0,2, frottement = 0,1, rebond = 0,5) fin fin 
Tous les rouages du code ci-dessus sont expliqués en détail dans la première partie du didacticiel, alors vérifiez-le en cas de confusion..
Pour notre première étape, nous allons ajouter une petite mise à jour graphique à notre méthode setBomb. Au lieu d'un événement tactile générant immédiatement l'explosion, nous allons placer une bombe sur l'écran en tant que son propre objet physique:
fonction locale setBomb (événement) si (événement.phase == "commencé"), puis bombe locale = display.newImage ("bomb.png", événement.x, événement.y) physics.addBody (bombe, densité = 0.2, friction = 0.1, rebond = 0.5) arrière-plan d'extrémité: addEventListener ("touch", setBomb) 
Comme auparavant, nous ajoutons un écouteur d'événements à l'arrière-plan pour surveiller tout événement tactile et activer la méthode setBomb lorsqu'elle se produit. A l'intérieur de la méthode, nous isolons toute activité de la phase "commencée" de l'événement. Si nous n'isolions pas cette phase, le code serait exécuté plusieurs fois, car les événements tactiles comportaient plusieurs phases..
La méthode setBomb telle qu'elle existe actuellement fait très peu. Il charge un joli graphique de bombe et l'ajoute à l'écran en tant qu'objet de physique dynamique. Nous allons maintenant intégrer notre méthode d'explosion dans le code en tant que fonction locale appelée blast:
cercle local = "" explosion locale "" explosion de fonction locale cercle (cercle) = display.newCircle (bomb.x, bomb.y, 80) explosion = display.newImage ("explosion.png", bomb.x, bomb. y) circle: setFillColor (0,0,0, 0) physics.addBody (circle, "static", isSensor = true) circle.myName = "circle" circle.collision = onLocalCollision circle: addEventListener ("collision", cercle) fin de souffle () L'objet cercle nous aide ici à calculer notre rayon de souffle. Nous ajoutons un écouteur d’événement de collision pour détecter laquelle des caisses se trouve dans la zone d’explosion. De plus, nous ajoutons également un graphique d'explosion à l'écran dans la même position que le graphique de la bombe une fois que l'explosion a été déclenchée..
Si vous essayez le code à ce stade, vous remarquerez que tout se passe très rapidement et que certains graphiques d'artefacts sont laissés pour compte. Pour le rendre plus suspensif, nous allons remplacer notre appel de fonction "blast ()" par une minuterie qui retardera l’explosion de la bombe de 3 secondes:
timer.performWithDelay (3000, souffle)
Aussi simple que cela! La classe timer a une fonction appelée performWithDelay () avec deux paramètres: le nombre de millisecondes à attendre et la méthode à appeler. Donc, dans ce cas, les 3 000 millisecondes sont égales à 3 secondes entières de retard.
Comme la bombe va exploser après le délai de 3 secondes, nous devons supprimer cet objet de l'écran une fois que l'explosion a eu lieu. Cela peut être fait très facilement. Tous les objets présents à l'écran sont fournis avec une fonction pratique removeSelf (). Une fois qu'un objet s'est retiré de l'écran, le moteur physique est suffisamment intelligent pour le ramasser et le supprimer de tous les calculs physiques. On peut ajouter la ligne suivante au bas de la fonction blast:
bombe: removeSelf ()
En plus de retirer la bombe, nous allons supprimer notre objet rayon de rayon de l'explosion circulaire ainsi que le graphique d'explosion ajouté pour effet. Comme nous devons donner à notre cercle de rayon de souffle un peu de temps pour créer des collisions avec nos caisses, nous allons le supprimer 1 / 10ème de seconde après l’appel de la fonction de souffle. Ceci peut être accompli en remplaçant notre appel de fonction de soufflage temporisé par le code suivant:
fonction locale removeStuff (event) circle: removeSelf () explosion: removeSelf () fin timer.performWithDelay (3000, Explosion) timer.performWithDelay (3100, removeStuff)
Comme vous pouvez le constater, nous appelons la fonction de déclenchement au bout de 3 secondes après avoir touché l'écran de la même manière que nous le faisions auparavant. Nous avons maintenant ajouté un autre appel retardé qui est exécuté 3,1 secondes après avoir touché l'écran qui nettoie nos objets restants avec la fonction removeSelf ()..
La fonction entière que nous avons créée ressemble à ceci:
fonction locale setBomb (événement) si (événement.phase == "commencé"), puis bombe locale = display.newImage ("bomb.png", événement.x, événement.y) physics.addBody (bombe, densité = 0.2, friction = 0.1, rebond = 0.5) cercle local = "" explosion locale = "" explosion de la fonction locale (événement) media.playEventSound (explosionSound) cercle = display.newCircle (bomb.x, bomb.y, 80) explosion = display .newImage ("explosion.png", bomb.x, bomb.y) bombe: removeSelf () cercle: setFillColor (0,0,0, 0) physics.addBody (cercle, "statique", isSensor = true) circle.myName = "circle" circle.collision = onLocalCollision circle: addEventListener ("collision", circle) termine la fonction locale removeStuff (event) circle: removeSelf () explosion: removeSelf () termine timer.performWithDelay (3000, souffle) timer. performWithDelay (3100, removeStuff) extrémité arrière-plan: addEventListener ("touch", setBomb) Dans la partie I de notre didacticiel, notre fonction de détection de collision ressemblait à ceci:
fonction locale onLocalCollision (self, event) if (event.phase == "commencé" et self.myName == "circle"), puis forcex locale = event.other.x-self.x locale forcey = event.other.y- self.y if (forcex < 0) then forcex = 0-(80 + forcex)-12 else forcex = 80 - forcex+12 end event.other:applyForce( forcex, forcey, self.x, self.y ) end end
Il a simplement trouvé toutes les caisses situées dans notre rayon de souffle et a appliqué une force pour les détourner de l'épicentre de l'explosion. Pour rendre les choses plus intéressantes, nous allons ajouter un seuil de destruction aux caisses qui les fera exploser si la force qui leur est appliquée est suffisante. Cela peut être fait comme ça:
if (math.abs (forcex)> 60 ou math.abs (forcey)> 60), puis explosion locale = display.newImage ("explosion.png", event.other.x, event.other.y) event.other: Fonction locale de removeSelf () removeExplosion (événement) explosion: fin de removeSelf () timer.performWithDelay (100, removeExplosion) end Nous devons observer la force que nous avons appliquée à chacune des caisses pour détecter si elle est supérieure à 60. 60 dans ce cas en un nombre arbitraire basé sur notre calcul de force. Nous utilisons la fonction math.abs pour obtenir la valeur absolue de la force. Dans notre exemple, les forces peuvent être positives ou négatives en fonction de la direction de la force appliquée. Nous ne sommes pas inquiets quant à la direction à suivre dans ce cas. Nous voulons simplement savoir si la force dépasse le seuil de 60. N'hésitez pas à jouer avec ce nombre de seuil pour changer la force ou la force des caisses..
Dans la partie I, notre force d’explosion était calculée de manière à diminuer la distance entre une caisse et l’épicentre de l’explosion. Ainsi, les caisses les plus proches de l'épicentre ont une probabilité plus grande d'être détruites et les autres disparaîtront simplement de l'écran. Comme nous le faisions auparavant avec notre classe de minuterie, nous affichons un graphique d'explosion dans l'ancienne position d'une caisse détruite, puis nous le retirons de l'écran un dixième de seconde plus tard. La méthode de détection de collision finale ressemblera à ceci:
fonction locale onLocalCollision (self, event) if (event.phase == "commencé" et self.myName == "circle"), puis forcex locale = event.other.x-self.x locale forcey = event.other.y- self.y if (forcex < 0) then forcex = 0-(80 + forcex)-12 else forcex = 80 - forcex+12 end event.other:applyForce( forcex, forcey, self.x, self.y ) if(math.abs(forcex) > 60 ou math.abs (forcey)> 60) puis explosion locale = display.newImage ("explosion.png", event.other.x, event.other.y) event.other: removeSelf () fonction locale removeExplosion (event) explosion: removeSelf () end timer.performWithDelay (50, removeExplosion) fin fin 
En guise de dernière étape de notre didacticiel, nous allons jouer un effet sonore d'explosion lorsque notre bombe explose. Comme tout le reste à Corona, il est étonnamment simple de le faire. Nous allons commencer par inclure la médiathèque en haut de notre projet et précharger notre fichier son:
média local = nécessite ("média") explosionSound local = media.newEventSound ("explosion.mp3") Pour jouer le son, nous allons ajouter la ligne suivante à notre fonction blast () qui se trouve dans notre fonction setBomb ():
explosion de la fonction locale (événement) media.playEventSound (explosionSound)? fin
Désormais, chaque fois que la fonction blast () est appelée, elle utilisera la fonction playEventSound de la médiathèque pour lire notre fichier audio "explosion.mp3". Cela ne pourrait pas être plus facile si nous essayions!
Et là nous l'avons! Nous avons maintenant un exemple plus complet de la facilité avec laquelle il est facile de créer des explosions sur la plateforme Corona. N'hésitez pas à télécharger les zips de la partie I et de la partie II du didacticiel et à vous amuser!
