Lag en komplett Typing spillet i Flash med AS3

Create en komplett Typing spillet i Flash med AS3
7
Del
Del
Del

Denne Cyber ​​Monday Envato Tuts + kurs vil bli redusert til bare $ 3. Ikke gå glipp av.

Ledende på fra min tidligere tutorial på å oppdage tastaturkombinasjoner, vil vi se hvordan du kan bygge en komplett spill som tester dine skrive ferdigheter.




Endelig resultat Forhåndsvisning

La oss ta en titt på det endelige resultatet vi skal jobbe mot:

Bruk bokstavene på skjermen for å skrive engelske ord! Ugyldige ord mister du poeng, så se opp



Trinn 1:. Innledning

I denne opplæringen vi skal jobbe på en svært imponerende skrive spillet ved hjelp av denne svært nyttig Combo Detection klasse . Det er svært anbefales at du leser at opplæringen før du fortsetter her, slik at du forstår hva som klassen skal gjøre i løpet av spillet vårt.

I spillet vårt, vi vil ha mange blokker med bokstaver på skjermen, og Spilleren må skrive inn et ord dannet med brev blokker. Hvis det ordet er gyldig, blir blokkene fjernet og spilleren får poeng og mer tid til å spille. Spillet avsluttes når tiden når null

Hvis du har tenkt på helt å følge denne opplæringen, bør du ta tak i kildefilene



Trinn 2:.. Legge til bilder i Flash Professional

Som det ble gjort i den tidligere nevnte opplæringen, vil vi legge til alle bildene for spillet vårt i en Flash Professional FLA fil, deretter generere en .swc fil, som vil bli lagt inn i vår FlashDevelop prosjekt for bruk.

For denne opplæringen, vi trenger et bakgrunnsbilde (takk for Petr Kovar® for kjempebra tre bakgrunnen!), en generisk blokk bilde med en valgt ramme og foreløpig skrevet nøkler boks. Du kan finne alt satt opp i våre kildefilene.

Andre bilder som preloader og game over skjermen vil bli lagt i tillegg, men disse vil bli gjort i løpet av opplæringen, siden det er mer fornuftig å gjøre så



Trinn 3:. Den LetterBlock

Før vi kan begynne å arbeide på vår kode, la oss sette opp vår FlashDevelop prosjekt. Dette kommer til å bli en AS3 Prosjekt med Preloader, så velger du det alternativet på FlashDevelop! Forutsatt at du har lest komboer opplæringen, har du sannsynligvis vet hvordan du legger en .swc fil til FlashDevelop bibliotek. Hvis du ikke gjør det, bare høyreklikke på den og velge "Legg til i bibliotek". Grab .swc filen fra kilden og legger det. Det er alt. Tid for handling!

Vårt brev blokk vil være et enkelt objekt med en Textfield i det og blokken bildet som vises i trinn 2. Coding som er enkel. Opprett LetterBlock Klasse:
pakke {import ArtAssets.LetterBlockImage; import flash.display.MovieClip; import flash.display.Sprite; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFormatAlign; public class LetterBlock strekker Sprite {private Var _image: MovieClip; private Var _letterText: Textfield; offentlig funksjon LetterBlock () {_image = new LetterBlockImage (); _image.stop (); _letterText = new Textfield (); _letterText.defaultTextFormat = new tekstformat ("Verdana", 40, 0xFFFFFF, sant, null, null, null, null, TextFormatAlign.CENTER); _letterText.width = 60; _letterText.x = -30; _letterText.y = -26,3; _letterText.selectable = false; _letterText.multiline = false; addChild (_image); addChild (_letterText); } Offentlig funksjon setLetter (brev: String): void {_letterText.text = brev; }}}

Lines 21-28 lage tekstfeltet for å holde vårt brev tekst, samt posisjon den på skjermen og gi det en font, farge font og størrelse. Den setLetter funksjonen brukes bare til å sette bokstaven i boksen



Trinn 4:. Laster opp Words

Hver skrive spillet trenger ord å jobbe med. I dette trinnet, vil vi legge i en ekstern fil gjennom [Bygg] tag og arbeide med dataene i filen. Selvfølgelig inneholder denne filen ord som skal brukes i spillet vårt. Den er tilgjengelig i kildefilene. Også i dette trinnet begynner vi å jobbe med ComboHandler klassen, så legg den i FlashDevelop prosjektet samt

