Quick Tips: Custom Crosshair Markør og Gunshot Sound

Quick Tips: Custom Crosshair Markør og Gunshot Sound
Del
Del
Del
Del

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

I denne hurtig Tips vi vil lage en egendefinert trådkors sammen med en skudd lyd. Dette kan være grunnlaget for en shoot-'em-up spill. I dette eksempelet legger vi kulehull på scenen på det punktet der du klikker



. Merk: På tross av den nye Native Markør funksjon introdusert i FP10.2 denne old-school-metoden er fortsatt en gyldig måte å skape en tilpasset markøren. Det har fordelen av slik at du kan bruke større grafikk, pluss det vil fungere med eldre versjoner av Flash Player. Vi vil ta en titt på Native Markør er i FP10.2 morgen:)

kort oversikt

I SWF vil du se et Start-knappen. Når du klikker på denne knappen, blir musen et trådkors klar til å gjøre noen skade. Når du klikker rundt på scenen, et skudd lyd skuespill og et kulehull grafisk blir lagt til scenen på det punktet der du klikket med musen



Trinn 1:. Sette opp Document

Åpne en ny Flash dokument og angi følgende egenskaper

Dokumentstørrelse: 500x400px

Bakgrunnsfarge: #FFFFFF



Trinn 2: Sette opp spillet Elements

For Start-knappen, trakk jeg et avrundet rektangel og plassert litt tekst med ordet starter på den. Jeg deretter konvertert Button og tekst til en MovieClip ved å tegne en markering rundt dem og trykke F8. Jeg ga knappen navnet startGame, og brukes også startGame som forekomstnavnet i Properties panelet. Hvis Properties panelet ikke vises for deg, gå til Meny- > Window > Properties
eller bare trykk på CTRL + F3

Inkludert i øvelsen. filer er to bilder: en er trådkorset grafikken, og den andre er bullethole grafikken. Jeg importerte disse en om gangen til scenen og konvertert dem til en MovieClip ved å klikke på dem og trykke F8. Jeg ga dem de forekomstnavn "BulletHole" og "trådkors", laget for at registreringspunktene ble satt til midten i begge tilfeller, og brukte samme navn for klassen i Heis av hvert symbol. Nedenfor er et bilde av hvordan jeg setter opp BulletHole; det er det samme for trådkorset.

For lyden, importert jeg det til biblioteket deretter høyreklikket det og utvalgte egenskaper. Jeg ga det navnet skudd og sette Heis klasse som skudd også.

Nå som vi har alle våre spillelementer klar vi kan dykke inn i koden.



Trinn 3: Sett opp pakken og Main Class

Her har vi satt opp vår pakke og den viktigste klassen for spillet vårt

Først importerer vi noen klasser vi trenger, så vi satt opp vår dokument klasse. Dette hoved klasse må strekke seg enten MovieClip eller Sprite; her vi utvider MovieClip. Erklærer vi så noen variabler vi skal bruke, og koden vår konstruktør funksjon. Konstruktøren funksjonen tilføyer en hendelse lytteren til knappen, som er der vi satt opp resten av spillet
pakke {import flash.display.MovieClip.; import flash.events.MouseEvent; import flash.ui.Mouse; import flash.media.Sound; import flash.media.SoundChannel; public class Hoved strekker MovieClip {//De filmklipp og lyd i biblioteket Var trådkorset: Crosshair = new Crosshair (); Var bullethole: BulletHole; Var skudd: skudd = new skudd (); //Trengs for skudd lyden Var soundChannel: SoundChannel = nye SoundChannel; //Hvorvidt brukeren har klikket en gang Var firstShot = true; } Offentlig funksjon main () {//Show hånd markøren når brukeren mus over knappen startGame.buttonMode = true; startGame.addEventListener (MouseEvent.CLICK, startTheGame); }}



Trinn 4: Koding av startTheGame () Funksjon

startTheGame () funksjonen kalles når brukeren klikker på knappen. Denne funksjonen fjerner knappen fra scenen, skjuler Mouse, og legger trådkorset til scenen. Vi deretter legge to hendelsen lyttere til scenen
privat funksjon startTheGame (e: MouseEvent):. Void {//Fjern knappen fra scenen removeChild (startGame); //Skjuler muse Mouse.hide (); //Legger trådkorset og setter sin x og y egenskaper //til musens x og y-koordinater addChild (trådkors); crosshair.x = mouseX; crosshair.y = mousey; stage.addEventListener (MouseEvent.MOUSE_MOVE, moveCursor); stage.addEventListener (MouseEvent.CLICK, Fireshot);}



Trinn 5: Coding moveCursor () og Fireshot ()

moveCursor () funksjonen kalles når brukeren beveger musen, på grunn til MOUSE_MOVE hendelsen lytteren vi lagt til scenen. I denne funksjonen vi bare sørge for at trådkorset er i samme posisjon som den Mouse ved hjelp mouseX og mousey
privat funksjon moveCursor (e: MouseEvent):. Void {//Gjør at trådkorset x og y er alltid //hvor musens x og y er crosshair.x = mouseX; crosshair.y = mousey;}

The Fireshot () funksjonen kalles når brukeren klikker på scenen. Vi sjekker først for å se om dette er første gang brukeren klikket; hvis det ikke er, så vi spiller skudd lyd og tilsett bulletHole til samme stilling på scenen der brukeren klikket ved hjelp e.stageX ande.stageY. Arrangementet inneholder informasjon om seg selv -. Du kan se hva den inneholder ved hjelp trace (e.toString ())

Hvis vi ikke sjekke om dette var den første gangen, så når brukeren først klikket på Start-knappen vil det legge et trådkors og spille av skudd lyd (vi ønsker ikke det)
privat funksjon Fireshot (e: MouseEvent):. void {//Hvis de har klikket en gang så gjør vi dette hvis (firstShot == false) {//Spiller av lyd soundChannel = gunshot.play (); //Oppretter en ny bullethole og legger det til //scenen på stedet der brukeren klikket bullethole = new BulletHole (); addChild (bullethole); bullethole.x = e.stageX; bullethole.y = e.stageY; //Vi ønsker alltid trådkorset på toppen så vi bytte "Dypet" //av trådkorset og kule swapChildren (bullethole, trådkors); } FirstShot = false; }} //Lukk klassen} //Lukk pakken



Konklusjon

Dette kan være grunnlaget for mange shoot-'em-up typen games.It ville være veldig lett å gyte noen fiender og deretter gjøre en hitTestPoint () sjekk med musens X en Y mot fienden display objekt.

Jeg håper du har hatt denne opplæringen. Takk for lesing!