Share
Dans cette série de didacticiels, nous allons créer un jeu Whack-a-Groundhog. L'objectif du jeu est de taper sur les marmottes avant qu'elles ne disparaissent. Continuer à lire!
Dans la partie précédente de cette série, nous avons ajouté l’arrière-plan du jeu et commencé à animer nos marmottes. Dans cette partie finale de la série, nous allons implémenter le gameplay, les options et l'écran de démarrage de notre application, puis un jeu complet.!
Comme le jeu est maintenant, les marmottes s'animent pour toujours et ne semblent pas retourner dans leurs trous. Nous devons ajouter quelques clés supplémentaires à notre sequenceData pour résoudre ce problème. Ajouter ce qui suit dans le setupGameScreen () une fonction:
séquence localeData = nom = "show", début = 2, compte = 3, temps = 800, loopCount = 1, loopDirection = "bounce", nom = "vide", début = 1, compte = 1, name = "hit1", début = 5, compte = 1, name = "hit2", début = 6, compte = 1, name = "hit3", début = 7, compte = 1
La séquence "vierge" est une image transparente vierge qui fait partie de la feuille de sprite, et les séquences "hit1", "hit2" et "hit3" sont trois états "différents" de la marmotte. Regardez l'image "groundhogsheet.png" pour voir cela par vous-même.
Assurez-vous de définir le loopCount égal à 1 sur la séquence "show".
Maintenant changez le bloc de code suivant:
Accentsconagua
tempGroundHog: setSequence ("vide") tempGroundHog: addEventListener ('tap', groundHogHit); Ici, nous avons défini la séquence sur "blanc" et avons ajouté un écouteur de frappe au sprite marmotte.
Ensuite, supprimez la ligne de code suivante:
tempGroundHog: play ()
Si vous testez maintenant, aucune des marmottes ne devrait s'animer. Nous allons bientôt avoir une marmotte au hasard animant!
Lorsque la marmotte est exploitée, nous déterminerons si elle était ou non sortie de son trou. Si tel est le cas, nous modifierons sa séquence en l’un des trois états d’attraction que nous avons ajoutés à l’étape précédente..
Ajouter ce qui suit à l'intérieur du groundHogHit () une fonction:
local thisSprite = e.target thisSprite: removeEventListener ("sprite", groundHogSpriteListener) fonction locale hide () thisSprite: setSequence ("blanc") end if (thisSprite.sequence == "show") puis local randomIndex = math.random (3). ) thisSprite: setSequence ("hit"… randomIndex) timer.performWithDelay (1000, masquer) fin Ici, nous référons le Sprite qui a été cliqué par e.target et retirez son écouteur d'événements. Nous vérifions ensuite si sa séquence est égale à "show". Si tel est le cas, nous générons un nombre compris entre 1 et 3 et fixons sa séquence à "hit"… randomIndex. Tout cela ne fait que générer les chaînes "hit1", "hit2" ou "hit3". Enfin, nous appelons la fonction de masquage local après 1000 millisecondes, ce qui définit la séquence Sprites sur "vide"..
le getRandomGroundHog () fonction obtient une marmotte au hasard et lui permet de commencer à animer. Entrez les informations suivantes dans le Fonction getRandomGroundHog ():
local randomIndex = math.random (#allGroundHogs) local randomGroundHog = tousGroundHogs [randomIndex] if (randomGroundHog.sequence ~ = "blank"), puis la traduction de. ) randomGroundHog: play () end
Ici nous avons un randomIndex du allGroundHogs table. Ensuite, nous définissons la randomGroundHog égal à l'indice. Nous vérifions ensuite si sa séquence n’est pas égale à "blanc" et si ce n’est pas le cas, nous appelons getRandomGroundHog () encore. Sinon, nous ajoutons le groundHogSpriteListener pour définir sa séquence à "show" et jouer la séquence.
le groundHogSpriteListener () vérifie si la séquence "show" a fini de jouer. Si tel est le cas, il définit la séquence "vierge". Entrez les informations suivantes dans le groundHogSpriteListener ():
local thisSprite = event.target - "event.target" fait référence à l'image-objet if (event.phase == "terminé"), puis if (thisSprite.sequence == "show"), puis thisSprite: setSequence ("blank") end - - fin d'une demi seconde Avec tout ce qui précède en place, nous obtenons une animation aléatoire de la marmotte. Ajouter ce qui suit au bas de lasetUpGameScreen () une fonction:
groundHogTimer = timer.performWithDelay (groundHogSpeed, getRandomGroundHog, 0)
Si vous testez maintenant, vous devriez voir les marmottes sortir de leur trou au hasard. Pendant que vous y êtes, essayez de cliquer sur les marmottes pendant qu'elles sont sorties de leurs trous. Vous devriez voir l'un des 3 états à succès, puis l'état vide.
Lorsque vous avez terminé les tests, supprimez la ligne que vous venez de saisir. Nous n'en avions besoin que pour les tests.
Dans cette étape, nous allons commencer à configurer l'écran d'introduction. Entrez le code suivant à l'intérieur du setUpIntroScreen une fonction:
media.playSound ("gameTrack.mp3", soundComplete) introScreenGroup = display.newGroup () local titleScreen = display.newImage ("titleScreen.png") local playButton = display.newImage ("playButton.png", 100,100) local optionsButton display.newImage ("optionsButton.png", 100,170) introScreenGroup: insert (titleScreen) introScreenGroup: insert (playButton) introScreenGroup: insert (optionsButton) Ici, nous commençons la bande son, configurons l’écran d’introduction et ajoutons le Bouton jouer et optionsBouton graphique.
Appelez maintenant le setUpIntroScreen () fonction sous l'endroit où vous appelez le setUpGameScreen () une fonction…
setUpGameScreen () setUpIntroScreen ()
Si vous testez maintenant, vous devriez voir l'écran d'introduction. Nous devons ajouter des écouteurs d'événement aux boutons et c'est ce que nous ferons dans les prochaines étapes..
Entrez les informations suivantes sous le code que vous avez entré à l'étape ci-dessus:
playButton: addEventListener ("tap", function () transition.to (introScreenGroup, heure = 300, x = -480, onComplete = fonction () groundHogTimer = timer.performWithDelay (groundHogSpeed, getRandomGroundHog, 0) end) est fin ) Lorsque vous appuyez sur le bouton de lecture, nous animons l'écran d'introduction à gauche, définissons notre groundHogTimer pour générer des marmottes aléatoires, puis définissez la est en train de jouer variable à true.
Si vous testez maintenant, vous devriez pouvoir démarrer un nouveau jeu, mais nous aimerions que certaines options soient également disponibles. Nous ferons ça ensuite.
Entrez les informations suivantes sous le code que vous avez entré à l'étape ci-dessus..
optionsButton: addEventListener ("tap", function () transition.to (optionsScreenGroup, heure = 300, y = 0, onComplete = fonction () introScreenGroup. x = -480 fin) fin) Ce code anime l'écran des options d'en haut. Lorsque l'animation est terminée, cela met le introScreenGroup hors de l'écran principal à gauche.
Si vous testez maintenant et appuyez sur le bouton des options, rien ne se passe, c'est que nous n'avons pas encore créé l'écran des options..
Entrez les informations suivantes dans le setUpOptionsScreen () une fonction:
optionsScreenGroup = display.newGroup () local optionsScreen = display.newImage ("optionsScreen.png") local backButton = display.newImage ("backButton.png", 130,240) local soundOnText = display.newText ("Sound On / Off", 75,105) , native.systemFontBold, 16) groundHogSpeedText = display.newText ("Speed", 75,145, native.systemFontBold, 16) optionsScreenGroup: insert (optionsScreen) optionsScreenGroup: insert (backButton) optionsScreenGroup: insert (soundOnText). optionsScreenGroup.y = -325 Ici nous installons le optionsScreen, ajouter le bouton de retour, et ajouter quelques textes.
Maintenant, appelez cette fonction sous l'endroit où vous appelez setUpIntroScreen:
setUpIntroScreen () setUpOptionsScreen ()
Si vous testez le jeu maintenant, vous devriez voir l'écran des options glisser vers le bas.
Nous utiliserons le widget Case à cocher pour permettre à l'utilisateur d'activer / désactiver le son. Entrez les informations suivantes tout en haut du fichier "main.lua".
widget local = require ("widget") Pour pouvoir utiliser le commutateur et d’autres widgets, nous devons d’abord avoir besoin du module "widget".
Maintenant, entrez ce qui suit sous le code que vous avez entré ci-dessus dans le champ setUpOptionsScreen.
soundCheckBox local = widget.newSwitch left = 210, haut = 98, style = "case à cocher", initialSwitchState = true, onPress = fonction (e) vérification locale = e.target si (vérification.isOn) puis media.playSound ("gameTrack .mp3 ", soundComplete) else media.stopSound () end end optionsScreenGroup: insert (soundCheckBox) Ceci configure notre widget de case à cocher en définissant un "style" égal à "une case à cocher". Nous vérifions si la case à cocher est sur (s'il est sélectionné), et si c'est le cas, nous jouons le "gameTrack.mp3". Sinon, on arrête le son.
Si vous testez maintenant et que vous accédez à l'écran des options, vous devriez pouvoir activer ou désactiver le son..
Nous utilisons un SegmentedControl pour permettre à l’utilisateur de choisir la vitesse à laquelle les GroundHogs doivent apparaître. Entrez les informations suivantes sous le code de la case à cocher que vous avez saisie à l'étape ci-dessus:
local speedControl = widget.newSegmentedControl gauche = 210, haut = 140, segments = "lent", "moyen", "rapide", segmentWidth = 50, defaultSegment = 1, onPress = fonction (événement) cible locale = événement. target if (target.segmentNumber == 1) alors groundHogSpeed = 1500 elseif (target.segmentNumber == 2) puis groundHogSpeed = 1000 sinon groundHogSpeed = 700 end end optionsScreenGroup: insert (speedControl)
Nous créons ici un SegmentedControl avec 3 segments ("lent", "moyen", "rapide"). En fonction du segment sur lequel l'utilisateur a appuyé, nous définissons la GroundHogSpeed variable en conséquence.
Si vous testez maintenant, vous devriez voir le SegmentedControl et pouvoir sélectionner un segment, mais nous devons câbler le bouton Précédent pour revenir à l'écran d'introduction..
le bouton de retour nous ramène à l'écran d'introduction. Entrez le code suivant sous l'étape ci-dessus:
backButton: addEventListener ("tap", fonction () if (isPlaying == false), puis introScreenGroup.x = 0 end transition.to (optionsScreenGroup, heure = 300, y = -325, onComplete = fonction () si (isPlaying = = true) alors groundHogTimer = timer.performWithDelay (groundHogSpeed, getRandomGroundHog, 0) end) end) Ici, nous vérifions si le jeu a commencé. Sinon, on met le introScreenGroup retour dans l'aire de jeu. Nous faisons ensuite la transition de l'écran des options. Si le jeu a commencé, nous définissons la GroundHogtimer générer des marmottes aléatoires.
Nous devons pouvoir accéder à l'écran des options à partir de l'écran de jeu principal. Ajouter ce qui suit ci-dessous où vous insérez le jeu de fond dans le gameScreenGroup ().
gameScreenGroup: insert (gameBackground) options localesButton = display.newImage ("optionsButton.png", 1 270) gameScreenGroup: insert (optionsButton) Si vous testez maintenant, vous devriez voir le bouton options sur l'écran de jeu.
Nous devons maintenant câbler le bouton options avec un EventListener. Pour ce faire, entrez le code suivant sous la boucle qui crée toutes les marmottes.
optionsButton: addEventListener ("tap", fonction (e) timer.cancel (groundHogTimer) transition.to (optionsScreenGroup, heure = 300, y = 0, onComplete = fonction () fin) fin Ici nous annulons le groundHogTimer et transition notre écran d'options vers le bas.
En testant maintenant, vous devriez pouvoir accéder à l'écran des options à partir de l'écran de jeu. Vous devriez également pouvoir définir les options comme vous le souhaitez.
Si vous avez joué assez longtemps pour que la bande-son se termine, vous avez peut-être remarqué qu'elle ne recommençait pas. Entrez les informations suivantes dans le soundComplete () une fonction.
media.playSound ("gameTrack.mp3", soundComplete) Cela ne fait que commencer la lecture de la bande son une fois qu'elle est terminée.
Dans cette série, nous avons appris à créer un jeu amusant et intéressant Whack-a-Groundhog. Ce faisant, vous avez appris à utiliser les feuilles de sprite et le son. J'espère que vous avez trouvé ce tutoriel utile et merci d'avoir lu!