La oss se på noen kode:

I Main.as:
privat funksjon init (e: Hendelses = null): void {removeEventListener (Event.ADDED_TO_STAGE, init); ComboHandler.initialize (scene); DictionaryWords.loadWords ();}

Linje 5 ovenfor initialiserer ComboHandler, samtaler etter behov, og linje 7 de loadWords () -metoden fra DictionaryWords klassen. Denne klassen vil bli skapt av oss, og dens kode er rett under:
pakke {public class DictionaryWords {[Bygg (kilde = "../src/Words.txt", mimetype = "application /octet-stream") ] private Static Var _Words: klasse; public static funksjons loadWords (): void {var ord: String = nye _Words (); Var wordsArray: Array = words.split ("\\ n"); Var i: int; Var lengde: int = wordsArray.length; for (i = 0; i < lengde; i ++) {ComboHandler.registerCombo (wordsArray [i], turnIntoLetters (wordsArray [i])); }} Private statiske funksjons turnIntoLetters (word: String): Array {var bokstaver: Array = word.split (""); if (bokstaver [0] == "") {letters.shift (); } If (bokstaver [letters.length - 1] == "") {letters.pop (); } Var i: int; for (i = 0; i < letters.length; i ++) {bokstaver [i] = String (bokstaver [i]) charCodeAt (0).; } Returnere bokstaver; }}}

Linje 5 er linjen som laster den eksterne filen og legg den i spillet ved kompilering-tid. Dette er alt mulig på grunn av [Bygg] taggen. Hvis du ønsker mer informasjon om det, jeg anbefaler denne flotte artikkelen om Adobe LiveDocs.

Her er en del av Words.txt
, slik at du kan se hva vi jobber with:
ABBREVIATORABCABCOULOMBABCSABDIASABDICABLEABDICATEABDICATIONABDICATORABDOMENABDOMINALABDOMINOCENTESISABDOMINOPLASTY

Line 12 (av DictionaryWords.as
) er en svært viktig linje. I utgangspunktet, det viser alle ordene fra Words.txt, som ble lagret i en String, til elementer i en matrise. Siden hvert ord er atskilt med et linjeskift karakter, alt vi måtte gjøre var å ringe split () metoden i String-klassen.

turnIntoLetters funksjonen bare slår et ord inn i en Array med nøkkelkoder for hver bokstav . På den måten kan våre ComboHandler klasse jobbe med det



Trinn 5:. Legge Letter Blocks til Screen

Nå som vi har våre ord klar i spillet, er det på tide å begynne å arbeide med å sette bokstavene på skjermen. Dette er meget enkel. Først av alt, vi trenger en spillskjermen. Den GameScreen klassen vil inneholde all logikk spillet vårt
pakke {import ArtAssets.BackgroundImage.; import flash.display.Sprite; import adobe.utils.CustomActions; public class GameScreen strekker Sprite {private Var _background: BackgroundImage; . privat Var _blocksOnScreen: Vector < LetterBlock >; offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (); populateBlocks (); } Private funksjon populateBlocks (): void {var i: int; Var tempBlock: LetterBlock; for (i = 0; i < 8; i ++) {tempBlock = new LetterBlock (); tempBlock.x = 130 + ((i% 4) * 95); tempBlock.y = 80 + int (i /4) * 80; tempBlock.setLetter (randomLetter ()); addChild (tempBlock); _blocksOnScreen.push (tempBlock); tempBlock = null; }} Privat funksjon randomLetter (): String {return String.fromCharCode ((int (Math.random () * 26) + 65)); }}}

_blocksOnScreen Vector er hovedelementet i denne koden: det vil inneholde alle blokkene på skjermen, slik at vi kan jobbe med dem når som helst vi ønsker. Merk at i linje 14 legger vi BackgroundImage på skjermen, som er en grafisk fra .swc filen.

Innenfor populateBlocks () -funksjonen, alt vi gjør er å legge en ny LetterBlock på en bestemt posisjon, gi den et tilfeldig brev (som er generert av randomLetter () -funksjonen) og legge den til skjermen.

