Skip to content

Latest commit

 

History

History
203 lines (170 loc) · 6.36 KB

haxespel2.md

File metadata and controls

203 lines (170 loc) · 6.36 KB
Raw
title layout
HaxeSpel
page

Skapa projekt

I ett terminalfönster/kommandotolk skriv:

openfl create project HaxeSpel
cd HaxeSpel
openfl test flash

Kör igång ett tomt vitt "spel" i din webbläsare.

Ställ in din utvecklingsmiljö

IntelliJ

Öppna IntelliJ. Välj File ➤ Import Project... Leta upp HaxeSpel och välj OK. "Create project from existing sources" är valt, klicka på Next, Next. Om HaxeSpel/Export/flash/haxe är med i listan klicka bort den, det är bara HaxeSpel/Source som ska va iklickad. Klicka på Next, Next, Next. Välj Haxe som SDK. Klicka på Next, Finish. Nu ska du ha ett projekt öppet.

I listan till vänster kan vi leta upp källkoden till vårt "spel", klicka på ➤HaxeSpel, ➤Source, Main.hx. Som du ser är den ganska tom.

Nu behöver vi säga åt IntelliJ att det är ett OpenFL projekt (den vet bara att det är ett Haxe projekt, inte att det är OpenFL vi vill använda). File ➤ Project Structure... I dialogen välj Modules, HaxeSpel, Haxe. Här är nog "Haxe compiler" ifyllt. Välj "OpenFL" och klicka på OK.

Snart klara, vi behöver bara säga åt IntelliJ hur den ska köra vårt spel. Run ➤ Edit Configurations... Längst uppe till vänster i dialogen finns en plus knapp, klicka på den och välj Haxe Application. Ändra namnet från "Unnamed" till "HaxeSpel". Klicka på knappen till höger om Module: och välj HaxeSpel. Klicka på OK.

Nu kan du köra "spelet" genom att klicka på den gröna spela knappen, eller välja Run ➤ Run 'HaxeSpel'. Den gör samma sak som openfl test flash som vi använde tidigare, men det är lite smidigare.

Rita spelaren

Vi har ju nu en tom Main.hx. TODO Beskriv hur man skapar en sprite. Beskriv hur de olika ritmetoderna funkar. Koordinatsystem är klurigt, behöver vi nån debughjälp så man fattar var olika positioner finns? Hur förklarar man att varje sprite har ett eget koordinatsystem?

Koden

package;

import flash.display.Sprite;

class Main extends Sprite {
    var spelare:Sprite;

    public function new() {
        super();

        // skapa spelaren
        spelare = new Sprite();
        addChild(spelare);
        ritaSpelare();
        // starta spelaren i mitten av spelet
        spelare.x = stage.stageWidth / 2;
        spelare.y = stage.stageHeight / 2;
    }

    function ritaSpelare() {
        var g = spelare.graphics;
        // rita kroppen
        g.beginFill(0xFF0000); // rött
        g.drawCircle(0, 0, 20);

        // rita ögon
        g.beginFill(0x000000); // svart
        g.drawEllipse(-7, -23, 14, 10); // bakgrund
        g.beginFill(0xFFFFFF); // vitt
        g.drawCircle(-4, -19, 1.5);
        g.drawCircle(4, -19, 1.5);

        // rita prickar
        g.beginFill(0x000000); // svart
        g.drawCircle(0, -9, 2);
        g.drawCircle(-8, -4, 2);
        g.drawCircle(8, -4, 2);
        g.drawCircle(-4, 3, 2);
        g.drawCircle(4, 3, 2);
        g.drawCircle(-7, 10, 2);
        g.drawCircle(7, 10, 2);
    }
}

Rör på spelaren

Gå upp, ner, vänster, höger

TODO Berätta hur man lyssnar på keyboard events. Vad är enter frame? Flytta upp, ner, vänster, höger

{% highlight diff %} diff --git a/Source/Main.hx b/Source/Main.hx index 8769f45..a0f7d1c 100644 --- a/Source/Main.hx +++ b/Source/Main.hx @@ -1,9 +1,16 @@ package;

+import flash.events.Event; +import flash.ui.Keyboard; +import flash.events.KeyboardEvent; import flash.display.Sprite;

class Main extends Sprite { var spelare:Sprite;

  • var upp:Bool;

  • var ner:Bool;

  • var vanster:Bool;

  • var hoger:Bool;

    public function new() { super(); @@ -15,6 +22,11 @@ class Main extends Sprite { // starta spelaren i mitten av spelet spelare.x = stage.stageWidth / 2; spelare.y = stage.stageHeight / 2;

  •    // prenumerera på events

  •    stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);

  •    stage.addEventListener(KeyboardEvent.KEY_UP, onKeyUp);

  •    stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);

    }

    function ritaSpelare() { @@ -40,4 +52,37 @@ class Main extends Sprite { g.drawCircle(-7, 10, 2); g.drawCircle(7, 10, 2); }

  • function onKeyDown(event:KeyboardEvent) {

  •    switch (event.keyCode) {

  •        case Keyboard.UP: upp = true;

  •        case Keyboard.DOWN: ner = true;

  •        case Keyboard.LEFT: vanster = true;

  •        case Keyboard.RIGHT: hoger = true;

  •    }

  • }

  • function onKeyUp(event:KeyboardEvent) {

  •    switch (event.keyCode) {

  •        case Keyboard.UP: upp = false;

  •        case Keyboard.DOWN: ner = false;

  •        case Keyboard.LEFT: vanster = false;

  •        case Keyboard.RIGHT: hoger = false;

  •    }

  • }

  • function onEnterFrame(event:Event) {

  •    if (upp) {

  •        spelare.y -= 3;

  •    }

  •    if (ner) {

  •        spelare.y += 3;

  •    }

  •    if (vanster) {

  •        spelare.x -= 3;

  •    }

  •    if (hoger) {

  •        spelare.x += 3;

  •    }

  • } } {% endhighlight %}

Rotera och gå fram/bakåt

TODO matrix grejen är lite svår, skippa att förklara?

{% highlight diff %} diff --git a/Source/Main.hx b/Source/Main.hx index a0f7d1c..a064f78 100644 --- a/Source/Main.hx +++ b/Source/Main.hx @@ -1,5 +1,6 @@ package;

+import flash.geom.Point; import flash.events.Event; import flash.ui.Keyboard; import flash.events.KeyboardEvent; @@ -73,16 +74,22 @@ class Main extends Sprite {

 function onEnterFrame(event:Event) {
     if (upp) {

  •        spelare.y -= 3;

  •        flyttaSprite(spelare, 2);
   }
   if (ner) {

  •        spelare.y += 3;

  •        flyttaSprite(spelare, -2);
   }
   if (vanster) {

  •        spelare.x -= 3;

  •        spelare.rotation -= 3;
   }
   if (hoger) {

  •        spelare.x += 3;

  •        spelare.rotation += 3;
   }
    }
  • function flyttaSprite(sprite:Sprite, fart:Float) {
  •    var p = sprite.transform.matrix.transformPoint(new Point(0, -fart));

  •    sprite.x = p.x;

  •    sprite.y = p.y;
  • } } {% endhighlight %}