I denne Quick Tip lærer du hvordan du lager et enkelt poeng system som kan utvides til dine egne spill. Denne opplæringen er for totalt nybegynnere, og i det lærer du hvordan du lager et sett med knapper som spilleren kan klikke for å legge til eller trekke poeng til eller fra poengsummen. Enkel!
Selv om denne opplæringen er for nybegynnere til Flash-programmering, må du vite litt om å bruke tegneverktøyene i Flash Professional. Hvis du trenger å lære hvordan du bruker tegneverktøyene, les denne artikkelen.
La oss se på det endelige resultatet vi vil jobbe for:
Åpne Flash og opprett et nytt Flash-dokument. Still dokumentstørrelsen til 550x400px, FPS (Rammer per sekund) til 24 og sett dokumentklassen til Hoved
.
For å lage grafikken bruker du det ovale verktøyet til å lage fire sirkler med en # 000000 (svart) disposisjon og en strekkstørrelse på 12,50.
Hver sirkel skal ha en annen fyllfarge. Fyllfargene er som følger:
Når du har opprettet mynter, bruker du statiske tekstbokser til å skrive de respektive verdiene som angitt i bildet ovenfor. Skriften jeg vil bruke gjennom hele denne opplæringen er Futura LT Heavy, med en størrelse på 50, men gjerne bruke din egen skrift og skriftstørrelse. Etter å ha fullført instruksjonen bør du ha 10 mynter, 50 mynter, 100 mynter og en -30 mynt.
Vi vil nå konvertere hver mynt til en MovieClip. Velg 10 Mynt og trykk F8. Du bør se en dialog slik:
Gjenta dette trinnet for 50 Coin, 100 Coin og -30 Coin og skriv inn følgende under Navn og Klasse boksene for hver Coin:
Når du har laget MovieClips ut av alle mynter, velger du dem alle og sletter dem fra scenen. Vi legger dem tilbake igjen senere, ved hjelp av kode.
For å fullføre dette trinnet opprett en statisk tekstboks med teksten "SCORE:" og plasser den med en X-verdi på 135 og en Y-verdi på 327.
I dette trinnet vil vi sette opp vår pakke og hovedklassen.
Opprett en ny ActionScript-klasse og under Klassenavnstype Hoved
. Når du har opprettet klassen, lagre den i samme mappe som din Flash-fil, og kontroller at den er lagret som Main.as
.
Skriv inn koden nedenfor i Main.as-filen din, og lagre den.
pakke // importerer nødvendige klasser import flash.display.MovieClip importer flash.events.MouseEvent; importer flash.text.TextField; importer flash.text.TextFormat; importer flash.text.TextFieldType; importere flash.events.Event; offentlig klasse Main utvider MovieClip var tenCoin: TenCoin = ny TenCoin (); // Skaper en ny forekomst av Ten Coin var fiftyCoin: FiftyCoin = new FiftyCoin (); // Skaper en ny forekomst av Femti Coin var hundredCoin: HundredCoin = new HundredCoin (); // Skaper en ny forekomst av Hundred Coin var badCoin: BadCoin = new BadCoin (); // Skaper en ny forekomst av -30 Myntvaren: Nummer = 0; // Setter poenget til null var scoreText: TextField = nytt TextField (); // Oppretter en tekstfelt for å vise poengsummen var scoreTextFormat: TextFormat = ny TextFormat ("Futura LT Heavy", 50, 0x000000); // Skaper et nytt format for Score-tekstfeltet, erstatt "Futura LT Heavy" med skrifttypen du bruker offentlig funksjon Main () displayObjects (); // Funksjonen som vi vil bruke til å vise hele grafikken på scenen setUpEventListeners (); // Funksjonen som vi skal bruke for å legge til våre Event Lyttere
Først importerer vi klassene vi trenger, og deretter setter vi opp dokumentklassen vår. Vi utvider deretter hovedklassen fra MovieClip; Vi kunne bruke Sprite, men det spiller ingen rolle. Deretter erklærer vi de variablene vi bruker, og vi legger til kode i vår Hoved()
funksjon (vår "konstruktørfunksjon").
De Hoved()
funksjonen vil vise alle mynter vi opprettet på scenen, og det vil også legge til Event Lyttere som vi trenger å bruke.
Merk: Du må legge inn skrifttypen i FLA for å få den til å vises i dynamiske tekstfelt hvis brukeren ikke har skrifttypen installert. Jeg har ikke gjort dette her, for å holde ting enkelt.
displayObjects ()
FunksjonDe displayObjects ()
Funksjonen kalles fra Hoved()
funksjon. Formålet med denne funksjonen er å legge til mynter og poengsumtekst til scenen og å plassere dem på riktig sted.
funksjon displayObjects () // Setter posisjonen til Ten Coin tenCoin.x = 72; tenCoin.y = 200; // Setter stillingen til Femti Mynt femtiCoin.x = 207; femtiCoin.y = 200; // Setter stillingen til Hundred Coin hundredCoin.x = 342; hundredCoin.y = 200; // Setter stillingen til -30 Mynt badCoin.x = 477; dårligCoin.y = 200; // Posisjoner poengsummen og setter sin type til dynamisk slik at den kan endres via kode scoreText.type = TextFieldType.DYNAMIC; scoreText.x = 305; scoreText.y = 327; scoreText.width = 300; // Setter formatet til poengsumtekstene scoreText.defaultTextFormat = scoreTextFormat; // legger alt til scenen addChild (tenCoin); addChild (fiftyCoin); addChild (hundredCoin); addChild (badCoin); addChild (scoreText);
setUpEventListeners ()
Funksjon og Event HandlersNå som vi har lagt til objekter på scenen, må vi opprette hendelseshåndteringsfunksjoner som utløses når du klikker på mynten. Vi vil også trenge en updateScore ()
funksjon å bruke slik at poenget blir oppdatert og forblir ikke det samme.
funksjon setUpEventListeners () // Endrer alle våre MovieClips til knapper tenCoin.buttonMode = true; femtiCoin.buttonMode = true; hundredCoin.buttonMode = true; badCoin.buttonMode = true; // Legger til hendelseslytterne for å legge til poeng til poengsummen tenCoin.addEventListener (MouseEvent.CLICK, addTenPoints); fiftyCoin.addEventListener (MouseEvent.CLICK, addFiftyPoints); hundredCoin.addEventListener (MouseEvent.CLICK, addHundredPoints); badCoin.addEventListener (MouseEvent.CLICK, removeThirtyPoints); // Legger til oppdateringsfunksjonen for å oppdatere poengstadiet.addEventListener (Event.ENTER_FRAME, updateScore);
Nå må vi kode funksjonene som endrer og oppdaterer poengsummen.
funksjon addTenPoints (evt: MouseEvent) score + = 10; // legger til 10 poeng til poengsummen funksjonen addFiftyPoints (evt: MouseEvent) score + = 50; // legger til 50 poeng til poengsummen funksjonen addHundredPoints (evt: MouseEvent) score + = 100; // legger 100 poeng til poengsummen funksjonen fjernThirtyPoints (evt: MouseEvent) score - = 30; // Subtraherer 30 poeng fra poenget // Dette hvis setningen ikke tillater poengsummen å gå under null hvis (poengsum < 10) score -= score; function updateScore(evt:Event) scoreText.text = String(score); //This converts the score variable from a number to a string, because our score textbox can only display strings //Closes the class //Closes the package
Koden din er nå klar for testing. Trykk CTRL + Enter (CMD + Enter på en Mac) og se poengsystemet ditt kommer til liv!
Nå kan du tenke, "Jeg har kastet bort tiden min, alt denne opplæringen lærte meg å gjøre var å lage noen knapper som gir deg poeng når du klikker dem" - men du har lært mer enn dette.
Se på dette som grunnlag for et mer avansert punktsystem. Du lærte hvordan du bruker + = og - = å legge til eller trekke fra et nummer, lærte deg hvordan du bruker hendelseslyttere, lærte deg å lage en funksjon for å oppdatere objekter mens SWF kjører, og du lærte hvordan du endrer et nummer til en streng og vise den i en dynamisk tekstboks som du opprettet helt gjennom kode!
Dette poengsystemet kan enkelt utvides til dine egne spill. For de av dere som er mer erfarne med Flash, kan du prøve å lage et spill som bruker en hitTestObject-funksjon og legger til poeng når du treffer et objekt.
Jeg håper du har lært noe nytt i dag. Takk for at du leste!