Share
Benvenuti nel secondo post della nostra serie di giochi Corona-Frenzic di tipo Corona SDK. Nel tutorial di oggi, aggiungeremo l'interattività alla nostra interfaccia e codificheremo l'inizio del gioco.
Assicurati di controllare la parte 1 della serie per comprendere appieno questo tutorial.
Dichiara tutte le funzioni come Locale all'inizio.
main locale = local addTitleView = local startButtonListeners = local showCredits = local hideCredits = local destroyCredits = local showGameView = local destroyTitleView = local addListeners = local newBlock = timesUp locale = local placeBlock = local blockPlaced = local complete = local removeBlocks = alert locale = local alertHandler = local restart =
Successivamente creeremo la funzione che inizializzerà tutta la logica di gioco:
funzione Main () addTitleView () end
Ora posizioniamo lo sfondo e titleView nello stage.
Accentsconagua
function addTitleView () bg = display.newImage ('bg.png') title = display.newImage ('title.png') title.x = display.contentCenterX title.y = 100 startB = display.newImage ('startButton.png ') startB.x = display.contentCenterX startB.y = display.contentCenterY startB.name =' startB 'creditsB = display.newImage (' creditsButton.png ') creditsB.x = display.contentCenterX creditsB.y = display.contentCenterY + 40 creditiB.name = 'creditsB' titleView = display.newGroup () titleView: insert (title) titleView: insert (startB) titleView: insert (creditsB) startButtonListeners ('add') end In questa funzione aggiungiamo gli ascoltatori dei pulsanti ai pulsanti nella vista del titolo, questo ci porterà alla schermata di gioco o alla schermata dei crediti.
function startButtonListeners (action) if (action == 'add') then creditsB: addEventListener ('tap', showCredits) startB: addEventListener ('tap', showGameView) else creditsB: removeEventListener ('tap', showCredits) startB: removeEventListener ( 'tap', showGameView) end-end La schermata dei crediti viene visualizzata quando l'utente tocca il pulsante dei crediti, un ascoltatore viene aggiunto alla vista dei crediti per rimuoverlo.
function showCredits () credits = display.newImage ('credits.png') transition.from (crediti, time = 300, x = bg.contentWidth * 2, transition = easing.outExpo) credits: addEventListener ('tap', hideCredits) titleView.isVisible = false end Toccato, lo schermo dei crediti verrà intercettato e rimosso.
function hideCredits () titleView.isVisible = true transition.to (crediti, time = 300, x = bg.contentWidth * 2, transition = easing.outExpo, onComplete = destroyCredits) end function destroyCredits () credits: removeEventListener ('tap ', hideCredits) display.remove (crediti) credits = nil end Quando il Inizio viene premuto il pulsante, la vista del titolo viene interpolata e rimossa, rivelando la vista di gioco.
function showGameView (e) transition.to (titleView, time = 300, y = -titleView.height, transition = easing.inExpo, onComplete = destroyTitleView) end
La vista titolo viene rimossa dalla memoria e la grafica del gioco viene aggiunta allo stage.
function destroyTitleView () display.remove (titleView) titleView = nil - Aggiungi GameView Graphics up = display.newImage ('container.png') up: setReferencePoint (display.TopLeftReferencePoint) up.x = 125 up.y = 100 right = display.newImage ('container.png') right: setReferencePoint (display.TopLeftReferencePoint) right.x = 230 right.y = 205 down = display.newImage ('container.png') down: setReferencePoint (display.TopLeftReferencePoint) inattivo. x = 125 down.y = 310 left = display.newImage ('container.png') a sinistra: setReferencePoint (display.TopLeftReferencePoint) left.x = 20 left.y = 205 holder = display.newImage ('container.png') titolare: setReferencePoint (display.TopLeftReferencePoint) holder.x = 125 holder.y = 205 - Lives & Score testo livesText = display.newText ('Lives', 10, 10, 'Orbitron-Medium', 12) livesText: setTextColor ( 163, 255, 36) livesTF = display.newText ('5', 24, 30, 'Orbitron-Medium', 12) livesTF: setTextColor (163, 255, 36) scoreText = display.newText ('Punteggio', 260, 10, 'Orbitron-Medium', 12) scor eText: setTextColor (163, 255, 36) scoreTF = display.newText ('0', 274, 30, 'Orbitron-Medium', 12) scoreTF: setTextColor (163, 255, 36) gameView = display.newGroup () gameView : insert (up) gameView: insert (right) gameView: insert (giù) gameView: insert (left) gameView: insert (holder) gameView: insert (livesText) gameView: insert (livesTF) gameView: insert (scoreText) gameView: insert (scoreTF) addListeners () end Questa funzione aggiungerà un listener di tocco ai contenitori quadrati in modo da poterli toccare e posizionare il blocco corrente nel contenitore del centro (titolare).
function addListeners () su: addEventListener ('tap', placeBlock) right: addEventListener ('tap', placeBlock) down: addEventListener ('tap', placeBlock) a sinistra: addEventListener ('tap', placeBlock) lives = 5 score = 0 Queste variabili vengono create all'interno dei contenitori quadrati, vengono utilizzate per registrare blocchi, colori e posizioni all'interno di ogni quadrato.
Le lettere rappresentano le seguenti posizioni:
-- Crea una var per ogni contenitore per determinare quando full.blocks = 0 right.blocks = 0 down.blocks = 0 left.blocks = 0 - Array utilizzati per rimuovere i blocchi e rilevare il colore up.blocksGFX = right.blocksGFX = down.blocksGFX = left.blocksGFX = - Crea un valore booleano per ogni contenitore per evitare di posizionare blocchi nella stessa posizione up.a = false right.a = false down.a = false left.a = false up.b = false right.b = false down.b = false left.b = false up.c = false right.c = false down.c = false left.c = false up.d = false right.d = false down.d = false left.d = false - Dai un nome ai contenitori per identificarli in seguito up.name = 'up' right.name = 'right' down.name = 'down' left.name = 'left' newBlock (true) end
Questo codice seleziona un colore di blocco casuale dalla tabella, questo verrà utilizzato per creare un'istanza del blocco effettivo. Un parametro viene utilizzato per determinare se il timer deve essere avviato.
function newBlock (firstTime) - New Block randomBlock locale = math.floor (math.random () * 3) + 1 blocco locale if (blockColor [randomBlock] == 'orange') then block = display.newImage ('orangeBlock. png ') block.name =' orange 'block: setReferencePoint (display.TopLeftReferencePoint) elseif (blockColor [randomBlock] ==' green ') then block = display.newImage (' greenBlock.png ') block.name =' green ' block: setReferencePoint (display.TopLeftReferencePoint) elseif (blockColor [randomBlock] == 'purple') then block = display.newImage ('purpleBlock.png') block.name = 'purple' block: setReferencePoint (display.TopLeftReferencePoint) end Dopo aver selezionato il colore del blocco, la posizione in cui verrà posizionato viene calcolata utilizzando la tabella delle posizioni e quindi aggiunta alla tabella dei blocchi e allo stage.
currentXPosition = posizioni [math.floor (math.random () * 2) + 1] currentYPosition = posizioni [math.floor (math.random () * 2) + 1] block.x = holder.x + currentXPosition block.y = holder.y + currentYPosition table.insert (blocchi, blocchi) gameView: insert (block)
Prima di continuare con il gioco, dobbiamo verificare che il blocco appena creato possa essere effettivamente inserito in un contenitore quadrato. Il seguente codice controlla ogni array di contenitori per assicurarsi che ci sia una posizione disponibile per posizionare il blocco. Altrimenti, il blocco viene distrutto e la funzione viene richiamata per generarne un'altra.
posizione locale = currentXPosition, currentYPosition if (position [1] == 5 e position [2] == 5 e up.a == true e right.a == true e down.a == true e left.a == true) then display.remove (block) block = nil newBlock (false) elseif (position [1] == 35 e position [2] == 5 e up.b == true e right.b == true e down.b == true e left.b == true) then display.remove (block) block = nil newBlock (false) elseif (position [1] == 5 e position [2] == 35 e up.c = = true e right.c == true e down.c == true e left.c == true) then display.remove (block) block = nil newBlock (false) elseif (position [1] == 35 e position [ 2] == 35 e up.d == true e right.d == true e down.d == true e left.d == true) then display.remove (block) block = nil newBlock (false) end
Il timer inizia il conteggio quando la funzione viene chiamata per la prima volta.
if (firstTime) then - Start Timer timerSource = timer.performWithDelay (3000, timesUp, 0) end end
Tre secondi sono dati per mettere un blocco in un contenitore quadrato, se quel tempo passa e il blocco è ancora nel quadrato centrale, verrà rimossa una vita.
function timesUp: timer (e) - Remove Life lives = lives - 1 livesTF.text = lives media.playEventSound ('buzz.caf') Dopo aver rimosso la vita, il blocco nel quadrato centrale verrà distrutto e verrà generato un nuovo blocco.
display.remove (blocks [#blocks]) table.remove (blocchi)
Questo codice controlla se il giocatore ha esaurito le vite e chiama una funzione che lo gestirà.
se (vite < 1) then alert() else -- Next Block newBlock(false) end end
Ecco il codice completo scritto in questo tutorial insieme ai commenti per aiutarti a identificare ogni parte:
-- Ordina "Frenzic" come Gioco - Sviluppato da Carlos Yanez - Nascondi barra di stato display.setStatusBar (display.HiddenStatusBar) - Grafica - [Sfondo] local bg - [Titolo vista] titolo locale locale startB crediti localiB - [ TitleView Group] local titleView - [Score & Lives] locali livesText locali livesTF local lives locale scoreText locale scoreTF local score - [GameView] local up locale locale locale locale locale left holder - [GameView Group] local gameView - [ CreditsView] crediti locali - Variabili locali blockColor = 'orange', 'green', 'purple' blocchi locali = posizioni locali = 5, 35 local currentXPosition local currentYPosition local eventTarget local timerSource local lives locale local score local local bell local local bell buzz - Funzioni locali Main = local addTitleView = local startButtonListeners = local showCredits = local hideCredits = local destroyCredits = local showGameView = local destroyTitleView = local addListeners = local newBlock = timesUp locali = local placeBlock = local blockPlaced = local complete = local removeBlocks = local alert = local alertHandler = local restart = funzione Main () addTitleView () end function addTitleView () bg = display.newImage ('bg.png') title = display.newImage ('title.png') title.x = display.contentCenterX title.y = 100 startB = display.newImage ('startButton.png') startB. x = display.contentCenterX startB.y = display.contentCenterY startB.name = 'startB' creditsB = display.newImage ('creditsButton.png') creditsB.x = display.contentCenterX creditsB.y = display.contentCenterY + 40 creditiB.name = 'creditsB' titleView = display.newGroup () titleView: insert (title) titleView: insert (startB) titleView: insert (creditsB) startButtonListeners ('add') end function startButtonListeners (action) if (action == 'add') then creditsB: addEventListener ('tap', showCredits) startB: addEventListener ('tap', showGameView) else creditsB: removeEventListener ('tap', showCredits) startB: removeEventListener ('tap', showGameView) end end function showCredits () credits = display.newImage ('credits.png') transition.from (crediti, time = 300, x = bg.contentWidth * 2, transition = easing.outExpo) credits: addEventListener ( 'tap', hideCredits) titleView.isVisible = funzione di fine false hideCredits () titleView.isVisible = true transition.to (crediti, time = 300, x = bg.contentWidth * 2, transizione = easing.outExpo, onComplete = destroyCredits ) end function destroyCredits () credits: removeEventListener ('tap', hideCredits) display.remove (crediti) credits = nil end function showGameView (e) transition.to (titleView, time = 300, y = -titleView.height, transizione = easing.inExpo, onComplete = destroyTitleView) end function destroyTitleView () display.remove (titleView) titleView = nil - Aggiungi GameView Graphics up = display.newImage ('container.png') up: setReferencePoint (display.TopLeftReferencePoint) up .x = 125 up.y = 100 right = display.newImage ('container.png') right: setReferencePoint (display.TopLeftReferencePoint right.x = 230 right.y = 205 down = display.newImage ('container.png') down: setReferencePoint (display.TopLeftReferencePoint) down.x = 125 down.y = 310 left = display.newImage ('contenitore. png ') left: setReferencePoint (display.TopLeftReferencePoint) left.x = 20 left.y = 205 holder = display.newImage (' container.png ') titolare: setReferencePoint (display.TopLeftReferencePoint) holder.x = 125 holder.y = 205 - Testo delle vite e punteggio viveText = display.newText ('Lives', 10, 10, 'Orbitron-Medium', 12) livesText: setTextColor (163, 255, 36) livesTF = display.newText ('5', 24 , 30, 'Orbitron-Medium', 12) livesTF: setTextColor (163, 255, 36) scoreText = display.newText ('Score', 260, 10, 'Orbitron-Medium', 12) scoreText: setTextColor (163, 255 , 36) scoreTF = display.newText ('0', 274, 30, 'Orbitron-Medium', 12) scoreTF: setTextColor (163, 255, 36) gameView = display.newGroup () gameView: insert (up) gameView: inserisci (a destra) gameView: inserisci (giù) gameView: insert (a sinistra) gameView: insert (holder) gameView: insert (livesText) game Visualizza: insert (livesTF) gameView: insert (scoreText) gameView: insert (scoreTF) addListeners () end function addListeners () up: addEventListener ('tap', placeBlock) right: addEventListener ('tap', placeBlock) down: addEventListener ( 'tap', placeBlock) a sinistra: addEventListener ('tap', placeBlock) lives = 5 score = 0 - Crea una var per ogni container per determinare quando full up.blocks = 0 right.blocks = 0 down.blocks = 0 left .blocks = 0 - Array utilizzati per rimuovere i blocchi e rilevare il colore up.blocksGFX = right.blocksGFX = down.blocksGFX = left.blocksGFX = - Crea un valore booleano per ogni contenitore per evitare di posizionare blocchi nella stessa posizione up.a = false right.a = false down.a = false left.a = false up.b = false right.b = false down.b = false left.b = false up.c = false right .c = false down.c = false left.c = false up.d = false right.d = false down.d = false left.d = false - Dai un nome ai contenitori per identificarli in seguito up.name = 'up' right.name = 'right' down.name = 'down' left.name = 'left' newBlock (true) end function newBlock (firstTime) - New Block randomBlock locale = math.floor (math.random () * 3) + 1 blocco locale if (blockColor [randomBlock] == 'orange') quindi block = display. newImage ('orangeBlock.png') block.name = 'orange' block: setReferencePoint (display.TopLeftReferencePoint) elseif (blockColor [randomBlock] == 'green') quindi block = display.newImage ('greenBlock.png') block. name = 'green' block: setReferencePoint (display.TopLeftReferencePoint) elseif (blockColor [randomBlock] == 'purple') then block = display.newImage ('purpleBlock.png') block.name = 'purple' block: setReferencePoint (visualizzazione .TopLeftReferencePoint) end currentXPosition = posizioni [math.floor (math.random () * 2) + 1] currentYPosition = posizioni [math.floor (math.random () * 2) + 1] block.x = holder.x + currentXPosition block.y = holder.y + currentYPosition table.insert (blocchi, blocchi) gameView: insert (block) - Cerca uno spazio disponibile per spostare la posizione locale del blocco = currentXPosition, currentYPosition if (pos ition [1] == 5 e position [2] == 5 e up.a == true e right.a == true e down.a == true e left.a == true) then display.remove (block ) block = nil newBlock (false) elseif (position [1] == 35 e position [2] == 5 e up.b == true e right.b == true e down.b == true e left.b == true) then display.remove (block) block = nil newBlock (false) elseif (position [1] == 5 e position [2] == 35 e up.c == true e right.c == true e down.c == true e left.c == true) then display.remove (block) block = nil newBlock (false) elseif (position [1] == 35 e position [2] == 35 e up.d = = true e right.d == true e down.d == true e left.d == true) then display.remove (block) block = nil newBlock (false) end - Start Timer la prima volta che viene chiamata la funzione if (firstTime) then - Start Timer timerSource = timer.performWithDelay (3000, timesUp, 0) end fine function timesUp: timer (e) - Remove Live lives = lives - 1 livesTF.text = lives media.playEventSound ('buzz .caf ') - Rimuovi la visualizzazione del blocco non utilizzato. remove (blocks [#blocks]) table.remove (blocks) - Verifica se le vite sono scadute (vive < 1) then --alert() else -- Next Block newBlock(false) end end Nella parte successiva e finale della serie, gestiremo il comportamento dei blocchi, i punteggi e i passaggi finali da eseguire prima di rilasciare l'app -like test delle app, creare una schermata iniziale, aggiungere un'icona e creare l'app. Restate sintonizzati per la parte finale!