Nå må vi legge spillet skjermen i Main barn. Inne Main.as:
private Var _gameScreen: GameScreen; privat funksjon init (e: Hendelses = null): void {removeEventListener (Event.ADDED_TO_STAGE, init); ComboHandler.initialize (scene); DictionaryWords.loadWords (); _gameScreen = new GameScreen (); addChild (_gameScreen); }

Compile prosjektet, og du vil være i stand til å se blokkene på skjermen



Trinn 6: Velge en blokk etter et tastetrykk

I spillet vårt, vi vil blokken til å gå til sin "Selected" bilde når den tilsvarende tasten er trykket. Dette er veldig enkelt å gjøre. Gå til LetterBlock.as filen og legge inn denne koden:
private Var _selected: Boolean; offentlig funksjon velge (): void {_selected = _selected;! _image.gotoAndStop (? _selected == true "Selected": "Ikke valgt");} offentlig funksjon get brev (): String {return _letterText.text;} offentlig funksjon blir valgt (): Boolean {return _selected;}

Den _selected variable vil bli brukt på spillets logikk for å sjekke om en blokk er valgt eller ikke. Det samme skjer med brev.

Alt som er igjen er å gjøre blokken veksle mellom "valgt" og "umerket" nå. Inne GameScreen.as:
import flash.events.Event, import flash.events.KeyboardEvent; //** klipp ** offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (); populateBlocks (); addEventListener (Event.ADDED_TO_STAGE, på scenen);} private funksjon på scenen (e: Hendelses): void {removeEventListener (Event.ADDED_TO_STAGE, på scenen); stage.addEventListener (KeyboardEvent.KEY_DOWN, onkeydown);} private funksjon onkeydown (e: KeyboardEvent): void {var i: int; for (i = 0; i < _blocksOnScreen.length; i ++) {if (_blocksOnScreen [i] .letter == String.fromCharCode (e.keyCode) & &! _blocksOnScreen [i] .selected) {_blocksOnScreen [i ].velge(); gå i stykker; }}}

Gitt at vi bør legge våre KeyboardEvent lyttere til scenen, i GameScreen konstruktør, legger vi en lytter for Event.ADDED_TO_STAGE, noe som vil føre oss til scenen () -funksjonen. Denne funksjonen legger lytteren til scenen. Den onkeydown () -funksjonen er ansvarlig for å gå over alle blokkene på skjermen og verifisere om det er noen blokk med bokstaven trykket. Hvis ja, så vi bør velge det som er gjort i tråd 36.

Etter kompilering prosjektet, dette er hva vi får:

(Trykk på tastene på tastaturet!)



Trinn 7: Endringer i den ComboHandler Class

For at spillet vårt til å fungere slik vi ønsker, vi må gjøre noen modifikasjoner på ComboHandler klasse fra forrige tutorial . Den første endringen er å gjøre det i stand til å bare se etter en combo når brukeren har sluttet å skrive. Dette vil bli detektert med MAX_INTERVAL konstant og gjennom en oppdatering () -funksjonen. Også, siden brukeren må skrive inn eksakte ord bokstaver for å "fullføre" det, vil vi endre hvordan vi sjekker om en combo kamper nøklene inne i pressedKeys Array. Den siste endringen er å sende en hendelse selv når ordet skrevet er feil. Dette vil tillate spillet vårt til å gjenkjenne spillerens feil og straffe ham for det

All koden under gjør det som ble forklart.

Inside ComboHandler.as:
privat statisk konst MAX_INTERVAL: int = 500; //Millisecondsprivate Static Var checkComboAfterClearing: Boolean; public static funksjonen initialize (stageReference: Stage, checkComboAfterClearing: Boolean = false): void {combos = new ordbok (); intervall = 0; sentralen = new EventDispatcher (); ComboHandler.checkComboAfterClearing = checkComboAfterClearing; pressedKeys = []; stageReference.addEventListener (KeyboardEvent.KEY_DOWN, onkeydown);} private static funksjon onkeydown (e: KeyboardEvent): void {if (getTimer () - intervall > MAX_INTERVAL) {pressedKeys = []; } Intervall = getTimer (); pressedKeys.push (e.keyCode); if (checkComboAfterClearing!) {checkForCombo (); }} public static funksjon oppdateringen (): void {if (getTimer () - intervall > MAX_INTERVAL) {checkForCombo (); pressedKeys = []; }} private static funksjon checkForCombo (): void {if (pressedKeys.length == 0) {return; } Var i: int; Var comboFound: String = ""; for (var comboName: String i kombinasjoner) {if ((combos [comboName] som Array) .length == 0) {fortsette; } If (pressedKeys.join ("") == (combos [comboName] som Array) .join ("")) {comboFound = comboName; gå i stykker; }} //Combo Funnet //if (comboFound = ""!) //{//PressedKeys = []; dispatcher.dispatchEvent (ny ComboEvent (ComboEvent.COMBO_FINISHED, {comboName: comboFound})); //}}

