Share
In questa serie di tutorial, imparerai come creare la tua versione del classico gioco Whack-a-Mole. Tuttavia, invece di usare le talpe, le nostre sfortunate creature scelte saranno vermi. Continuare a leggere!
Usando la grafica pre-creata codificheremo un gioco divertente usando le API Lua e Corona SDK.
Il giocatore sarà in grado di toccare i vermi sullo schermo e ottenere punti.
La prima cosa che dobbiamo fare è selezionare la piattaforma in cui vogliamo far funzionare la nostra app, in questo modo potremo scegliere la dimensione per le immagini che useremo.
La piattaforma iOS ha queste caratteristiche:
Perché Android è una piattaforma aperta, ci sono molti diversi dispositivi e risoluzioni. Alcune delle caratteristiche dello schermo più comuni sono:
In questo tutorial ci concentreremo sulla piattaforma iOS con il design grafico, in particolare lo sviluppo per la distribuzione su un iPhone / iPod touch, ma il codice presentato qui dovrebbe applicarsi anche allo sviluppo Android con il Corona SDK.
Verrà utilizzata un'interfaccia semplice e intuitiva, che comprende più forme, pulsanti, bitmap e altro ancora. L'immagine del worm utilizzata in questo tutorial è stata scaricata da qui sotto a Creative Commons Licenza.
Le risorse grafiche dell'interfaccia necessarie per questo tutorial sono disponibili nel download allegato.
A seconda del dispositivo selezionato, potrebbe essere necessario esportare la grafica nel ppi consigliato, è possibile farlo nell'editor di immagini preferito.
Ho usato il Regola dimensioni ... funzione nell'app Anteprima su Mac OS X.
Ricordarsi di assegnare alle immagini un nome descrittivo e salvarle nella cartella del progetto.
Useremo gli effetti sonori per migliorare la sensazione del gioco, puoi trovare il suono utilizzato in questo esempio su Soungle.com utilizzando la parola chiave colpire.
Verrà utilizzato un file esterno per rendere l'applicazione disponibile a schermo intero su tutti i dispositivi config.lua file. Questo file mostra le dimensioni originali dello schermo e il metodo utilizzato per ridimensionare il contenuto nel caso in cui l'app venga eseguita con una risoluzione dello schermo diversa.
application = content = width = 320, height = 480, scale = "letterbox",
Scriviamo l'applicazione!
Apri l'editor Lua preferito (qualsiasi editor di testo funzionerà, ma non avrai l'evidenziazione della sintassi) e preparati a scrivere la tua fantastica app. Ricordarsi di salvare il file come main.lua nella cartella del tuo progetto.
Struttureremo il nostro codice come se fosse una classe. Se conosci ActionScript o Java, dovresti trovare la struttura familiare.
Necesary Classes Variable and Constants Declare Funzione contructor (funzione principale) metodi di classe (altre funzioni) chiamata Main function
display.setStatusBar (display.HiddenStatusBar)
Questo codice nasconde la barra di stato. La barra di stato è la barra in cima allo schermo del dispositivo che mostra l'ora, il segnale e altri indicatori.
Accentsconagua
movieclip locale = require ('movieclip') La grafica animata verrà utilizzata in questo gioco, la libreria Corona MovieClip lo renderà molto più semplice.
Un semplice gradiente marrone viene utilizzato come sfondo per l'interfaccia dell'applicazione, la riga successiva del codice lo memorizza.
-- Grafica - [Sfondo] local bg = display.newImage ('gameBg.png') 
Questa è la Vista Titolo, sarà la prima schermata interattiva a comparire nel nostro gioco, queste variabili memorizzano i suoi componenti.
titolo locale locale playBtn crediti localiBtn titleView locale
Questa vista mostrerà i crediti, l'anno e il copyright del gioco, questa variabile verrà utilizzata per memorizzarla.
credits locali
Il valore del punteggio sarà gestito dalla variabile successiva.
punteggio locale
Le seguenti variabili sono utilizzate per memorizzare la grafica dei worm e l'ultimo worm che è stato visibile.
locale w1 locale w2 locale w3 locale w4 locale w5 locale w6 locale w7 locale w8 locale worm locale lastWorm =
Ecco il codice completo scritto in questo tutorial insieme ai commenti per aiutarti a identificare ogni parte:
-- Whack A Worm Game - Sviluppato da Carlos Yanez - Nascondi barra di stato display.setStatusBar (display.HiddenStatusBar) - Importa MovieClip movieclip locale = require ('movieclip') - Grafica - [Sfondo] local bg = display.newImage ('gameBg.png') - [Title View] titolo localeBg local playBtn local creditsBtn local titleView - [Credits] local creditsView - [Score] punteggio locale - [Worms] locale w1 locale w2 locale w3 locale w4 locale w5 locale locale w6 w7 locale locale locale w8 locale worm lastWorm = In questa parte della serie hai imparato l'interfaccia e la configurazione di base dell'applicazione. Restate sintonizzati per la seconda parte in cui gestiremo la logica dell'applicazione, il comportamento dei pulsanti e altro ancora. Arrivederci alla prossima!
