I denne opplæringsserien lærer vi hvordan du lager et romskytespill akkurat som det klassiske spillet Space Defender. Les videre!
I denne versjonen av Space Defender må spilleren forsvare sin plass ved å skyte fiender. Hver gang spilleren ødelegger en fiende, vil de tjene poeng og når spilleren har nådd 20 eller 40 poeng, vil pistolen motta en oppgradering. For å blande ting opp, vil dette spillet sende ut bonuspakker som er verdt 5 poeng. For å se spillet i aksjon, se den korte videoen ovenfor. Nå som vi vet mer om spillet vi skaper, la oss komme i gang!
Dette space shooter spillet vil bli bygget ved hjelp av Corona SDK. Her er noen av tingene du vil lære i denne opplæringsserien:
For å kunne bruke denne opplæringen må du ha Corona SDK installert på datamaskinen. Hvis du ikke har SDK, går du over til www.CoronaLabs.com for å opprette en gratis konto og laste ned gratis programvare.
Vårt første skritt i å sette opp spillet vårt er filen build.settings. Denne filen håndterer alle byggetidegenskapene til appen vår, for eksempel orienteringen og tilleggsalternativene for Android og iOS-plattformer. Opprett en ny fil som heter build.settings og kopier følgende innstillinger til filen din.
settings = orientation = default = "landscapeRight", støttet = "landscapeRight", "landscapeLeft", iphone = plist = UIStatusBarHidden = false, UIAppFonts = "Kemco Pixel.ttf",,
En av de store tingene med Corona SDK er at språk-selvdokumenter og de fleste innstillingene i denne filen skal være enkle å forstå. La oss imidlertid gå raskt gjennom disse innstillingene.
Etter at vi har satt opp konfigurasjonene våre, skal vi sette opp våre kjøretidskonfigurasjoner i vår config.lua-fil. I denne filen vil vi sette opp bredden og høyden på spillet vårt, typen innholdsskalering og rammene per sekund. Opprett en ny fil som heter config.lua, og kopier følgende innstillinger.
søknad = content = width = 320, height = 480, scale = "letterBox", fps = 30,,
I likhet med vår build.settings-fil er config.lua selvdokumenterende, bortsett fra skalaen. Skalalternativet er en funksjon som Corona SDK bruker til å tilpasse søknaden din til forskjellige skjermstørrelser. I tilfelle av letterBox-alternativet, forteller vi Corona å vise alt innholdet på skjermen mens du holder bildeforholdet. Når innholdet ikke dekker hele skjermen, viser appen sorte barer i områdene uten innhold (mye som å se på filmer i widescreen-modus).
Før vi fortsetter å bygge vår app, må vi snakke om grafikk. Det er mange forskjellige måter du kan få grafikk på for spillet ditt - ansett en grafisk designer, ansett en venn, tegne dem selv, eller til og med kjøpe lagergrafikk fra nettsteder som https://graphicriver.net/.
Men hvis du er på et budsjett, kan du ikke kjøpe disse grafikkene, eller du kan ikke ha tid til å lage dem. I slike situasjoner kan du bruke grafikk som er utgitt under Creative Commons-lisensen. Creative Commons-lisensen lar deg bruke grafikk som er fritt tilgjengelig under visse begrensninger, for eksempel å gi tilskudd til forfatteren.
For vårt spill skal vi bruke kunstverk under Creative Commons-lisensen fra OpenGameArt.org. Forfatteren som opprettet denne grafikken er VividRealtiy, og her er en direkte kobling til hans arbeid - http://opengameart.org/content/evolutius-gfx-pack. Før du fortsetter, sørg for å laste ned grafikksettet eller last ned filen for denne opplæringen.
Selv om det er massevis av nettsteder med grafikk under denne lisensen, er det tre nettsteder jeg besøker ofte:
Nå som vi har vår grafikk, kan vi fortsette å lage vårt spill! For å fortsette spillet må vi opprette en ny fil som heter main.lua. Denne filen vil være utgangspunktet for spillet vårt, og det er faktisk utgangspunktet for hvert spill laget med Corona. Når filen er opprettet, åpner du den i favorittredigeren din og skriver inn følgende kode:
-- skjul statuslinjen display.setStatusBar (display.HiddenStatusBar)
Denne linjen med kode vil gjemme statuslinjen på iOS. Deretter bruker vi Corona's storyboard-funksjon for å administrere spillet vårt. Historiebrettet funksjonen behandler ulike deler av spillet som scener for å gjøre det enklere for utviklere å administrere koden. For eksempel har spillet vårt tre scener - main.lua, menyen og spillskjermbildet. Når hver scene er satt opp, gir Corona en veldig enkel måte å flytte mellom scener. Siden dette kan være en stor hindring for utviklere som starter med Corona SDK, er det en grafisk fremstilling av utformingen av spillet vårt.
Hver blå boks representerer en individuell scene, og pilen mellom hver scene viser hvordan vi skal navigere gjennom scenene. Enkelt sagt, vi starter på main.lua og vil navigere frem og tilbake mellom Scene 2 og Scene 3.
Implementering av Storyboard i vår app er enkelt: Bare bruk modulen, og du er klar! Legg følgende kode i main.lua for å inkludere denne flotte funksjonen.
-- inkludere Corona "storyboard" -modulen lokal storyboard = kreve "storyboard"
Deretter vil vi flytte til den andre scenen, og vi vil bruke storyboardvariabelen for å oppnå dette.
-- last menyskjerm storyboard.gotoScene ("meny")
Nå som vi har fullført vår main.lua-fil, la oss takle hovedmenyen!
Hovedmenyen i spillet vårt vil vise et bakgrunnsbilde, spilltittelen og en Play Now-knapp. For å komme i gang, opprett en ny fil som heter menu.lua og Corona's storyboard.
lokal storyboard = krever ("storyboard") lokal scene = storyboard.newScene ()
Nå vil vi legge til Coronas widgetfunksjon for å lage vår knapp. Med widgetfunksjonen kan vi enkelt lage felles GUI-elementer som knapper i spillet vårt.
lokal widget = krever "widget"
Etter widgetbiblioteket, vil vi forhåndsdefinere noen variabler for spillet vårt. Disse variablene lagrer skjermbredden, skjermhøyden og midten av skjermkoordinatene.
lokal screenW, screenH, halfW, halfY = display.contentWidth, display.contentHeight, display.contentWidth * 0,5, display.contentHeight * 0,5
Etter våre variabler vil vi opprette vår aller første funksjon som heter scene: createScene ()
. Denne funksjonen kalles når scenen lastes for første gang, eller hvis scenen tidligere er fjernet. Generelt sett brukes denne funksjonen til å legge til alle de grafiske elementene på skjermen.
funksjonsscene: createScene (event) lokal gruppe = self.view end
En viktig funksjon i et storyboard er måten det håndterer objekter på. Alle skjermobjektene vi bruker innenfor denne scenen, blir plassert med variabelen. Ved å plassere våre visningsobjekter i denne gruppen, lar vi Corona vite at disse objektene tilhører denne scenen, og når scenen må fjernes, fjernes også disse objektene.
Inne i funksjonsscenen: createScene (), vil vi bruke den grafiske BKG.png (denne grafikken kom fra opengameart.org) som bakgrunn for spillet vårt. Når det er lagt til, vil vi sentrere grafikken på skjermen og sette den inn i gruppevariabelen.
-- vis et bakgrunnsbilde lokal bg = display.newImageRect ("images / BKG.png", 480, 320) bg.x = halfW bg.y = halvY gruppe: insert (bg)
Deretter plasserer vi vår spilltittel på skjermen ved hjelp av egendefinert skrift som vi angav i vår build.settings-fil.
-- plasser en spilltittel på skjermen lokal gametitle = display.newText ("Space Defender", 0,0, "Kemco Pixel", 40) gametitle.x = halfW gametitle.y = 100 gruppe: sett inn (gametitle)
Vårt siste tillegg til vår første funksjon er spillknappen. Spilleknappen vil bruke Corona's widgetfunksjon og en hendelselytter kalt onPlayBtnRelease
. Hendelseslytteren utløses når avspillingsknappen berøres. Legg til følgende kode inne i scene: createScene ()
funksjon.
Lokal funksjon onPlayBtnRelease () storyboard.gotoScene ("spill", "slideLeft") end playBtn = widget.newButton label = "Spill nå", labelColor = default = 255, defaultFile = "images / Button.png" , overFile = "images / Button_Purple.png", bredde = 150, høyde = 60, venstre = 180, topp = 150, font = "Kemco Pixel", fontSize = 18, onRelease = onPlayBtnRelease - hendelseslytterfunksjon (playBtn)
Etter vår skape scene funksjon, vil vi legge til en enter scene funksjon. Denne funksjonen utløses etter opprettelse av scene-funksjonen, og fjerner forrige scene.
funksjonsscene: enterScene (event) lokal gruppe = self.view hvis storyboard.getPrevious () ~ = null da storyboard.removeScene (storyboard.getPrevious ()) slutten
Den siste funksjonen vi vil legge til er destroyScene-funksjonen. Denne funksjonen kalles når scenen er fjernet eller ødelagt. I vårt tilfelle bruker vi widgets, og siden widgets må fjernes manuelt, fjerner vi widgeten i vår ødelagte scenefunksjon.
funksjonsscene: destroyScene (event) lokal gruppe = self.view hvis playBtn deretter playBtn: removeSelf () - widgets må fjernes manuelt playBtn = null sluttend
Til slutt legger vi hendelseslyttere til å ringe de forskjellige funksjonene vi setter opp - enterScene, destroyScene, og createScene.
scene: addEventListener ("createScene" scene) scene: addEventListener ("enterScene" scene) scene: addEventListener ("destroyScene" scene)
Og det er det for del 1! Vi har lært hvordan du konfigurerer vårt prosjekt, hvordan du implementerer Corona's storyboard-funksjon, hvordan du starter vår app, og hvordan du oppretter et menysystem. Les del 2 av denne serien nå!