Vi endret vår ComboHandler konstruktør erklæring for å tillate oss se etter kombinasjoner bare etter at brukeren har sluttet å skrive. Dette er bekreftet i oppdateringen () funksjonen, bruker MAX_INTERVAL konstant. Dessuten har checkForCombo () -funksjonen blitt modifisert til å bruke en mer egnet combo sjekke

Nå har vi også må endre GameScreen klassen å oppdatere ComboHandler klassen.
Offentlig funksjon GameScreen () {_background = ny BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (); populateBlocks (); addEventListener (Event.ADDED_TO_STAGE, på scenen); addEventListener (Event.ENTER_FRAME, gameLoop);} private funksjon gameLoop (e: Hendelses): void {ComboHandler.update ();}

Oppdateringen blir gjort gjennom en Event.ENTER_FRAME hendelse lytteren, siden det er en enkel og god tilnærming

Den siste endringen er å endre hvordan vi initialisere ComboHandler klassen inne i hovedklassen:
privat funksjon init (e: Hendelses = null). void {removeEventListener (Event.ADDED_TO_STAGE, init); ComboHandler.initialize (stadium, true); DictionaryWords.loadWords (); _gameScreen = new GameScreen (); addChild (_gameScreen);}

Ved å sammenstille spillet, dette er hva vi får:



Trinn 8: Legge Ordet Box

Det er på tide å gi spilleren noe annet å stole på. Akkurat nå, kan spilleren ikke se sekvens av bokstaver som allerede var skrevet, så la oss legge til et ord boksen i spillet. Denne boksen vil inneholde i dag skrevet brev, organisert etter bestilling, og vil bli rengjort når en combo hendelsen har blitt mottatt. Opprett WordBox klassen og legge denne koden til det:
pakke {import ArtAssets.TypedLettersBoxImage; import flash.display.Sprite; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFormatAlign; public class WordBox strekker Sprite {private Var _image: Sprite; private Var _textField: Textfield; offentlig funksjon WordBox () {_image = new TypedLettersBoxImage (); _textField = new Textfield (); _textField.defaultTextFormat = new tekstformat ("Verdana", 30, 0xFFFFFF, sant, null, null, null, null, TextFormatAlign.CENTER); _textField.width = 500; _textField.x = -250; _textField.y = -25; _textField.selectable = false; _textField.multiline = false; _textField.text = ""; addChild (_image); addChild (_textField); } Offentlig funksjon addLetter (brev: String): void {_textField.appendText (brev); } Offentlig funksjon klart (): void {_textField.text = ""; }}}

Denne klassen er nesten det samme som LetterBlock klassen, så ingen omfattende forklaring er nødvendig. Det eneste som fortjener oppmerksomhet er linje 35, som inneholder et kall til appendText () -metoden fra String klassen. Denne funksjonen vil legge til tekst til slutten av gjeldende tekst, slik at vi kan vise de skrevet brev alltid på slutten av den aktuelle teksten fra ordet boksen.

Nå er det på tide å legge til ordet boksen i spill. Gå til GameScreen.as og legge inn denne koden:
private Var _wordBox: WordBox; offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (); populateBlocks (); _wordBox = new WordBox (); _wordBox.x = 275; _wordBox.y = 350; addChild (_wordBox); addEventListener (Event.ADDED_TO_STAGE, på scenen); addEventListener (Event.ENTER_FRAME, gameLoop);} private funksjon onkeydown (e: KeyboardEvent): void {var i: int; for (i = 0; i < _blocksOnScreen.length; i ++) {if (_blocksOnScreen [i] .letter == String.fromCharCode (e.keyCode) & &! _blocksOnScreen [i] .selected) {_blocksOnScreen [i ].velge(); _wordBox.addLetter (_blocksOnScreen [i] .letter); gå i stykker; }}}

