Share
In questa serie di tutorial, impareremo come creare uno sparatutto spaziale proprio come il classico gioco Space Defender. Continuare a leggere!
In questa versione di Space Defender, il giocatore dovrà difendere il suo spazio sparando ai nemici. Ogni volta che il giocatore distrugge un nemico, guadagna punti e quando il giocatore ha raggiunto 20 o 40 punti, la sua arma riceverà un aggiornamento. Per mescolare le cose, questo gioco invierà pacchetti bonus che valgono 5 punti. Per vedere il gioco in azione, guarda il breve video qui sopra. Ora che sappiamo di più sul gioco che stiamo creando, iniziamo!
Questo gioco sparatutto spaziale sarà costruito utilizzando il Corona SDK. Ecco alcune delle cose che imparerai in questa serie di tutorial:
Per poter utilizzare questo tutorial, è necessario che Corona SDK sia installato sul tuo computer. Se non si dispone dell'SDK, andare su www.CoronaLabs.com per creare un account gratuito e scaricare il software gratuito.
Il nostro primo passo per impostare il nostro gioco è il file build.settings. Questo file gestisce tutte le proprietà del tempo di costruzione della nostra app, come l'orientamento e le opzioni aggiuntive per le piattaforme Android e iOS. Crea un nuovo file chiamato build.settings e copia le seguenti impostazioni nel tuo file.
settings = orientation = default = "landscapeRight", supportato = "landscapeRight", "landscapeLeft", iphone = plist = UIStatusBarHidden = false, UIAppFonts = "Kemco Pixel.ttf",
Una delle grandi cose di Corona SDK è che la lingua si autoregola e la maggior parte delle impostazioni in questo file dovrebbe essere facile da capire. Tuttavia, passiamo rapidamente a queste impostazioni.
Dopo aver impostato le configurazioni del tempo di costruzione, configureremo le nostre configurazioni di runtime nel nostro file config.lua. In questo file, imposteremo la larghezza e l'altezza del gioco, il tipo di ridimensionamento del contenuto e i fotogrammi al secondo. Crea un nuovo file chiamato config.lua e copia le seguenti impostazioni.
application = content = width = 320, height = 480, scale = "letterBox", fps = 30,,
Simile al nostro file build.settings, config.lua è auto-documentante tranne per l'opzione di scala. L'opzione di scala è una funzione che Corona SDK utilizza per adattare l'applicazione a diverse dimensioni dello schermo. Nel caso dell'opzione letterBox, stiamo dicendo a Corona di visualizzare tutti i nostri contenuti sullo schermo mantenendo le proporzioni. Quando il contenuto non copre l'intero schermo, l'app visualizzerà barre nere nelle aree senza contenuto (proprio come guardare i film in modalità widescreen).
Prima di continuare a costruire la nostra app, dobbiamo parlare di grafica. Ci sono molti modi diversi per ottenere la grafica per il tuo gioco: assumere un grafico, assumere un amico, disegnarlo da te o persino acquistare immagini grafiche da siti web come https://graphicriver.net/.
Tuttavia, se hai un budget ridotto, potresti non essere in grado di acquistare questi elementi grafici o potresti non avere il tempo di crearli. In questo tipo di situazioni, è possibile utilizzare grafica rilasciata sotto la licenza Creative Commons. La licenza creative commons ti consente di utilizzare elementi grafici liberamente disponibili in base a determinate restrizioni, come l'attribuzione dell'autore all'autore.
Per il nostro gioco, utilizzeremo la grafica sotto la licenza Creative Commons da OpenGameArt.org. L'autore che ha creato questi grafici è VividRealtiy e qui c'è un link diretto al suo lavoro: http://opengameart.org/content/evolutius-gfx-pack. Prima di continuare, assicurati di scaricare il set grafico o scarica il file per questo tutorial.
Mentre ci sono un sacco di siti web con grafica sotto questa licenza, qui ci sono tre siti che visito spesso:
Ora che abbiamo la nostra grafica, possiamo continuare a fare il nostro gioco! Per continuare il nostro gioco, dobbiamo creare un nuovo file chiamato main.lua. Questo file sarà il punto di partenza del nostro gioco e infatti è il punto di partenza di ogni gioco realizzato con Corona. Una volta creato il file, aprilo nel tuo editor preferito e inserisci il seguente codice:
-- nascondi la barra di stato display.setStatusBar (display.HiddenStatusBar)
Questa riga di codice nasconderà la barra di stato su iOS. Successivamente, utilizzeremo la funzione di storyboard di Corona per gestire il nostro gioco. La funzione storyboard tratta le diverse parti del gioco come scene per facilitare la gestione del codice da parte degli sviluppatori. Ad esempio, il nostro gioco ha tre scene: main.lua, il menu e la schermata di gioco. Una volta impostata ciascuna scena, Corona offre un modo molto semplice per spostarsi tra le scene. Poiché questo può essere un enorme ostacolo per gli sviluppatori che iniziano con il Corona SDK, ecco una rappresentazione grafica del layout del nostro gioco.
Ogni riquadro blu rappresenta una scena individuale e la freccia tra ogni scena mostra come navigheremo attraverso le scene. In poche parole, iniziamo da main.lua e navigheremo avanti e indietro tra Scene 2 e Scene 3.
Implementare lo Storyboard nella nostra app è semplice: basta richiedere il modulo e tutto è pronto! Inserisci il seguente codice in main.lua per incorporare questa fantastica funzionalità.
-- includi lo storyboard locale del modulo "storyboard" di Corona = richiede "storyboard"
Successivamente, vorremmo passare alla seconda scena e useremo la variabile storyboard per realizzare questo.
Accentsconagua
-- caricare la schermata del menu storyboard.gotoScene ("menu") Ora che abbiamo completato il nostro file main.lua, affrontiamo il menu principale!
Il menu principale del nostro gioco mostrerà un'immagine di sfondo, il titolo del gioco e un pulsante Gioca ora. Per iniziare, crea un nuovo file chiamato menu.lua e lo storyboard di Corona in primo piano.
storyboard locale = require ("storyboard") local scene = storyboard.newScene () Ora aggiungeremo la funzione di widget di Corona per creare il nostro pulsante. La funzione widget ci consente di creare facilmente elementi GUI comuni come i pulsanti nel nostro gioco.
widget locale = richiede "widget"
Dopo la libreria di widget, pre-definiremo alcune variabili per il nostro gioco. Queste variabili memorizzeranno la larghezza dello schermo, l'altezza dello schermo e il centro delle coordinate dello schermo.
schermata localeW, schermataH, metàW, metàY = display.contentWidth, display.contentHeight, display.contentWidth * 0.5, display.contentHeight * 0.5
Dopo le nostre variabili, creeremo la nostra primissima funzione chiamata scena: createScene (). Questa funzione viene chiamata quando la scena viene caricata per la prima volta o se la scena è stata rimossa in precedenza. In generale, questa funzione viene utilizzata per aggiungere tutti gli elementi grafici allo schermo.
scena della funzione: createScene (evento) gruppo locale = self.view fine
Una caratteristica importante di uno storyboard è il modo in cui gestisce gli oggetti. Tutti gli oggetti di visualizzazione che usiamo all'interno di questa scena saranno posizionati con il gruppo di variabili. Posizionando i nostri oggetti di visualizzazione all'interno di questo gruppo, stiamo facendo sapere a Corona che questi oggetti appartengono a questa scena e quando la scena deve essere rimossa, questi oggetti verranno rimossi.
All'interno della scena delle funzioni: createScene (), utilizzeremo la grafica BKG.png (questa grafica proviene da opengameart.org) come sfondo per il nostro gioco. Una volta aggiunto, centreremo il grafico sullo schermo e lo inseriremo nella variabile di gruppo.
-- visualizza un'immagine di sfondo locale bg = display.newImageRect ("images / BKG.png", 480, 320) bg.x = halfW bg.y = halfY gruppo: insert (bg) Successivamente, posizioniamo il titolo del gioco sullo schermo usando il carattere personalizzato che abbiamo specificato nel nostro file build.settings.
-- posiziona sullo schermo un titolo del gioco locale gametitle = display.newText ("Space Defender", 0,0, "Kemco Pixel", 40) gametitle.x = halfW gametitle.y = 100 group: insert (gametitle) La nostra ultima aggiunta alla nostra prima funzione è il pulsante play. Il pulsante di riproduzione utilizzerà la funzione di widget di Corona e un listener di eventi chiamato onPlayBtnRelease. Il listener di eventi verrà attivato quando viene toccato il pulsante di riproduzione. Aggiungi il seguente codice all'interno del scena: createScene () funzione.
funzione locale onPlayBtnRelease () storyboard.gotoScene ("game", "slideLeft") end playBtn = widget.newButton label = "Gioca ora", labelColor = default = 255, defaultFile = "images / Button.png" , overFile = "images / Button_Purple.png", width = 150, height = 60, left = 180, top = 150, font = "Kemco Pixel", fontSize = 18, onRelease = onPlayBtnRelease - funzione listener dell'evento group: insert (playBtn) Dopo la nostra funzione crea scena, aggiungeremo una funzione di inserimento scena. Questa funzione verrà attivata dopo la funzione di creazione scena e rimuoverà la scena precedente.
function scene: enterScene (event) local group = self.view se storyboard.getPrevious () ~ = nil then storyboard.removeScene (storyboard.getPrevious ()) end end
L'ultima funzione che aggiungeremo è la funzione destroyScene. Questa funzione verrà chiamata quando la scena viene rimossa o distrutta. Nel nostro caso, stiamo usando i widget e poiché i widget devono essere rimossi manualmente, rimuoviamo il widget all'interno della nostra funzione destroy.
function scene: destroyScene (event) local group = self.view se playBtn then playBtn: removeSelf () - i widget devono essere rimossi manualmente playBtn = nil end end
Infine, aggiungiamo gli ascoltatori di eventi per chiamare le diverse funzioni che impostiamo: enterScene, destroyScene e createScene.
scena: addEventListener (scena "createScene", scena): addEventListener (scena "enterScene", scena): addEventListener ("destroyScene", scena) E questo è tutto per la prima parte! Abbiamo imparato come impostare il nostro progetto, come implementare la funzione di storyboard di Corona, come avviare la nostra app e come creare un sistema di menu. Leggi la parte 2 di questa serie ora!
