Share
In questa serie di tutorial, utilizzeremo il Corona SDK per creare un gioco ispirato alla frenesia. Questo tutorial si concentrerà sull'installazione dell'applicazione e sulla struttura principale in 15 passaggi. Continuare a leggere!
Usando la grafica preimpostata codificheremo un gioco divertente usando js e le API Corona SDK.
L'utente sarà in grado di giocare contro il tempo per completare i contenitori quadrati toccandoli. Riempire un contenitore con un solo colore dà più 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à visualizzata un'interfaccia dall'aspetto colorato, 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.
Useremo gli effetti sonori per migliorare la sensazione del gioco, puoi trovare i suoni usati in questo esempio in Soungle.com usando le parole chiave campana e ronzio.
Prima di scrivere qualsiasi codice, definiremo alcune opzioni creando un build.settings file. Questo file contiene i parametri che verranno applicati alla build finale del tuo programma e il font che vogliamo incorporare nella nostra app.
settings = iphone = plist = UIStatusBarHidden = true, UIPrerenderedIcon = true, UIAppFonts = "Orbitron.ttf",,
Un altro file esterno verrà utilizzato per ridimensionare l'applicazione a schermo intero su tutti i dispositivi config.js 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 js 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.js 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.
Questa è la schermata principale dell'applicazione, sarà la prima visualizzazione interattiva a comparire nel nostro gioco. Queste variabili memorizzano lo sfondo e i componenti TitleView.
-- Grafica - [Sfondo] local bg - [Titolo vista] titolo locale locale startB crediti localiB - [TitleView Group] titolo localeView
Le seguenti variabili memorizzano le vite e segnano i testi oltre al loro valore.
-- [Punteggio & Vite] vite locali Vite locali del testo. Vita locale locale. Punteggio locale. Punteggio locale. Punteggio locale locale
Queste immagini avranno a rubinetto ascoltatore per spostare i quadrati nella posizione predefinita, riempirli per guadagnare punti!
Un'altra variabile è dichiarata in questo codice, un gruppo che memorizzerà tutta la grafica mostrata nella schermata di gioco.
locale locale locale locale locale locale locale sinistro - Game View Group local gameView
Tre blocchi saranno disponibili nel gioco, riempire un contenitore con un colore a blocco singolo per vincere punti bonus. I blocchi verranno aggiunti al gioco in modo casuale e memorizzati in una tabella che creeremo in seguito.
Questa schermata mostrerà i crediti, l'anno e il copyright del gioco. Questa variabile verrà utilizzata per memorizzare un riferimento alla vista:
-- [CreditsView] crediti locali
Queste sono le variabili che useremo, leggere i commenti nel codice per saperne di più su di loro, alcuni dei loro nomi sono auto spieganti quindi non ci sarà alcun commento lì.
local blockColor = 'orange', 'green', 'purple' --Utilizzato per generare un blocco casuale block locali = --Stores tutte le posizioni locali dei blocchi = 5, 35 --Le posizioni dei blocchi disponibili relative al container local currentXPosition --Usato per posizionare il blocco sui container local currentYPosition local eventTarget --Stores l'ultimo contenitore toccato localSymonaSource --Usato come id del timer locale locale local score campanello locale --Bell sound local bell4 --Bell suono per contenitori completi ronzio locale - Suono di bava usato quando il giocatore perde un live
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 ronzio locale locale bell4
In questa parte della serie hai imparato l'interfaccia e la configurazione di base del gioco. Restate sintonizzati per la seconda parte in cui gestiremo le diverse schermate e inizieremo a posizionare la grafica sul palco per costruire l'interfaccia. Arrivederci alla prossima!
Accentsconagua