Lines 1, 15-17 og 19 skape ordet esken og sette den på skjermen. Linje 36 kaller addLetter () -funksjonen til å legge et brev i boksen.

Resultatet av dette trinnet er under. Vi vil legge til koden for å fjerne ordet boksen i neste trinn



Trinn 9:. Integrering vår ComboHandler Med vår GameScreen

Akkurat nå, de eneste endringene som har blitt gjort i den ComboHandler bare endres når og hvordan de skal se etter kombinasjoner. Dette er den delen der det blir moro: vi vil integrere vår ComboHandler i spillet. Dette betyr vår ComboHandler vil avhenge GameScreen for å kjøre. La oss hoppe til koden, og se forklaringer etter at det

Inside GameScreen.as:
offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (8); populateBlocks (); _wordBox = new WordBox (); _wordBox.x = 275; _wordBox.y = 350; addChild (_wordBox); addEventListener (Event.ADDED_TO_STAGE, på scenen); addEventListener (Event.ENTER_FRAME, gameLoop); ComboHandler.dispatcher.addEventListener (ComboEvent.COMBO_FINISHED, onWordFinished); ComboHandler.setGameInstance (denne);} private funksjon onWordFinished (e: ComboEvent): void {_wordBox.clear ();} offentlig funksjon isKeyAvailable (nøkkel: String): Boolean {var i: int; for (i = 0; i < _blocksOnScreen.length; i ++) {if (_blocksOnScreen [i] .letter == nøkkel & & _blocksOnScreen [i] .selected!) {return true; }} Return false;} private funksjons populateBlocks (): void {var i: int; Var tempBlock: LetterBlock; for (i = 0; i < 8; i ++) {tempBlock = new LetterBlock (); tempBlock.x = 130 + ((i% 4) * 95); tempBlock.y = 80 + int (i /4) * 80; tempBlock.setLetter (randomLetter ()); addChild (tempBlock); _blocksOnScreen [i] = tempBlock; tempBlock = null; }}

Inside GameScreen konstruktør, la vi til en hendelse lytteren til ComboHandler sin sentralen objekt, og ringte setGameInstance () funksjon av den klassen (som vil bli lagt under). Dette vil gi den gjeldende forekomsten av spillet skjermen til ComboHandler klassen, og vil fjerne ordet boksen.

Det er også en isKeyAvailable funksjon som er opprettet. Dette vil bli kalt innen kombinasjonsbehandling for å kontrollere om det kan legge en nøkkel til listen over presset nøkler.

Linje 63 er bare en fiks til endringen gjøres i _blocksInScreen i konstruktøren.

Ta en titt på koden for å legge inne ComboHandler.as:
privat Static Var gameInstance: GameScreen; public static funksjon setGameInstance (gameInstance: GameScreen): void {ComboHandler.gameInstance = gameInstance;} private static funksjon onkeydown (e: KeyboardEvent): void {if (getTimer () - intervall > MAX_INTERVAL) {pressedKeys = []; } If (gameInstance.isKeyAvailable (String.fromCharCode (e.keyCode))) {intervall = getTimer (); pressedKeys.push (e.keyCode); } If (checkComboAfterClearing!) {CheckForCombo (); }}

I den markerte linjen legger vi et kall til isKeyAvailable (), som er i spillet skjermen eksempel lagret i ComboHandler klassen. Dette er slutten av integrasjonen mellom spillet og kombinasjonsbehandling

Etter kompilering, vil du legge merke til at spillet klarner nå ordet boks etter intervall har passert.



Trinn 10: Lov Når en ordet er skrevet

I dette trinnet, vil vi gjøre spillet ta litt action når et ord har blitt oppdaget. Først av alt, må vi vite når et ord har blitt oppdaget. La oss finne ut hvordan:

