Erklärung der Ebenenstruktur auf Maps (Z-Wert)

  • Mit diesem Tutorial möchte ich euch zeigen, wie ihr auf die Ebenenstruktur der Maps zugreift und dort eure Sprites reinsetzt.



    An wen richtet sich dieses Tutorial?


    An Leute die Plugins erstellen oder bearbeiten. Daher sind Kenntnisse in JavaScript nötig.



    Also, fangen wir an:

    Verantwortlich für die verschiedenen Ebenen ist Spriteset_Map im rpg_sprites.js (Zeile 2253). Dort werden drei Objekte erstellt, die für verschiedene Ebenen zuständig sind.

    1. _baseSprite für die Paralaxebene
    2. _tilemap für die Map an sich (also von den Bodentiles bis zu Animationen)
    3. _pictureContainer für die Bilder

    Man kann über SceneManager._scene._spriteset auf die verschiedenen Objekte zugreifen, wenn Scene_Map geladen ist, sich der Spieler also auf einer Map befindet. Außerdem kann man über this.parent auf die Objekte zugreifen, falls man mit einem Objekt arbeitet, das ein 'child' von Spriteset_Map ist.


    In den folgenden Codes steht sprite für euer Sprite. Das könnt ihr folgendermaßen in die Struktur einbinden:


    Paralaxebene:


    SceneManager._scene._spriteset._baseSprite.addChildAt(sprite, x)


    Das x müsst ihr durch einen der beiden Werte ersetzen:

    1. 1 um euer Sprite unter das Paralaxbild zu legen
    2. 2 um euer Sprite über das Paralaxbild und unter die Bodentiles zu legen.

    Falls ihr 0 eingebt wird das Sprite nie angezeigt. Ihr könnt auch größere Zahlen als 2 eingeben. Je größer die Zahl, desto höher die Ebene. Allerdings werden die Sprites immer unter den Botentiles angezeigt. Falls euch die Ebenen der Sprites zueinander egal sind, sie aber über dem Paralaxbild angezeigt werden sollen, könnt ihr addChildAt(sprite, x) mit addChild(sprite) ersetzen.


    Mapebene:


    Um das Sprite in die Mapebene einzubinden braucht es zwingend einen Z-Wert, also spite.z = x . Das x müsst ihr durch einen der folgenden Werte ersetzen um euer Sprite:

    1. 1 über den Bodentiles, aber unter allen folgenden Ebenen
    2. 2 oder 3 über der 'unter Charakteren'-Ebene, aber unter allen folgenden Ebenen
    3. 4 oder 5 über der 'wie Charakteren'-Ebene und den *-Tiles, aber unter allen folgenden Ebenen
    4. 6 oder 7 über dem Luftschiff und der 'über Charakteren'-Ebene, aber unter allen folgenden Ebenen
    5. 8 über den Ballonsymbolen, aber unter den Animationen
    6. 9 über den Animationen

    anzeigen zu lassen. Danach ruft ihr diese Funktion auf:


    SceneManager._scene._spriteset._tilemap.addChild(sprite)


    In jedem Fall werden die Sprites unter der Bilderebene angezeigt. Ihr könnt hier auch weitere Ebenen einstellen, also das x durch 0 oder einer Zahl größer als 9 ersetzen. Die Sprites werden automatisch so sortiert, dass sie in der jeweiligen Ebene angezeigt werden.


    Bilderebene:


    Um effektiv in der Bilderebene arbeiten zu können, benötigt ihr folgende Funktion

    Danach ruft ihr diese Funktion auf:


    SceneManager._scene._spriteset._pictureContainer.addChildAt(sprite, getPictureIndex(x))


    Das x muss mit der Bilder-ID des Bildes ersetzt werden, welches direkt unter dem Sprite sein soll. Bei 1 ist also nur das Bild mit der ID 1 unter dem Sprite und alle anderen darüber. Maximal gibt es standardmäßig 100 Bilder-IDs. Der _pictureContainer ist im Grunde nur ein Array in dem die Sprites gespeichert sind. Ihr könnt also mit SceneManager._scene._spriteset._pictureContainer.addChildAt(sprite, x) euer Sprite direkt auf die x-te Stelle im Array setzen, falls ihr zwischen den Bildern noch extra Ebenen benötigt.


    Sprites aus den Ebenen entfernen:


    Ihr solltet in eurem Objekt ein Array anlegen, in dem die Sprites gespeichert werden. Dieses ist im folgenden Code spriteArray . Das Array braucht ihr nämlich, um die Sprites bei Bedarf wieder zu entfernen. Entfernt werden die Sprites wenn ihr folgende Funktion aufruft:

    Code
    1. function removeSprite(id){
    2. var sprite = spriteArray.splice(id, 1);
    3. SceneManager._scene._spriteset._baseSprite.removeChild(sprite);
    4. SceneManager._scene._spriteset._pictureContainer.removeChild(sprite);
    5. SceneManager._scene._spriteset._tilemap.removeChild(sprite);
    6. }


    So, das war's mit diesem Tutorial. Ich hoffe es hilft dem ein oder anderen weiter.