GameMaker: Studio Tutorial | Apple Clicker #1
-
Hallo :)
Ich habe mir schon etwas länger überlegt ob ich nicht einfach mal ein paar Tutorials für meine lieblings Game-Engine und naja hier ist es mein erstes Tutorial für GameMaker: Studio.
Ich möchte in dieser Tutorial-Serie ein Spiel erstellen das sich an Cookie Clicker orientiert.
Also fangen wir mal an! :)Was wird in diesem Teil behandelt?
In diesem Teil erstellen wir unser neues Projekt und implementieren eine relativ simple Funktion: Das Klicken auf den Apfel
Fertig sieht das ganze dann so aus:
(Die Punkteanzeige kommt im zweiten Teil)
Wie man unschwer am Titel und am Screenshot erkennen kann machen wir das Spiel Apple Clicker :)Also los gehts!
Schritt 1: GameMaker: Studio runterladen/kaufen
Hier gibt es schon verschiedene Möglichkeiten. Die erste wäre einfach die Steam-Version zu nutzen. Diese ist allerdings in der Basisversion leicht eingeschränkt und bietet nur eine begrenzte Anzahl an Events. Die kostenlose Basisversion die man sich bei
YoYo Games runterladen kann kommt ohne diese Einschränkungen. Beide Basisversionen kommen mit einem Splashscreen. Ich empfehle allgemein sich den GameMaker auf der offizielen Website runterzuladen/kaufen da mann bei einem Kauf dort direkt einen Steam-Key mitgeschickt bekommt allerdings man bei der Steam-Version keinen normalen Key erhält.Schritt 2: Ein neues Projekt erstellen
Dieser Schritt sollte eigentlich logisch sein ich gehe aber dennoch auf ihn ein.
Angekommen im GameMaker: Studio Menü klicken wir einfach einmal auf den Reiter "New" geben einen Pfad für unser Projekt an und geben ihm noch einen Namen. Wir können uns ebenfalls dafür entscheiden Source Control zu benutzen was ich euch bei größeren Projekten empfehle aber in diesem Fall nicht nutzen werde.
Schritt 3: Importieren der Assests
Da wir auch Grafiken und später Sounds für unser Spiel benötigen fangen wir am besten mal damit an.
Ich habe die Assests vom obrigen Screenshot hochgeladen und ihr könnt sie HIER herunterladen.
Beide Grafiken sind von mir erstellt und können frei genutzt werden.
Wir ziehen einfach die beiden Grafiken in das GameMaker Fenster hinein. Dabei sollte man beachten das "Background.png" und "Apple.png" nicht den selben "Typ" haben "Background.png" ist als Background gedacht und "Apple.png" ist als Sprite gedacht.
Dadurch das die 2 Dateien nicht für das selbe genutzt werden müssen sie einzeln in das Fenster gezogen werden.
GameMaker wird dich auch fragen für was du die in das Fenster gezogenen Daten nutzen willst. BEACHTE DABEI DAS ALLE DATEIEN DIESEN TYPEN BEKOMMEN
"Apple.png" wird ein Sprite und "Background.png" wird ein Background.
Sollte alles geklappt haben sollte es in etwa so aussehen:
Ich habe hier nur die Namen angepasst. Der Apfel wird beim Import zu "sprite0_Apple" und wurde von mir zur übersicht in "spr_apple" umbennant. Der Background hieß "Background" und wurde von mir "bg_main" genannt.
Schritt 4: Die Funktion des Apfels
Jetzt haben wir die Grafiken importiert jetzt kann es direkt losgehen. Wir fangen damit an den Apfel zu erstellen dazu rechstklicken wir in unserem Projekt-Explorer (Der linke Teil wo alle unsere Assets gelandet sind) auf Objects und klicken auf "Create Object".
Dieses Fenster sieht im ersten Moment schlimmer aus als es ist. Wir geben unserem Objekt erst einmal einen passenden Namen. Ich habe in diesem Fall "obj_apple" gewählt. Dannach klicken wir bei Sprite entweder auf den Text " oder klicken auf das Symbol daneben und wählen unser Apfel Sprite "spr_apple" aus. Herzlichen Glückwunsch! Du hast dein erstes Objekt im GameMaker erstellt dieses macht allerdings noch nicht viel außer das es gezeichnet wird. Also müssen wir GameMaker irgendwie sagen was passieren soll wenn irgendetwas getan wird. Dafür haben wir die sogenannten "Events". Events kann man sich wie Beobachter vorstellen die falls etwas bestimmtes passiert eingreifen. Ich werde euch nicht alle Events vorstellen da die meisten sowieso selbsterklärend sind und ich hier nur auf die eingehen werde die wir für die Funkion des Apfels benötigen. Mit einem Klick auf "Add Event" öffnet sich folgendes Fenster:
Wir benötigen für unseren Apfel folgende Events:
- Mouse -> Left Pressed
- Mouse -> Left Released
Beide bekommt ihr wenn ihr auf Mouse klickt und die jeweiligen Events im Kontextmenü auswählt.
Nun sollte das ganze so aussehen:
Wir wählen nun das Event "Left Pressed" aus und klicken auf der rechten Seite auf den Reiter "Control"
und ziehen nun den Zettel den ihr unter Code findet (den ersten) in den "Actions" Bereich.
Es öffnet sich direkt der Code-Editor von GameMaker. GameMaker nutzt seine eigene Scriptsprache "GML" (GameMaker Language)
GML eignet sich in meinen Augen sehr gut für Anfänger da man kaum auf die Syntax also wie der Code geschrieben wird achten muss.
Das einzige was man beachten muss ist das GML wie jede andere Scriptsprache die ich kenne Case-Sensitive ist. Das heißt wenn ein Befehl "ApfelKlicken" heißt und man schreibt aber "apfelklicken" wird dies dazu führen das es bei Ausführung des Codes zum Absturz des Spieles kommt. Zurück aber zu unsrem Apfel.
Hier sehen wir eine nicht wirklich überraschende Toolbar das einzige was hier wirklich interessant ist ist "Applies To:" damit können wir bei einem Collison Event etwa sagen wer "Opfer" des Codes wird. Da wir ja wollen das etwas mit dem Apfel passiert wenn wir auf ihn klicken lassen wir das allerdings auf "Self".
image_xscale = 0.9; image_yscale = 0.9; Points += 1;Das ist der gesamte Code den wir dafür benötigen um die Grundfunktion unseres Apfels zu erstellen. Bei einem Klick auf den Apfel wird nun durch "image_xscale" und "image_yscale" die Skalierung des Apfel verringert wodurch wir einen Klick-Effekt erhalten. "Points += 1" ist dazu da das wir unsere Punkte um 1 erhöhen. Das ganze würde allerdings noch nicht richtig funktionieren da wir "Points" noch nirgendwo definiert haben also GameMaker gesagt haben das wir eine Variable mit dem Namen "Points" haben möchten. In Variablen können wir in GML alle möglichen Informationen speichern wie etwa die Anzahl der Äpfel hier symbolisiert mit "Points". Wir werden "Points" später als eine Globale Variable definieren. Das bedeutet das jedes Objekt auf diese Variable zugreifen darf und nicht nur "obj_apple". Allerdings werden wir dies erst gleich nachdem wir das Event "Left Released" bearbeitet haben machen.
Kommen wir nun zum Event "Left Released". Hier machen wir das selbe wie bei "Left Pressed" also wieder einen Code-Zettel in den Action-Bereich ziehen. Der Code diesmal soll dazu führen das wenn wir die Linke Maustaste wieder loslassen sich die Auflösung vom Apfel wieder zurück auf 100% also auf 1 stellt.image_xscale = 1; image_yscale = 1;Im Prinzip einfach das Gegenteil von dem was wir bei "Left Pressed" gemacht haben.
Unser Apfel ist nun im Prinzip einsatzbereit und wir können ihn nun einfach mal testen.
Dazu gehen wir in den nächsten Schritt über.Schritt 5: Erstellen eines Raumes
GameMaker unterteilt seine Spiele in verschiedene Räume. Diese sind vergleichbar mit States wer mit diesem Begriff nichts anfangen kann kann sich das ganze auch wie der Name sagt als Raum vorstellen. Wir können in diesem Raum unsere zuvor erstellten Objekte platzieren und dannach mit Ihnen interagieren. Durch verschiedene Räume können Dinge wie verschiedene Levels oder Menüs realisiert werden. Also ein Rechtsklick auf "Rooms" in unserem Projekt-Explorer und "Create Room" angeklickt und es kann losgehen.
angekommen im Raum Editor können wir dem Raum erstmal einen Namen geben. Ich werde diesen Raum weil es vorerst der einzige sein wird "rm_main" nennen. Wie ihr ihn nennt ist eurer Fantasie überlassen. Width und Height sind da um die Größe des Raumes einzustellen. In unserem Fall wird sich die Auflösung auf diese Größe automatisch einstellen. Dies kann durch verwendung von "Views" umgangen werden allerdings wird es in diesem Tutorial keine Erklärung zu "Views" geben da wir sie erstmal nicht benötigen. Speed sind unsere TICKS pro Sekunde unsere Frames werden sich zwar an dieser Zahl orientieren allerdings ist Speed nicht dazu da das FPS-Limit festzulegen. Da wir im moment noch nicht allzu viel machen können wir diese auf 30 lassen. Persistent ist nützlich wenn man möchte das der Raum beim Wechsel in einen anderen Raum gespeichert wird. Falls man wieder zurück in den Raum wechselt ist alles wie davor. Zu Creation Code kommen wir gleich. Die Instance Order interessiert uns derzeit zwar noch nicht aber sie ist dafür da festzulegen welches der Objekte zu erst erstellt wird.
Kommen wir nun zu Creation Code, erinnerst du dich? Wir wollten ja eine Globale Variable "Points" definieren und genau das machen wir in Creation Code. Mit einem Klick darauf öffnet sich wieder der Code Editor in dem wir nun Points definieren werden.globalvar Points; Points = 0;Wir erstellen die Globale Variable zuerst und geben ihr dann einen standard Wert. Dies ist wichtig da sonst GameMaker nicht weiß welchen Wert Points zu beginn hat und abstürzen würde. Nachdem wir das nun gemacht haben können wir auf den Reiter "Background" drücken und unseren Hintergrund für den Raum festlegen.
Wir klicken dazu einfach dort wo "" steht wieder wie wir das beim Objekt gemacht haben entweder auf das Symbol oder den Text und wählen unseren Hintergrund aus. Anschließed klicken wir auf den Reiter "Objects" und können nun unseren Apfel im Raum per Linksklick platzieren.
Nun kann einfach wieder auf den grünen Hacken gedrückt werden und der Raum ist gespeichert.
Jetzt könnt ihr in der Toolbar auf den grünen Play-Button klicken und unser Spiel wird erstellt.
Im Moment macht der Apfel bei einem Klick auf ihn nicht genau das was wir wollen er wird nicht kleiner sondern spring etwas nach links und wird kleiner. Diesen Fehler und die Tatsache das man in einem Bereich um den Apfel bereits klicken kann werden am Anfang des nächsten Teiles behoben. Im Prinzip ist es nicht sonderlich viel Aufwand das zu machen aber im möchte das Tutorial jetzt auch nicht zu lange machen. Ich hoffe euch hat das Tutorial gefallen und würde mich über Feedback freuen. Achja und seid mir bitte nicht böse wenn der ein oder andere Rechtschreibfehler sich eingeschlichen hat es ist relativ spät gewesen als ich das Tutorial geschrieben habe :) -
Sehr geiles Tutorial! auch wenn es GameMaker ist
Vielleicht werden wir das Tutorial bald auf freeschi.com sehen :) -
Riesen Tutorial! Danke Schicho das ist perfekt da steckt viel Arbeit und Leidenschaft drin. Ich besorge mir bald GameMaker, wird nach dem vielen Unity mal gut tun, und als erstes nutze ich dein Tutroial. Bringst du bald noch mehr raus ähnlich wie
-
Vielen Dank :)
Momentan arbeite ich weiter an Apple Clicker da werden noch ein paar Tutorials kommen, dannach nehm ich gerne Vorschläge für neue Tutorials entgegen! :D