Inside GameScreen.as:
offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (8); populateBlocks (); _wordBox = new WordBox (); _wordBox.x = 275; _wordBox.y = 350; addChild (_wordBox); addEventListener (Event.ADDED_TO_STAGE, på scenen); addEventListener (Event.ENTER_FRAME, gameLoop); ComboHandler.dispatcher.addEventListener (ComboEvent.COMBO_FINISHED, onWordFinished); ComboHandler.setGameInstance (denne);} private funksjon onWordFinished (e: ComboEvent): void {if (! E.params.comboName = "") {removeSelectedLetters (); populateBlocks (); _wordBox.clear (); }} private funksjons removeSelectedLetters (): void {var i: int; for (i = 0; i < 8; i ++) {if (_blocksOnScreen [i] .selected) {removeChild (_blocksOnScreen [i]); _blocksOnScreen [i] = null; }}} Private funksjons populateBlocks (): void {var i: int; Var tempBlock: LetterBlock; for (i = 0; i < 8; i ++) {if (_blocksOnScreen [i] == null) {tempBlock = new LetterBlock (); tempBlock.x = 130 + ((i% 4) * 95); tempBlock.y = 80 + int (i /4) * 80; tempBlock.setLetter (randomLetter ()); addChild (tempBlock); _blocksOnScreen [i] = tempBlock; } TempBlock = null; }}

I tråd 23 det er en hendelse lytteren for ComboEvent.COMBO_FINISHED. Denne hendelsen vil bli skutt hver gang et ord har blitt dannet eller når spilleren har savnet. Hvis du går tilbake til ComboHandler.as, vil du legge merke til at når spilleren bommer, vil navnet på combo innenfor sparken tilfelle være null, eller "". På grunn av det, gjør vi innsjekk linjer 28-34. Den removeSelectedLetters () -funksjonen vil fjerne alle valgte bokstaver, siden spilleren har dannet et ord når det kalles. Vi har også endret populateBlocks () -funksjonen til å bare sette en ny blokk på steder der det ikke er noen blokk - dette passer det vi gjør inne i funksjon for å fjerne blokker

Compile spillet, og dette er resultatet.



Trinn 11: gjøre noe når de spiller Typer et feil ord

Har du fått noen ide om hva du skal gjøre når en spiller savner et ord? Jeg tenkte på å ta bort tid og score fra spilleren (dette vil bli gjort i senere trinn), samt gi en 30% sjanse for å endre en valgt brev fra misstyped ordet. Koden nedenfor gjør nøyaktig det sistnevnte. Flytt til GameScreen.as:
privat funksjon onWordFinished (e: ComboEvent): void {if (e.params.comboName = "") {removeSelectedLetters (false); } Else {removeSelectedLetters (true); } PopulateBlocks (); _wordBox.clear ();} private funksjons removeSelectedLetters (wasFromFailure: Boolean): void {var i: int; for (i = 0; i < 8; i ++) {if (_blocksOnScreen [i] .selected) {if ((wasFromFailure & & Math.random () < 0,3) || wasFromFailure!) {removeChild (_blocksOnScreen [jeg]); _blocksOnScreen [i] = null; } Else {_blocksOnScreen [i] .Velg (); }}}}

Før vi ser på linjene 5 og 9, la oss hoppe til linje 25: i denne linjen, er wasFromFailure variabelen som vil definere om spillet skal "beregne" en 30% sjanse (gjennom Math.random () ) eller bare erstatte blokken. Og hvordan er denne verdien gått? Se på linjene 5 og 9: hvis navnet på ordet er ingenting, eller "", betyr at spilleren har bommet på ordet, som betyr at vi skal passere tro mot removeSelectedLetters ()

Compile prosjektet og. prøver å skrive et feil ord



Trinn 12: Legg en Score

Det er nå på tide å legge en poengsum i spillet! Først vil vi lage bildet og plassere den på skjermen. I neste trinn, vil vi gi poengsum til spilleren. For score, må vi opprette en Score klasse, og dette er koden for det:
pakke {import flash.display.Sprite; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFormatAlign; public class Score strekker Sprite {private Var _text: Textfield; private Var _score: int; offentlig funksjon Score () {_text = new Textfield (); _text.defaultTextFormat = new tekstformat ("Verdana", 40, 0xFFFFFF, sant, null, null, null, null, TextFormatAlign.CENTER); _text.width = 500; _text.selectable = false; _text.multiline = false; addChild (_text); _score = 0; _text.text = "Resultat:" + _score.toString (); } Offentlig funksjon addToScore (verdi: int): void {_score + = verdi; _text.text = "Resultat:" + _score.toString (); }}}

