2D-Animationsklasse

Aus Spieleprogrammierer-Wiki
(Unterschied zwischen Versionen)
Wechseln zu: Navigation, Suche
[unmarkierte Version][gesichtete Version]
K
 
(19 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
 +
[[Kategorie:Für Einsteiger]]
 
2D Animationen sind immer wieder Bestandteile von Spielen, auch in 3D Spielen werden 2D Animationen benutzt, um z.B. Animierte Menüs und Mauszeiger darzustellen. Der Aufbau und die Funktionsweise einer entsprechenden Klasse wird in diesem Artikel beschrieben.
 
2D Animationen sind immer wieder Bestandteile von Spielen, auch in 3D Spielen werden 2D Animationen benutzt, um z.B. Animierte Menüs und Mauszeiger darzustellen. Der Aufbau und die Funktionsweise einer entsprechenden Klasse wird in diesem Artikel beschrieben.
  
Zeile 4: Zeile 5:
 
Eine Animation ist eine Abfolge von Bildern, die sich von einem Bild zum nächsten Bild von einander Unterscheiden und  so der Eindruck einer Bewegung entsteht. Das menschliche Auge nimmt eine Abfolge von ca. 24 Bildern pro Sekunde als flüssige Bewegung wahr.
 
Eine Animation ist eine Abfolge von Bildern, die sich von einem Bild zum nächsten Bild von einander Unterscheiden und  so der Eindruck einer Bewegung entsteht. Das menschliche Auge nimmt eine Abfolge von ca. 24 Bildern pro Sekunde als flüssige Bewegung wahr.
 
[[Datei:MundSpriteSheet.png|thumb|right|Sprite Sheet zur Animation in der Tabelle]]
 
[[Datei:MundSpriteSheet.png|thumb|right|Sprite Sheet zur Animation in der Tabelle]]
−
{| class="wikitable"
+
{| class="wikitable centered"
 
|+ Beispiele anhand von verschieden schnellen Animationen
 
|+ Beispiele anhand von verschieden schnellen Animationen
 
! Animation !! Geschwindigkeit  
 
! Animation !! Geschwindigkeit  
Zeile 21: Zeile 22:
 
|-
 
|-
 
|}
 
|}
−
Der Eindruck einer Flüssigen Bewegung wird Verstärkt durch die Anzahl der Zwischnschritte, dass heißt eine Animation mit 5 (einzelnen) Bildern sieht nicht so flüssig aus wie eine Animation mit 10 (einzelnen) Bildern.
+
Der Eindruck einer Flüssigen Bewegung wird erhöht in dem die Anzahl der Einzelbilder gesteigert wird, das heißt eine Animation mit 5 (einzelnen) Bildern sieht nicht so flüssig aus, wie eine Animation mit 10 (einzelnen) Bildern die in derselben Zeitspanne dargestellt werden. Letzten Endes läuft es darauf hinaus, dass eine flüssige Animation mindestens 24 (einzelne) Bilder pro Sekunde haben sollte. Wie aber oben in der Tabelle zu erkennen ist, geht es auch mit weniger Bildern.
 +
== Aufbau der 2D Animations Klasse ==
 +
[[Datei:Klassendiagramm2dAnim.png|thumb|right|Klassendiagramm einer möglichen 2D Animations Klasse]]
 +
Der Aufbau einer 2D Animations Klasse muss nicht zwingend genauso aussehen, wie hier Beschrieben. Es gibt auch andere Varianten eine solche Klasse aufzubauen, deshalb ist dies nur stellvertretend für eine Vielzahl an Möglichkeiten. Die hier Vorgestellte Möglichkeit basiert auf der [[Sprite-Sheet-Klasse]].
 +
 
 +
Wie in dem Bild des Klassendiagramms Rechts zu sehen ist, enthält die Klasse C2dAnimation folgende Klassenvariablen:
 +
* eine Instanz der [[Sprite-Sheet-Klasse]] (''Sheet'')
 +
* einen statischen Zeitgeber (''Timer'')
 +
* eine float Variable die die Zeit enthält wann das nächste Bild dargestellt werden soll (''NextFrameTime'')
 +
* eine float Variable die Angibt wie lange ein Bild dargestellt werden soll (''FrameTime'')
 +
* eine int Variable die Angibt welcher der Erste Index auf dem Sprite Sheet für die Animation ist (''FirstFrame'')
 +
* eine int Variable die Angibt welches der Letzte Index auf dem Sprite Sheet für die Animation ist (''LastFrame'')
 +
* eine int Variable die Angibt welches der Aktuelle Index ist (''CurrentFrame'')
 +
* eine int Variable die Angibt welcher Index des Sprite Sheets angezeigt werden soll wenn die Animation gestoppt ist (''StopFrame'')
 +
* eine bool Variable die Angibt ob das Sprite gerade Animiert wird oder nicht (''Animation_On'')
 +
 
 +
 
 +
Weiterhin hat die Klasse C2dAnimation folgende Klassenmethoden:
 +
* eine Methode um der Instanz der [[Sprite-Sheet-Klasse]] mitzuteilen, welches Bild geladen werden soll und wie groß der Angezeigte Bildausschnitt sein soll (''Load_SpriteSheet(String path, int X_Size, int Y_Size)'')
 +
* eine Methode die das aktuell gültige [http://de.wikipedia.org/wiki/Sprite_(Computergrafik) Sprite] zurück gibt (''Get_CurrentFrame()'')
 +
* Set Methode für die relevanten Daten der Animation (''Set_Animation(int firstframe, int lastframe, int stopframe, float frametime)'')
 +
* ein Methode die die Animation an oder aus Schaltet (''Animation_On(bool Value)'')
 +
 
 +
Die Floatwerte ''NextFrameTime'' und ''FrameTime'' können auch durch einen anderen Datentyp repräsentiert werden, dies ist Abhängig vom ''Timer'', je nach dem welchen Datentyp er nutzt, um die Verstrichene Zeit zu speichern. Dieser Datentyp variiert also von Programmiersprache zu Programmiersprache und genutzter Bibliothek.
 +
 
 +
== Funktionsweise der 2D Animations Klasse ==
 +
Zuerst noch mal der Hinweis, falls dieses noch nicht geschehen ist, sich den Artikel für die [[Sprite-Sheet-Klasse]] durchzulesen, das erhöht das Verständnis für die Funktionsweise der 2D Animations Klasse.
 +
 
 +
Die Funktion ''Load_SpriteSheet(String path, int SpriteSize_X, int SpriteSize_Y)'' veranlasst, dass die gewünschte Bilddatei in den Speicher geladen wird. Die Werte für ''SpriteSize_X'' und ''SpriteSize_Y'' bestimmen wie groß das "Sichtfenster" innerhalb des Sprite Sheets sein soll.
 +
 
 +
Der Aufruf der Funktion ''Set_Animation(int firstframe, int lastframe, int stopframe, float frametime)'' legt die Eckdaten der Animation fest. Der Wert ''firstframe'' bestimmt dabei den ersten Index, für das erste Bild der Animation, auf dem Sprite Sheet und ''lastframe'' legt den Index für das letzte Bild der Animation auf dem Sprite Sheet fest. Der Wert von ''frametime'' legt fest wie viel Zeit vergehen soll bis das nächste Bild der Animation angezeigt werden soll. Die Variable ''stopframe'' enthält den Index für das Bild, welches Angezeigt wird, wenn die Animation gestoppt ist, dieses könnte z.B. das erste Bild der Animation sein oder aber auch ein ganz anderes Bild auf dem Sprite Sheet.
 +
 
 +
Der Aufruf der ''Animation_On(bool Value)'' Methode bewirkt das die Variable ''Animation_On'' auf true gesetzt wird, ebenfalls wird der Wert von ''CurrentFrame'' auf den Wert der Variable ''FirstFrame'' gesetzt. Mit der Rechnung <span style="color:#505050"> NextFrameTime = Timer + FrameTime </span>wird noch bestimmt zu welchem Zeitpunkt das nächste Bild der Animation angezeigt werden soll.
 +
 
 +
Da es ausreichend ist, dass jede Instanz der 2D Animaitons Klasse auf einen einzigen Zeitgeber zurückgreift, ist dieser statisch. Der statische Zeitgeber ist sozusagen der Motor der Klasse. Wird die Funktion ''Get_CurrentFrame()'' aufgerufen wird als erstes überprüft ob ''Animation_On'' true oder false ist. Wenn ''Animation_On'' gleich false ist, wird der [[Sprite-Sheet-Klasse]] mittels der ''Get_Sprite(int Index)'' Methode die Variable ''StopFrame'' übergeben und die Funktion gibt das gewünschte [http://de.wikipedia.org/wiki/Sprite_(Computergrafik) Sprite] zurück, für den Fall das keine Animation erwünscht ist. Für den Fall, dass ''Animation_On'' gleich true ist, wird verglichen ob, NextFrameTime kleiner ist wie Timer. Solange ''NextFrameTime'' größer ist wie ''Timer'' wird das aktuelle Bild der Animation dargestellt. Wenn der Wert des ''Timer'' größer wird als der Wert von ''NextFrameTime'', wird ''CurrentFrame'' um eins erhöht und der Wert von ''NextFrameTime'' mit der Rechnung <span style="color:#505050"> NextFrameTime = Timer + FrameTime </span> neu ermittelt. Trifft der Fall ein, dass der Wert von ''CurrentFrame'' größer wird wie der Wert von ''LastFrame'', wird ''CurrentFrame'' wieder auf den Wert von ''FirstFrame'' gesetzt. So beginnt die Animation wieder von vorne.
 +
== Pseudocode ==
 +
Da es eine große Anzahl von Frameworks und Programmiersprachen gibt, sind hier exemplarisch die wichtigsten Funktionen der 2D Animations Klasse in Pseudocode. Das Transferieren des Pseudocodes in die gewünschte Programmiersprache / Framework sollte für die Meisten keine Probleme darstellen.
 +
{{Spoiler|'''Header Datei'''|
 +
<sourcecode lang=cpp tab=4 >
 +
/* Header der 2dAnimation Klasse  */
 +
 
 +
class C2dAnimation
 +
{
 +
private:
 +
    static Framework::Zeitgeber Timer;    // Zeitgeber abhängig von Programmiersprache oder verwendeter Bibliothek
 +
    CSpriteSheet Sheet;                  // Instanz der Sprite-Sheet-Klasse zum ermitteln des Richtigen Sprites
 +
    float FrameTime;                      // Zeit die ein Frame der Animation angezeigt wird
 +
    float NextFrameTime;                  // Zeit bei der das nächste Sprite angezeigt wird
 +
    int FirstFrame;                      // Erste Index auf dem Sprite Sheet für die Animation
 +
    int LastFrame;                        // Letzte Index auf dem Sprite Sheet für die Animation
 +
    int StopFrame;                        // Index des Bildes was Dargstellt wird wenn die Animation aus ist
 +
    bool Animation_On;                    // Animation an/aus
 +
public:
 +
    bool Load_SpriteSheet(String Path,
 +
                          int X_Size,
 +
                          int Y_Size);    // Funktion zum Laden des Richtigen Bildes
 +
    Framework::Sprite Get_CurrentFrame(); // Funktion die das darzustellende Sprite liefert
 +
    void Set_Animation(int firstframe,
 +
                      int lastframe,
 +
                      int stopframe,
 +
                      float frametime)  // Setzten der Animationsdaten
 +
    bool Animation_On(bool Value);        // Funktion um die Animation ein- oder ausschalten
 +
    C2dAnimation();                      // Konstruktor
 +
    ~C2dAnimation();                      // Destroktor
 +
};
 +
</sourcecode>
 +
}}
 +
{{Spoiler|'''Load_SpriteSheet(String Path,int X_Size,int Y_Size)'''|
 +
<sourcecode lang=cpp tab=4 >
 +
/* Ladefunktion für das Sprite Sheet*/
 +
 
 +
bool C2dAnimation::Load_SpriteSheet(String Path,int X_Size,int Y_Size)
 +
{
 +
    zurückgeben Sheet.Load(Path,X_Size,Y_Size); // gibt true oder false zurück
 +
}
 +
</sourcecode>
 +
}}
 +
 
 +
{{Spoiler|'''Get_CurrentFrame()'''|
 +
<sourcecode lang=cpp tab=4 >
 +
/* Liefert das Aktuell gültige Sprite zurück */
 +
 
 +
Framework::Sprite C2dAnimation::Get_CurrentFrame()
 +
{
 +
    Wenn Animation an ist(Animation_On == true)
 +
    {
 +
        Wenn NextFrameTime kleiner Timer ist (NextFrameTime < Timer)
 +
        {
 +
            zurückgeben Sheet.Get_Sprite(CurrentFrame);
 +
        }
 +
        sonst
 +
        {
 +
            CurrentFrame = CurrenFrame + 1;
 +
            Wenn CurrentFrame gößer LastFrame ist (CurrentFrame > LastFrame)
 +
            {
 +
                CurrentFrame = FirstFrame;
 +
                NextFrameTime = Timer + FrameTime;
 +
            }
 +
            zurückgeben Sheet.Get_Sprite(CurrentFrame);
 +
        }
 +
    }
 +
    sonst
 +
    {
 +
        zurückgeben Sheet.Get_Sprite(StopFrame);
 +
    }
 +
}
 +
</sourcecode>
 +
}}
 +
{{Spoiler|'''Set_Animation(int firstframe,int lastframe,int stopframe,float frametime)'''|
 +
<sourcecode lang=cpp tab=4 >
 +
/* Daten der Animation Setzen */
 +
 
 +
void C2dAnimation::Set_Animation(int firstframe,int lastframe,int stopframe,float frametime)
 +
{
 +
    FirstFrame = firstframe;
 +
    LastFrame = lastframe;
 +
    StopFrame = stopframe;
 +
    FrameTime = frametime;
 +
}
 +
</sourcecode>
 +
}}
 +
{{Spoiler|'''Animation_On(bool Value)'''|
 +
<sourcecode lang=cpp tab=4 >
 +
/* Die Ein- Ausschaltfunktion der Animation */
 +
 
 +
void C2dAnimation::Animation_On(bool Value)
 +
{
 +
    Wenn Value True ist (Value == true)
 +
    {
 +
        CurrentFrame = FirstFrame;
 +
        NextFrameTime = Timer + FrameTime;
 +
        Animation_On = true;
 +
    }
 +
    sonst
 +
    {
 +
        Animation_On = false;
 +
    }
 +
}
 +
</sourcecode>
 +
}}

Aktuelle Version vom 17. Oktober 2013, 16:20 Uhr

Klicke hier, um diese Version anzusehen.

Von „https://www.spieleprogrammierer.de/wiki/2D-Animationsklasse“
Meine Werkzeuge
Namensräume
Varianten
Aktionen
Navigation
Werkzeuge