Wat is Asteroids? Asteroids is een arcadespel uit 1979 uitgebracht door Atari. De speler is in dit spel een ruimteschip waar asteroïden omheen vliegen. Het ruimteschip mag niet geraakt worden door de asteroïden. De speler kan op de asteroïden schieten om ervoor te zorgen dat ze kleiner worden. De kleinste asteroïden verdwijnen wanneer je ze raakt.
Aan de slag! Voor we kunnen programmeren, moeten er eerst weer sprites worden toegevoegd. Voeg onderstaande afbeeldingen toe als sprites en maak de bijbehorende objecten ook aan: Afbeelding Spritenaam Objectnaam player.png spr_speler obj_speler asteroids_large_strip4.png spr_asteroide_groot obj_asteroide_groot asteroids_medium_strip4.png spr_asteroide_middel obj_asteroide_middel asteroids_small_strip4.png spr_asteroide_klein obj_asteroide_klein bullet.png spr_kogel obj_kogel player_explode_strip6.png spr_speler_dood obj_speler_dood Let op De afbeeldingen zijn weer wit waardoor ze lastig te zien zijn in sommige webbrowsers. Gebruik Ctrl+A om hem beter zichtbaar te maken. Of gebruik Ctrl+S om de afbeelding direct op te slaan. Let op Sommige bestanden hebben _strip4 of _strip6 achter de bestandsnaam staan. Zorg ervoor dat dit erachter blijft staan. Anders werkt het niet. Let op Zorg dat je alle sprites de origin in het midden geeft (door altijd op Center ) te drukken boven de OK-knop van het sprite scherm. Let op Het is belangrijk dat je je sprites en objecten duidelijke namen geeft. De uitleg is namelijk lastiger te volgen wanneer alles nog object0 en sprite3 heet.
Spelkamer indelen Om te beginnen maken we een spelkamer en maken we hiervan de achtergrond weer zwart. Kies boven de objectselectie voor Backgrounds: En verander vervolgens de grijze kleur in een zwarte kleur: Plaats vervolgens obj_speler en obj_asteroide_groot in de spelkamer. Bij voorkeur de speler in het midden en de asteroïde aan de rand.
Speler programmeren Het ruimteschip in Asteroids kan een aantal dingen: Naar links en rechts draaien (verandert de beweegrichting niet) Gas geven (verandert de beweegrichting wel) Schieten Wanneer het ruimteschip gas geeft, zal hij bewegen in de richting waar hij naartoe kijkt. Vervolgens zal hij door blijven zweven aangezien het spel zich natuurlijk in de ruimte afspeelt waar we geen weerstand ondervinden. Rondkijken We beginnen met de bewegingen van het ruimteschip en daarna voegen we het schieten toe. Voeg twee Keyboard events toe aan obj_speler. Namelijk Left en Right. Kies dus niet voor Key Press of Key Release. Plaats in ieder event een blok (Control > Variables). Kies hierin voor de variabele image_angle om de kijkrichting aan te passen. Als waarde nemen we 5 voor <Left> en -5 voor <Right>. Hierbij vinken we relative wel aan aangezien we willen dat we het ruimteschip langzaam kunnen draaien. Om het spel extra mooi te maken kunnen we een spelinstelling aanpassen: Plaats een vinkje voor: Sla je gemaakte wijzigingen op en kijk of je het ruimteschip rond kan laten kijken. Let op : De asteroïde zal druk animeren, maar dit lossen we later op.
Realistisch bewegen Om het ruimteschip een beetje realistisch te laten bewegen, gaan we het gebruiken (Move>Move). Plaats deze in het Up event. blok Kies in dit blok als direction de image_angle variabele zodat we in onze kijkrichting gaan bewegen. Kies als speed 0.5 (let op, dit is nul punt vijf, niet nul komma vijf). Vervolgens vinken we relative wel aan zodat we langzaam in onze kijkrichting bewegen. Om te zorgen dat we niet oneindig kunnen versnellen (aangezien we steeds 0.5 harder gaan) gebruiken we het blok (Control>Variables). Kies hier als variabele speed en als test of deze larger than 5 is. Waarbij 5 dus de value is. Plaats direct onder dit blok een blok (Control > Variables) en stel hiermee speed in op 5. Hierbij hoef je relative dus niet aan te vinken. De laatste twee blokken zullen er samen voor zorgen dat je niet harder kunt bewegen dan een snelheid van 5. Als je event er als volgt uitziet, kun je het spel opslaan en kijken of het functioneert:
Buiten de spelkamer Zoals je ziet is het spel aardig uitdagend qua besturing. Aangezien het bijna onmogelijk is om weer stil te komen te staan, vlieg je zo uit de spelkamer. Om dit te voorkomen, zorgen we dat de speler gewoon weer aan de andere kant de spelkamer in komt vliegen wanneer hij eruit vliegt. Dit doen we door aan obj_speler een Outside Room event toe te voegen. Deze vind je onder Other in het lijstje van events. In dit event plaatsen we het blok (Move>Jump). Dit blok zal ervoor zorgen dat de speler naar de andere kant van de room verspringt wanneer hij buiten de room komt. Kies in dit blok als direction in both directions zodat dit zowel aan alle kanten van de room zal werken. Sla het spel op en probeer uit of je oneindig door kunt blijven bewegen. Schieten Zoals vorige week gaan we weer toevoegen dat je kunt schieten. Voeg hiervoor weer het Key press event voor de spatiebalk toe aan obj_speler. Plaats in het press <Space> event het blok toe (main1>objects). Kies in dit blok natuurlijk voor obj_kogel, laat de x en y 0. Kies als snelheid voor de kogel 15 en als richting voor de kogel de kijkrichting van de speler ( image_angle ). Vink hierbij relative aan aangezien de kogel op de locatie van de speler moet beginnen. Sla het spel op en kijk of je kunt schieten.
Eerlijk schieten Aangezien de speler bij de randen van de spelkamer naar de andere kant teleporteert, is het wel zo eerlijk als zijn kogels dit ook doen. Dan kan hij namelijk asteroïden wegschieten die daar in de weg vliegen. Voeg dus ook aan de kogel een Outside Room event toe met hierin het (Move>Jump) met de juiste instelling. blok Als je het spel nu zal starten, zal de spelkamer vrij snel volledig gevuld zijn met allemaal rondvliegende kogels. Dit is natuurlijk niet eerlijk. Om het eerlijker te maken, gaan we de kogels een levensduur geven. Dit doen we door middel van alarms. Geef de kogel een Create event en plaats hierin het hiermee Alarm0 in op 25 steps. blok (main2>timing). Stel Geef de kogel ook een Alarm0 event en plaats hierin het zodat de kogel zichzelf vernietigt. blok (main1>objects) Sla je het spel op en kijk of de kogels ook over de rand van de spelkamer heen teleporteren. Controleer ook of de kogels na een tijdje verdwijnen.
Asteroïden programmeren Onze asteroïde staat momenteel maar een beetje druk animerend in de spelkamer te staan. Hier gaan we verandering in brengen. Basis beweging Geef obj_asteroide_groot een Create event en plaats hierin het blok (Control > Variables). Kies als variabele image_speed en als waarde 0 zodat de sprite niet meer zo druk animeert. Plaats ook het blok (Move>Move) in het Create event. Kies hier als direction voor random(360) zodat hij in een willekeurige richting zal gaan bewegen. Kies als snelheid bijvoorbeeld 6 zodat het ruimteschip de asteroïde net niet voor kan blijven op topsnelheid. Voeg aan obj_asteroide_groot ook een Outside Room event toe met weer het blok met de juiste instelling. Start het spel en kijk of de asteroïde goed beweegt.
Raken Er kunnen twee dingen gebeuren met de asteroïde: - De asteroïde raakt de speler - De kogel raakt de asteroïde In het eerste geval is het game over en in het tweede geval moet de asteroïde opsplitsen in meerdere kleiner asteroïden. Voeg als eerste aan obj_speler een Collision event toe met obj_asteroide_groot. Plaats hierin het blok (main2>game) zodat het spel zichzelf herstart. Om te zorgen dat we niet steeds hetzelfde hoeven te programmeren, stellen we obj_asteroide_groot in als parent van obj_asteroide_middel en obj_asteroide_klein. Dit doe je boven de OK-knop van het object-scherm: Stel dit dus in bij _middel en _klein en ga vervolgens terg naar obj_asteroide_groot. Voeg aan obj_asteroide_groot een Collision event toe met obj_kogel. Zodra de kogel de asteroïde raakt, moeten er drie dingen gebeuren: - De kogel moet vernietigd worden - De grote asteroïde moet vernietigd worden - Er moeten drie middelgrote asteroïden aangemaakt worden.
De kogel vernietigen doen we met het kiezen voor Other in plaats van Self. blok (main1>objects) waarbij we bovenin De asteroïde vernietigen we ook met het Self laten staan. blok (main1>objects) welke we wel op Om drie middelgrote asteroïden te laten verschijnen, maken we gebruik van het blok (control>other). Kies hier voor een waarde van 3. Het blok wat we hieronder plaatsen zal driemaal worden uitgevoerd. Plaats hier het blok (main1>objects). Kies voor obj_asteroide_middel en laat de x en y op 0 staan. Vink relative wel aan zodat de middelgrote asteroïden aangemaakt worden op dezelfde plek als de grote asteroïde stond. Doordat we de grote asteroïde hebben ingesteld als parent van de middelgrote asteroïde, gedraagt de middelgrote zich exact hetzelfde. Sla het spel op en probeer het uit.
Foutjes oplossen Als je het goed hebt gedaan, zul je zien dat de middelgrote asteroïden ook netjes teleporteren wanneer ze buiten de spelkamer raken. Echter, als je er eentje raakt met een kogel dan zul je zien dat er meer middelgrote asteroïden in de spelkamer komen. Dit is natuurlijk niet de bedoeling. Om dit op te lossen neem je het hele Collision event van obj_asteroide_groot over en plaats je deze in obj_asteroide_middel. Je past hier natuurlijk aan dat er dan driemaal obj_asteroide_klein wordt aangemaakt. Tot slot voeg je ook een Collision event toe aan obj_asteroide_klein waarin je enkel de twee destroy blokken plaatst. Dan hoeven er namelijk geen extra asteroïden bij te komen. Sla het spel op en probeer het spel uit.
Doodanimatie Tot slot voegen we nog een doodanimatie toe van de omdat het herstarten van het spel anders wat abrupt is. Voeg een Create event toe aan obj_speler_dood. Plaats hierin het blok (main1>sprite). Kies voor spr_speler_dood met 0.2 als snelheid. Plaats ook het blok (main2>timing). Stel hierin Alarm0 in op 30 steps, zodat we hierin het spel kunnen gaan herstarten. Aangezien er niets meer aan het spel mag veranderen terwijl de speler explodeert, moeten we nog een aantal blokken toevoegen. Voeg aan spr_speler_dood een Step event toe. Voeg hier drie keer het blok (Control > Variables) toe. Zet iedere keer de speed variabele op 0. Doe dit voor obj_asteroide_groot, obj_kogel en Self. Voeg hierna nog aan het Step event een blok (main2>timing) toe om de alarms uit de kogel stop te zetten. Kies voor Alarm0 en -1 steps. Kies bovenin onder Applies to voor obj_kogel. Zo blijven de kogels ook op hun plek. Tot slot voeg je een Alarm0 event toe waarin je het spel herstart.
Uitbreidingen Voeg de volgende uitbreidingen stap voor stap toe. Score Voeg score toe zoals in les 2 is uitgelegd. Zorg ervoor dat: - Je +5 score krijgt wanneer je een grote asteroïde kapot schiet. - Je +10 score krijgt wanneer je een middelgrote asteroïde kapot schiet. - Je +15 score krijgt wanneer je een kleine asteroïde kapot schiet. - Je de scores in de spelkamer tekent op een zichtbare manier (witte tekst bijvoorbeeld) - Laat de highscore lijst zien wanneer de speler geraakt wordt door een asteroïde. Automatisch meer asteroïden toevoegen Deze keer hebben we geen spelverdeler aangemaakt, maar hebben we alles door de asteroïden en de speler laten regelen. Je kunt als uitbreiding proberen een eigen spelverdeler te maken. Zorg ervoor dat hij een nieuwe asteroïde toevoegt wanneer er minder dan vier aanwezig zijn in de spelkamer. Gebruik hiervoor de kennis uit de voorgaande documenten. Je mag ook naar de volgende uitbreiding gaan.
Levels Nu gaat het spel oneindig door zonder moeilijker te worden, zolang je de asteroïde kan vernietigen. We gaan dat veranderen door levels toe te voegen. Begin met het maken van een nieuwe room en zet de achtergrondkleur weer op zwart. Voeg weer de speler toe in het midden en zet nu in twee van de hoeken een asteroïde neer. We willen natuurlijk niet zomaar naar het volgende level springen. Als je de uitbreiding hierboven al gedaan hebt en als je asteroïden zichzelf aanvullen, dan kun je bij een bepaalde score een level omhoog gaan. Als je asteroïden zichzelf nog niet aanvullen kun je naar het volgende level gaan als alle asteroïden kapot zijn. Met score naar het volgende level Voeg in het Create event van de spelcontroller (of de speler als je geen spelcontroller hebt) een blok toe. Kies als variabele nextlevelscore en zet de waarde op het aantal punten waarmee je naar het volgende level gaat. Voeg in het Step event van hetzelfde object het blok toe (score>score), zet bij value nextlevelscore en zet de operation op larger than. Zet dan en neer (control>other) en zet er een blok tussen. Kies als variabele nextlevelscore en als waarde nextlevelscore*2. Als je het niet steeds moeilijker wil maken om naar het volgende level te gaan mag je ook als waarde nextlevelscore + 500 doen (of een andere waarde die je goed vindt). Voeg onder het blok een blok toe. Dit blok bekijkt of er wel een volgend level is om te spelen. Zet er een blok onder. Dit blok springt naar het volgende level.
Deze blokken kun je allebei vinden in main1>rooms. Zet dan een blok neer, gevolgd door en, weer tussen en. Als je nu het laatste level uitspeelt, krijg je de highscore te zien en begint daarna de game opnieuw. Het eindresultaat komt er zo uit te zien: Sla je spel op en kijk of je nu na genoeg punten naar het volgende level gaat. Als het werkt mag je zelf meer levels maken. Vergeet ze niet steeds moeilijker te maken!
Met alle asteroïden vernietigen naar het volgende level Voeg in het Step event van de spelcontroller (of de speler als je geen spelcontroller hebt) het blok toe. Kies als object voor obj_asteroide_groot, laat number op 0 staan en kies voor equal to als operatie. Zet daarna een en blok neer. Zet tussen de en een blok toe. Dit blok bekijkt of er wel een volgend level is om te spelen. Zet er een blok onder. Dit blok springt naar het volgende level. Deze blokken kun je allebei vinden in main1>rooms. Zet dan een blok neer, gevolgd door en, weer tussen en. Als je nu het laatste level uitspeelt, krijg je de highscore te zien en begint daarna de game opnieuw. Het eindresultaat komt er zo uit te zien: Sla je spel op en kijk of je naar het volgende level gaat als je alle asteroïde vernietigt. Als het werkt mag je zelf meer levels maken. Vergeet ze niet steeds moeilijker te maken!
Meer variatie in de asteroïden Alle asteroïden zien er nu hetzelfde uit. Om ervoor te zorgen dat ze er verschillend uit komen te zien, kunnen we de volgende variabelen veranderen van waarde: Variabele Waarde image_angle random(360) image_xscale choose(1, -1) image_index irandom(3) Wijzig de variabelen door middel van het te vinden wat ieder van deze variabelen doet. blok (Control > Variables) en probeer uit GML - Betere Het blok werkt niet zo netjes zodra je image_angle en image_xscale gebruikt zoals je vast hebt gezien tijdens het spelen van het spel. Om spel netter te laten werken, kunnen we met GML werken. Verwijder het Outside Room event uit obj_asteroide_groot en voeg een Step event toe. Plaats hierin het GML blok (control>code) en plaats hierin de volgende code: if ( x > room_width ) { x = 0 } if ( y > room_height ) { y = 0 } if ( x < 0 ) { x = room_width } if ( y < 0 ) { y = room_height } Dit zal ervoor zorgen dat de asteroïde naar de andere kant van de room verspringt, afhankelijk van waar hij de room verlaat.
Pas dit toe op alle plekken waar je het blok gebruikt hebt. Dit is obj_asteroide_groot en obj_speler. Sla het spel op en kijken of het er beter uitziet. Zoals je ziet, lijkt er nog steeds een kleine verspringing aanwezig te zijn doordat de asteroïde simpelweg niet op meerdere plekken tegelijkertijd wordt getekend en dus sowieso half buiten de speelkamer getekend wordt voor en nadat hij teleporteert. Om dit op te lossen kunnen we de objecten wel meerdere keren gaan tekenen. Dit gaan we doen door middel van een script. Voeg een nieuw script toe door op de volgende knop te drukken: Geef het script als naam: draw_self En plaats de volgende code erin: GML //draw_self(x, y) draw_sprite_ext ( sprite_index, image_index, argument0, argument1, image_xscale, image_yscale, image_angle, image_blend, image_alpha ) Dit script zelf ervoor zorgen dat hij op de opgegeven positie de huidige sprite gaat tekenen met alle nodige instellingen die je eraan hebt gedaan. Sla dit script op door op het groene vinkje te klikken.
Geef obj_asteroide_groot een Draw event en schrijf hierin het volgende in een blok (control>code): GML draw_self ( x, y ) draw_self ( x + room_width, y ) draw_self ( x - room_width, y ) draw_self ( x, y + room_height ) draw_self ( x, y - room_height ) Dit zal ervoor zorgen dat de asteroïde aan iedere kant van zichzelf nogmaals getekend wordt. Zodat hij zowel voor het teleporteren al zichtbaar is aan de andere rand. Dit zorgt er niet voor dat de asteroïde al te raken is zodra hij al aan de andere kant getekend wordt, maar als de asteroïde snel genoeg beweegt, zul je hier niet heel veel erg in hebben. Eigen uitbreidingen Om het spel extra leuk te maken, kun je eigen uitbreidingen verzinnen. In de echte Asteroids vliegt er bijvoorbeeld soms een vliegende schotel door het scherm zoals we ook gedaan hadden bij Space invaders vorige week. Dit kun je hier ook toevoegen, maar je kunt ook zelf iets bedenken. Bijvoorbeeld het langzaam laten draaien van de asteroïden wanneer ze langsvliegen.