Jeg tror det er ikke mye å si om det - vi har allerede gjort tekst som dette to ganger før. Nå skal vi legge dette resultatet på skjermen. Inne GameScreen.as:
private Var _score: Score; offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (8); populateBlocks (); _wordBox = new WordBox (); _wordBox.x = 275; _wordBox.y = 350; addChild (_wordBox); _score = new Score (); _score.x = 25; _score.y = 210; addChild (_score); addEventListener (Event.ADDED_TO_STAGE, på scenen); addEventListener (Event.ENTER_FRAME, gameLoop); ComboHandler.dispatcher.addEventListener (ComboEvent.COMBO_FINISHED, onWordFinished); ComboHandler.setGameInstance (denne);}

Det du går. Kompilere prosjekt, og du kan nå se resultatet



Trinn 13: Gi og ta Score

Nå som stillingen er allerede lagt på skjermen, er alt vi har å gjøre gi poengsum til spilleren når han fullfører et ord, og ta bort poengsum når han savner det. Koden i GameScreen.as:
private funksjons removeSelectedLetters (wasFromFailure: Boolean): void {var i: int; Var count: int = 0; for (i = 0; i < 8; i ++) {if (_blocksOnScreen [i] .selected) {teller ++; if ((wasFromFailure & & Math.random () < 0,3) || wasFromFailure!) {removeChild (_blocksOnScreen [i]); _blocksOnScreen [i] = null; } Else {_blocksOnScreen [i] .Velg (); }}} If (wasFromFailure) {_score.addToScore (- (telle * 10)); } Else {_score.addToScore (telle * 30); }}

Som du kan se, er det veldig enkelt: Vi gir 30 ganger så mange bokstavene i et ord til spilleren, og ta bort 10 ganger antall bokstaver i feilstavet ord. Den kompilerte Spillet er under for testing



Trinn 14: Legg en Timer

Legge til en timer vil være nesten det samme som satte ballen i mål. Det vil bare være én forskjell: vi må være stadig oppdaterer timer, og timeren vil ha en annen tekst. Ta en titt på koden for Timer.as nedenfor:
pakke {import flash.display.Sprite; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFormatAlign; public class Timer strekker Sprite {private Var _text: Textfield; private Var _value: int; offentlig funksjon Timer () {_text = new Textfield (); _text.defaultTextFormat = new tekstformat ("Verdana", 20, 0xff0000, sant, null, null, null, null, TextFormatAlign.LEFT); _text.width = 200; _text.selectable = false; _text.multiline = false; addChild (_text); _value = 30; _text.text = "Tid:" + timeString (); } Private funksjon timeString (): String {var minutter: int = _value /60; Var sekunder: int = _value% 60; returnere minutes.toString () + ":" + seconds.toString (); } Offentlig funksjon addToTime (verdi: int): void {_value + = verdi; _text.text = "Tid:" + timeString (); }}}

Som du kanskje har lagt merke til i linjene 33, 35 og 37, skaper vi en annen tekst for tidtaker. Det vil bestå av minutter og sekunder. For at det skal fungere, vil _value være tid igjen i spillet i løpet av sekunder. Nå koden for å legge inn tidsuret, i GameScreen.as:
private Var _timer: Timer; offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (8); populateBlocks (); _wordBox = new WordBox (); _wordBox.x = 275; _wordBox.y = 350; addChild (_wordBox); _score = new Score (); _score.x = 25; _score.y = 210; addChild (_score); _timer = new Timer (); addChild (_timer); addEventListener (Event.ADDED_TO_STAGE, på scenen); ComboHandler.dispatcher.addEventListener (ComboEvent.COMBO_FINISHED, onWordFinished); ComboHandler.setGameInstance (denne);}

Det er ingen forklaringer trengs i koden, så treffer kompilere knappen og ta en titt på timeren din

Men det er ikke å telle ned, er det? La oss gjøre det



Trinn 15: Redusere og øke tiden Venstre

