Share
In deze Quick Tip leert u hoe u een eenvoudig puntensysteem kunt maken dat u kunt uitbreiden naar uw eigen games. Deze tutorial is voor totale beginners, en daarin leer je hoe je een reeks knoppen kunt maken waarop de speler kan klikken om punten toe te voegen of af te trekken van of naar hun score. Eenvoudig!
Hoewel deze zelfstudie voor beginners is bedoeld om te programmeren met Flash, moet u iets weten over het gebruik van de tekenhulpmiddelen in Flash Professional. Lees dit artikel als u meer wilt weten over het gebruik van de tekenhulpmiddelen.
Laten we eens kijken naar het eindresultaat waar we naartoe zullen werken:
Open Flash en maak een nieuw Flash-document. Stel de documentgrootte in op 550x400 px, de FPS (frames per seconde) op 24 en stel de documentklasse in op Hoofd.
Als u de afbeeldingen wilt maken, gebruikt u het gereedschap Ovaal om vier cirkels te maken met een # 000000 (zwart) omtrek en een lijngrootte van 12,50.
Elke cirkel moet een andere vulkleur hebben. De vulkleuren zijn als volgt:
Gebruik na het maken van de munten statische tekstvakken om hun respectieve waarden te noteren, zoals in de bovenstaande afbeelding. Het lettertype dat ik in deze zelfstudie zal gebruiken is Futura LT Heavy, met een grootte van 50, maar voel je vrij om je eigen lettertype en lettergrootte te gebruiken. Na het voltooien van de instructie moet u een muntstuk van 10 munten, 50 munten, 100 munten en een munt van -30 hebben.
We zullen nu elke munt omzetten in een MovieClip. Selecteer de 10-munten en druk op F8. U zou een dialoogvenster zoals dit moeten zien:
Herhaal deze stap voor de 50 munten, 100 munten en de -30 munten en voer het volgende in onder de vakken Naam en Klasse voor elke munt:
Nadat u MovieClips uit alle munten hebt gemaakt, selecteert u ze allemaal en verwijdert u ze uit het werkgebied. We zullen ze later opnieuw toevoegen, met behulp van code.
Als u deze stap wilt afronden, maakt u een statisch tekstvak met de tekst "SCORE:" en plaatst u dit met een X-waarde van 135 en een Y-waarde van 327.
In deze stap zullen we ons pakket en de hoofdklasse opzetten.
Maak een nieuwe ActionScript-klasse en onder Class Name-type Hoofd. Nadat u de klasse hebt gemaakt, slaat u deze op in dezelfde map als uw Flash-bestand en zorgt u ervoor dat deze wordt opgeslagen als Main.as.
Voer de onderstaande code in uw Main.as-bestand in en sla het op.
Accentsconagua
pakket // importeert de nodige klassen import flash.display.MovieClip import flash.events.MouseEvent; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFieldType; import flash.events.Event; public class Main breidt MovieClip uit var tenCoin: TenCoin = new TenCoin (); // Creëert een nieuw exemplaar van de Ten Coin var fiftyCoin: FiftyCoin = new FiftyCoin (); // Creëert een nieuw exemplaar van de Fifty Coin var hundredCoin: HundredCoin = new HundredCoin (); // Creëert een nieuw exemplaar van de Honderd Munt var badCoin: BadCoin = new BadCoin (); // Creëert een nieuw exemplaar van de -30 Coin var-score: Number = 0; // Stelt de score in op nul var scoreText: TextField = new TextField (); // Creëert een tekstveld om de score weer te geven var scoreTextFormat: TextFormat = new TextFormat ("Futura LT Heavy", 50, 0x000000); // Creëert een nieuw formaat voor Scoretekstveld, vervangt "Futura LT Heavy" door het lettertype dat u gebruikt openbare functie Main () displayObjects (); // De functie die we zullen gebruiken om alle grafische afbeeldingen op de toneelsetUpEventListeners () weer te geven; // De functie die we zullen gebruiken om onze Event Luisteraars toe te voegen Eerst importeren we de klassen die we nodig hebben en vervolgens stellen we onze documentklasse in. Vervolgens breiden we de hoofdklasse uit van MovieClip; we zouden Sprite kunnen gebruiken, maar dat doet er niet echt toe. Daarna verklaren we de variabelen die we gebruiken en voegen we code toe aan onze Hoofd() functie (onze "constructorfunctie").
De Hoofd() functie toont alle munten die we op het podium hebben gemaakt en het voegt ook de Event Listeners toe die we moeten gebruiken.
Notitie: U moet het lettertype in uw FLA opnemen om het in dynamische tekstvelden weer te geven als uw gebruiker het lettertype niet heeft geïnstalleerd. Ik heb dit hier niet gedaan om de zaken simpel te houden.
DisplayObjects () FunctieDe DisplayObjects () Functie wordt aangeroepen vanuit de Hoofd() functie. Het doel van deze functie is om de munten en het scoretekstvak aan het podium toe te voegen en ze op de juiste locatie te plaatsen.
function displayObjects () // Stelt de positie van de Ten Coin tenCoin.x = 72 in; tenCoin.y = 200; // Stelt de positie van de Fifty Coin fiftyCoin.x = 207 in; fiftyCoin.y = 200; // Stelt de positie in van de Honderd Munt honderdCoin.x = 342; hundredCoin.y = 200; // Stelt de positie in van de -Thirty Coin badCoin.x = 477; badCoin.y = 200; // Plaatst het tekstvak score en stelt het type in op dynamisch zodat het kan worden gewijzigd door code score Text.text = TextFieldType.DYNAMIC; scoreText.x = 305; scoreText.y = 327; scoreText.width = 300; // Stelt het formaat van de score in textbox scoreText.defaultTextFormat = scoreTextFormat; // Voegt alles toe aan de stage addChild (tenCoin); addChild (fiftyCoin); addChild (hundredCoin); addChild (badCoin); addChild (scoreText);
setUpEventListeners () Functie en de gebeurtenishandlersNu we objecten aan het podium hebben toegevoegd, moeten we eventhandler-functies maken die worden geactiveerd bij het klikken op de munten. We hebben ook een updateScore () functie om te gebruiken zodat de score wordt bijgewerkt en niet hetzelfde blijft.
function setUpEventListeners () // Wijzigt al onze MovieClips in Buttons tenCoin.buttonMode = true; fiftyCoin.buttonMode = true; hundredCoin.buttonMode = true; badCoin.buttonMode = true; // Voegt de gebeurtenislisteners toe om punten toe te voegen aan de score tenCoin.addEventListener (MouseEvent.CLICK, addTenPoints); fiftyCoin.addEventListener (MouseEvent.CLICK, addFiftyPoints); hundredCoin.addEventListener (MouseEvent.CLICK, addHundredPoints); badCoin.addEventListener (MouseEvent.CLICK, removeThirtyPoints); // Voegt de update-functie toe om de score stage.addEventListener (Event.ENTER_FRAME, updateScore) bij te werken;
Nu moeten we de functies coderen die veranderen en de score bijwerken.
functie addTenPoints (evt: MouseEvent) score + = 10; // Voegt 10 punten toe aan de score functie addFiftyPoints (evt: MouseEvent) score + = 50; // Voegt 50 punten toe aan de score functie addHundredPoints (evt: MouseEvent) score + = 100; // Voegt 100 punten toe aan de score functie removeThirtyPoints (evt: MouseEvent) score - = 30; // Haalt 30 punten van de score af // Deze if-instructie staat niet toe dat de score onder nul komt als (score < 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
Uw code is nu klaar voor testen. Druk op CTRL + Enter (CMD + Enter op een Mac) en zie hoe uw puntensysteem tot leven komt!
Nu denk je misschien: "Ik heb mijn tijd verspild, al deze tutorial leerde me om te doen was om een aantal knoppen te maken die je punten geven wanneer je erop klikt" - maar je hebt meer geleerd dan dit.
Zie dit als een basis voor een meer geavanceerd puntensysteem. Je hebt geleerd hoe je + = en - = kunt gebruiken om een nummer toe te voegen of ervan af te trekken, je hebt geleerd om gebeurtenislisteners te gebruiken, je hebt geleerd hoe je een functie kunt maken om objecten bij te werken terwijl de SWF actief is, en je hebt geleerd hoe je een nummer kunt veranderen naar een reeks en deze weergeven in een dynamisch tekstvak dat u volledig hebt gemaakt met behulp van code!
Dit puntensysteem kan eenvoudig worden uitgebreid naar je eigen games. Diegenen onder u die meer ervaring hebben met Flash, probeer een game te maken die een functie hitTestObject gebruikt en punten toevoegt wanneer u een object raakt.
Ik hoop dat je vandaag iets nieuws hebt geleerd. Bedankt voor het lezen!
