Share
Ceci est le deuxième volet de notre tutoriel Corona SDK Alphabet Soup Game. Dans le tutoriel d'aujourd'hui, nous allons ajouter à notre interface et commencer à coder l'interaction du jeu. Continuer à lire!
Déclarer toutes les fonctions comme local au début.
local principal = local addTitleView = local startBtnuttonListeners = showCredits local = local hideCredits = local showGameView = local gameListeners = local buildSoup = local startDraw = local hitTestObjects = detectLetters local = alerte locale =
Nous allons ensuite créer la fonction qui initialisera toute la logique du jeu:
fonction Main () addTitleView () end
Maintenant, nous plaçons TitleView dans la scène et appelons une fonction qui ajoutera le robinet les auditeurs aux boutons.
Accentsconagua
fonction addTitleView () titleBg = display.newImage ('titleBg.png') title = display.newImage ('title.png') title.x = display.contentCenterX title.y = 120 startBtn = display.newImage ('startBtn.png ') startBtn.x = display.contentCenterX startBtn.y = display.contentCenterY + 20 aboutBtn = display.newImage (' aboutBtn.png ') aboutBtn.x = display.contentCenterX aboutBtn.y = display.contentCenterY + 65 titleView = display. newGroup () titleView: insert (titleBg) titleView: insert (title) titleView: insert (startBtn) titleView: insert (aboutBtn) startButtonListeners ('add') end end Cette fonction ajoute les auditeurs nécessaires à la TitleView boutons.
function startButtonListeners (action) if (action == 'add') puis aboutBtn: addEventListener ('tap', showCredits) startBtn: addEventListener ('tap', showGameView) sinon aboutBtn: removeEventListener ('tap', showCredits) startBrand: 'tap', showGameView) end end L’écran des crédits s’affiche lorsque l’utilisateur appuie sur le bouton À propos de, un bouton robinet écouteur est ajouté à la vue des crédits pour le supprimer.
function showCredits: tap () aboutBtn.isVisible = false startBtn.isVisible = false about = display.newImage ('about.png') about.x = about.width * 0.474 about.y = display.contentHeight + about about.height transition. to (about, time = 300, y = display.contentHeight - about.height / 2.4, onComplete = function () about: addEventListener ('tap', hideCredits) end) end Lorsque l'écran des crédits est exploité, il sera interpolé hors de la scène et supprimé.
function hideCredits () transition.to (environ, heure = 300, y = display.contentHeight + environ.hauteur, onComplete = fonction () aboutBtn.isVisible = vrai startBtn.isVisible = vrai sur: removeEventListener ('tap', hideCredits) display.remove (about) about = nil end) end Quand le Début appuyez sur le bouton, la vue du titre est interpolée et supprimée pour révéler la vue du jeu.
function showGameView: tap () transition.to (titleView, heure = 300, y = -titleView.height, onComplete = fonction () display.remove (titleView) titleView = nil buildSoup () gameListeners ('add') end) fin Ce code ajoute des écouteurs à l’arrière-plan au jeu. Ceux-ci seront utilisés pour tracer la ligne de sélection et identifier les lettres sélectionnées..
fonction gameListeners (action) if (action == 'add'), puis gameBg: addEventListener ('touch', startDraw) gameBg: addEventListener ('touch', detectLetters) sinon gameBg: removeEventListener ('touch', startDraw) gameBg: removeEventListener ( 'toucher', détecter les lettres) fin fin Une des fonctions principales du jeu; cela va parcourir la table Map pour créer tous les champs de texte et les placer dans la scène, passez à l'étape suivante pour voir son comportement.
function buildSoup () - Code… fin
Un double pour est utilisé pour identifier les éléments de la table Carte, un pour les valeurs horizontales et un pour la verticale. Le code créera un champ de texte pour chaque valeur trouvée dans la table, puis les placera dans la scène..
pour i = 1, 10 pour j = 1, 12 pour tf local = display.newText (", 0, 0, 'Arial', 19) tf: setTextColor (102, 102, 102) tf.width = 22 tf. height = 21 tf.x = math.floor (-10 + (31,3 * i)) tf.y = math.floor (-10 + (35 * j)) Les mots choisis sont déjà dans la table et le reste des valeurs sont remplies par des 0 pour le moment. Les lignes suivantes modifient ces 0 en une lettre aléatoire.
-- Remplacez les 0 par des lettres aléatoires si (L1Map [j] [i] == 0) alors L1Map [j] [i] = alphabet [math.floor (math.random () * table.maxn (alphabet)) + 1] end tf.text = L1Carte [j] [i] tfs: insérer (tf) end end
Ce code crée deux champs de texte qui contiendront la liste des valeurs à rechercher et les valeurs déjà trouvées..
-- Ajouter mots Liste des mots locauxString = "pour i = 1, # L1 faire des motsString = motsString…"… L1 [i] fin wordsList = display.newText (wordsString, 5, 430, 'Arial', 14) wordsList: setTextColor (238, 238, 238) currentWords = display.newText (", 5, 455, 'Arial', 14) currentWords: setTextColor (238, 146, 63) Une ligne semi-transparente sera utilisée pour mettre en surbrillance les lettres de la scène. Dans la fonction suivante, cette ligne est créée et ajoutée à la scène..
fonction startDraw: touch (e) if (e.phase == 'commencé') puis initX = ex initY = ey elseif (e.phase == 'terminée') puis line = display.newLine (initX, initY, ex, ey ) line.width = 16 ligne: setColor (255, 142, 42, 60) lignes: insert (line) end end
Voici le code complet écrit dans ce tutoriel à côté de commentaires pour vous aider à identifier chaque partie:
-- Alphabet Soup Game - Développé par Carlos Yanez - Masquer la barre d'état display.setStatusBar (display.HiddenStatusBar) - Graphiques - [Arrière-plan] - [Arrière-plan de jeu] local gameBg = display.newImage ('bg.png') - - [Vue de titre] local titleBg titre local local startBtn local aboutBtn - [TitleView groupe] local titleView - [CreditsView] local about - [Liste de mots Textfield] local wordsListe local currentWords - [Lettre Texfields Container] local tfs = display .newGroup () - [Ligne de sélection] ligne locale lignes locales = display.newGroup () - Alerte locale [Alerte] - [Son] bell local = audio.loadStream ('bell.caf') - Variables locales L1 = 'IPHONE', 'ANDROID', 'CORONA', 'MOBILE', 'JEUX' local L1Map = 0, 0, 'I', 0, 0, 0, 'G', 0, 0, 0 , 0, 0, 'P', 0, 0, 0, 'A', 0, 0, 0, 0, 0, 'H', 0, 0, 0, 'M', 0, 0 , 0, 0, 'M', 'O', 'B', 'I', 'L', 'E', 0, 0, 0, 0, 0, 'N', 0, 0 , 0, 'S', 0, 0, 0, 0, 0, 'E', 0, 0, 0, 0, 0, 0, 0, 'C', 'O', 'R' , 'O', 'N', 'A', 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 'A', 'N', 'D', 'R', 'O', 'O', 'I', 'D', 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 alphabet local = "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", " M ',' N ',' O ',' P ',' Q ',' R ',' S ',' T ',' U ',' V ',' W ',' X ',' Y ' , 'Z' local correct = 0 - Fonctions local Main = local addTitleView = local startBtnuttonListeners = local showCredits = local hideCredits = local showGameView = local gameListeners = local buildSoup = local startDraw = hitTestObjects local = detectLetters local = alerte local = fonction Main () addTitleView () fonction de fin addTitleView () titleBg = display.newImage ('titleBg.png') title = display. newImage ('title.png') title.x = display.contentCenterX title.y = 120 startBtn = display.newImage ('startBtn.png') startBtn.x = display.contentCenterX startBtn.y = display.contentCenterY + 20 - startBtn.name = 'startBtn' aboutBtn = display.newImage ('aboutBtn.png') aboutBtn.x = display.conte ntCenterX aboutBtn.y = display.contentCenterY + 65 --aboutBtn.name = 'aboutBtn' titleView = display.newGroup () titleView: insert (titleBg) titleView: insert (title) titleView: insert (startBtn) titleView: insert (aboutBtn) startButtonListeners ('add') fonction finale startButtonListeners (action) if (action == 'add') then aboutBtn: addEventListener ('tap', showCredits) startBtn: addEventListener ('tap', showGameView) else aboutBtn: removeEventListener ('tap' , showCredits) startBtn: removeEventListener ('tap', showGameView) fin de fonction showCredits: tap () aboutBtn.isVisible = false startBtn.isVisible = false about = display.newImage ('about.png') about.x = about.width * 0.474 about.y = display.contentHeight + about.height transition.to (about, time = 300, y = display.contentHeight - about.height / 2.4, onComplete = function () à propos de: addEventListener ('tap', hideCredits ) fin) fin fonction hideCredits () transition.to (environ, heure = 300, y = display.contentHeight + environ.hauteur, onComplete = fonction () aboutBtn.is Visible = true startBtn.isVisible = true about: removeEventListener ('tap', hideCredits) display.remove (about) about = nil end) fonction de fin showGameView: tap () transition.to (titleView, heure = 300, y = -titleView.height, onComplete = function () display.remove (titleView) titleView = nil buildSoup () gameListeners ('add') end) fonction de fin gameListeners (action) if (action == 'add') then gameBg: addEventListener ('touch', startDraw) gameBg: addEventListener ('touch', detectLetters) sinon gameBg: removeEventListener ('touch', startDraw) gameBg: removeEventListener ('touch', detectLetters) fonction d'extrémité buildSoup () pour i = 1, 10 faire pour j = 1, 12 faire local tf = display.newText (", 0, 0, 'Arial', 19) tf: setTextColor (102, 102, 102) tf.width = 22 tf.height = 21 tf.x = math.floor (-10 + (31.3 * i)) tf.y = math.floor (-10 + (35 * j)) - Modifie les 0 en lettres aléatoires si (L1Carte [j] [i] == 0 ) puis L1Map [j] [i] = alphabet [math.floor (math.random () * table.maxn (alphabet)) + 1] end tf.text = L1Map [j] [i] tfs: insert (tf) fin end - Ajouter une liste des mots lister wordsString = "pour i = 1, # L1 faire wordsString = wordsString…"… L1 [i] end wordsList = display.newText (wordsString, 5, 430, 'Arial', 14) wordsList: setTextColor (238, 238, 238) currentWords = display.newText (", 5, 455, 'Arial', 14) currentWords: setTextColor (238, 146, 63) fin de la fonction startDraw: touchez (e) si (e.phase == 'begin') puis initX = ex initY = ey elseif (e.phase == 'terminé') puis line = display.newLine (initX, initY, ex, ey) line.width = 16 ligne: setColor (255, 142, 42, 60) lines: insert (line) end end Dans la prochaine et dernière partie de la série, nous allons gérer l’identification de la lettre, afficher les mots déjà trouvés et définir les dernières étapes à suivre avant la publication, comme la création d’un test d’application, la création d’un écran de démarrage, l’ajout d’une icône et enfin la construction. l'application. Restez à l'écoute pour la dernière partie!