Som omtalt i forrige trinn, må timeren til å være konstant oppdatert. Dette er fordi det er stadig synkende, andre ved andre. Dessuten bør vi belønne spilleren flere sekunder når et ord er fullført, og ta bort noe tid når et ord er skrevet feil. Inne GameScreen.as:
private Var _updateTimer: Number; offentlig funksjon GameScreen () {_background = new BackgroundImage (); _background.x = 275; _background.y = 200; addChild (_background); _blocksOnScreen = new Vector. < LetterBlock > (8); populateBlocks (); _wordBox = new WordBox (); _wordBox.x = 275; _wordBox.y = 350; addChild (_wordBox); _score = new Score (); _score.x = 25; _score.y = 210; addChild (_score); _timer = new Timer (); addChild (_timer); addEventListener (Event.ADDED_TO_STAGE, på scenen); addEventListener (Event.ENTER_FRAME, gameLoop); ComboHandler.dispatcher.addEventListener (ComboEvent.COMBO_FINISHED, onWordFinished); ComboHandler.setGameInstance (denne); _updateTimer = 0;} private funksjon gameLoop (e: Hendelses): void {ComboHandler.update (); _updateTimer + = 1/30; if (_updateTimer > = 1) {_updateTimer - = 1; _timer.addToTime (1); }} private funksjons removeSelectedLetters (wasFromFailure: Boolean): void {var i: int; Var count: int = 0; for (i = 0; i < 8; i ++) {if (_blocksOnScreen [i] .selected) {teller ++; if ((wasFromFailure & & Math.random () < 0,3) || wasFromFailure!) {removeChild (_blocksOnScreen [i]); _blocksOnScreen [i] = null; } Else {_blocksOnScreen [i] .Velg (); }}} If (wasFromFailure) {_score.addToScore (- (telle * 10)); _timer.addToTime (-Telle); } Else {_score.addToScore (telle * 30); _timer.addToTime (count * 2); }}

Linjene 1, 27, 29 og 33 skaper timeren, satte den på skjermen og legge til en hendelse lytteren for Event.ENTER_FRAME. Dette lytteren vil legge 1/30 av et sekund å _updateTimer på hver ramme (vi antar her at spillet kjører på 30 fps. Hvis den kjører på 24 fps, for eksempel, bør det legge 1 tjuefiredel av et sekund) . Når _updateTimer når en eller flere enn ett sekund, 1 er redusert fra timeren verdi. I linjene 84 og 89, vi minske og øke tiden, henholdsvis, basert på om spilleren har dannet en "akseptabel" ord eller ikke.

Også når brukeren mistypes et ord, et beløp på sekunder lik antall bokstaver er redusert fra spillet timer. . Hvis et ord er korrekt, spillet utmerkelser dobbelt så mange bokstaver som sekunder for spilleren

Dette er resultatet:



Trinn 16: Forbedre vår Random Letter Creation Process

I dagens spill, noen ganger for noen vokaler vises på skjermen. Som gjør det ekstremt vanskelig å lage ord. I dette trinnet skal vi endre det. Løsningen er svært enkel: vi vil bruke en matrise basert på vekt

Denne rekken inneholder alle bokstavene i alfabetet, og vi vil få et brev ved å åpne en tilfeldig indeks innen tabellens grenser.. Imidlertid vil "vekt" av hver bokstav være forskjellig. "Vekt" er ganske enkelt antall bokstaver i matrisen, slik at hvis bokstaven "R" har en vekt 2, for eksempel, er det to "R" s i tabellen. Ser fra en sannsynlighets perspektiv, jo mer nummeret du har av et brev, jo høyere sjanse for å få tilgang til det.

Koden vil sikkert bidra til å forklare det. Denne koden skal plasseres inne GameScreen.as:
private Var _letters: Array = ["A", "A", "A", "B", "C", "D", "E", "E "," E "," F "," G "," H "," I "," I "," I "," J "," K "," L "," M "," N ", "O", "O", "O", "P", "Q", "R", "R", "S", "T", "U", "U", "U", "V "," W "," X "," Y "," Z "]; privat funksjon randomLetter (): String {return _letters [int (Math.random () * _letters.length)];}

I tråd 1, kan du se utvalget av bokstaver. Hver vokal har vekt 3, som betyr at det alltid er tre av dem, og bokstaven "R" har vekt 2. Dette er et ekstremt forenklet array, men mye mer kan gjøres med sin idé.

Her er en annen måte å si det som gjør de relative vektene klarere:
private Var _letters: Array = ["A", "A", "A", "B", "C", "D", "E", "E", "E", "F", "G", "H", "I", "I", "I", "J", "K", "L", "M", "N import flash.display.Sprite; import flash.events.Event;