Share
In questa serie di tutorial, imparerai come creare un gioco come i famosi Hundred. L'obiettivo del gioco è di raggiungere 100 punti senza che i cerchi si tocchino mentre si alza il punteggio. 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 cerchi sullo schermo per aumentare il punteggio. È possibile modificare i parametri nel codice per personalizzare il gioco.
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.
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.
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 che preferisci (qualsiasi editor di testo funzionerà, ma potrebbe non avere 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.
Classi necessarie Variabili e costanti Dichiarate Funzioni Funzioni della classe contructor (funzione principale) (altre funzioni) chiamata Funzione principale
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.
Useremo la libreria di fisica per gestire le collisioni. Usa questo codice per importarlo:
Accentsconagua
fisica locale = require ('fisica') physics.start () physics.setGravity (0,0) 
Un semplice grafico viene utilizzato come sfondo per l'interfaccia dell'applicazione, la riga successiva del codice lo memorizza.
-- Grafica - [Sfondo] local bg = display.newImage ('bg.png') 
Questa è la Vista Titolo, sarà la prima schermata interattiva a comparire nel nostro gioco, queste variabili memorizzano i suoi componenti.
-- [Titolo vista] titolo localeBg riproduzione localeBtn crediti localiBtn titleView locale
Questa vista mostrerà i crediti e il copyright del gioco, questa variabile verrà utilizzata per memorizzarla.
-- [CreditsView] creditsView locali
Questa immagine sostituirà il nostro precedente background. Questo sarà lo sfondo del gioco.
-- Gioco Sfondo gioco localeBg
Il gruppo di cerchi memorizzerà i cinque cerchi che verranno creati dinamicamente più avanti nel gioco. Useremo l'API di disegno Corona SDK.
-- Cerchi circoli locali del gruppo
Le pareti fisiche sono create per far rimbalzare i cerchi sullo schermo.
-- Mura locali sinistra locale locale locale in basso a destra locale
Il valore del punteggio è gestito da questa variabile.
-- Punteggio TextField punteggio locale
Questo è l'avviso che verrà visualizzato quando vinci il gioco. Completerà il livello e terminerà il gioco. C'è anche un avviso "You Lost" che si comporterà in modo simile.
-- Avvisa locale alertView
Queste sono le variabili che useremo, leggere i commenti nel codice per saperne di più su di loro.
-- Variabili locali in ultimoY - Utilizzato per riposizionare i crediti visualizzare locale lastX --utilizzato per riposizionare la vista del titolo
Dichiara tutte le funzioni come Locale all'inizio.
-- Funzioni locali Main = local startButtonListeners = local showCredits = local hideCredits = local showGameView = local gameListeners = local onTouch = local onCollision = local alert =
Successivamente creeremo la funzione che inizializzerà tutta la logica di gioco:
funzione Main () - code ... end
Ora posizioniamo il TitleView nello stage e chiamiamo una funzione che aggiungerà il rubinetto ascoltatori ai pulsanti.
function Main () titleBg = display.newImage ('title.png', 10, 20) playBtn = display.newImage ('playBtn.png', 100, 220) creditsBtn = display.newImage ('creditsBtn.png', 100, 290) titleView = display.newGroup (titleBg, playBtn, creditsBtn) startButtonListeners ('add') end In questa parte della serie hai imparato l'interfaccia e l'impostazione di base del gioco. Nella parte successiva e finale della serie, gestiremo la creazione del livello, il rilevamento delle collisioni e i passaggi finali da eseguire prima del rilascio, come il test delle app, la creazione di una schermata iniziale, l'aggiunta di un'icona e, infine, la creazione dell'app . Restate sintonizzati per la parte finale!
