Anime

Anime ist eine Funktion zum Abspielen ebenenbasierter Animationen über das Anime-Tag.

Anime-Datei

Eine Anime-Datei ist eine Textdatei, die Sequenzen von Ebenentransformationen beschreibt.

Sequenz

Um das Meldungsfeld in einer Sekunde um 100 Pixel nach rechts zu verschieben, schreiben Sie die folgende Sequenz in eine Anime-Datei.

# Ein Block beschreibt eine Sequenz zur Animation.
# Der Name eines Blocks kann beliebig sein und hat keinerlei Auswirkungen.
move {
    # Dies ist ein Ebenenspezifizierer.
    layer: msg;

    # Dies sind Zeitspezifizierer. (in Sekunden)
    start: 0.0;
    end: 1.0;

    # Dies sind Ursprungspositionsspezifizierer. „r0“ bedeutet relative „0“.
    from-x: r0;
    from-y: r0;

    # Dies ist ein Ursprungs-Alpha-Spezifizierer.
    from-a: 255;

    # Dies sind Endpositionsspezifizierer. „r100“ bedeutet relativ „100“.
    to-x: r100;
    to-y: r0;

    # Dies ist ein endgültiger Alpha-Spezifizierer.
    to-a: 255;
}

Schichtstruktur

Das Folgende ist unsere Schichtenstruktur in der Reihenfolge von unten nach oben.

Skalierung und Rotation

# Vergrößern und drehen Sie die Ebene `effect1` in 3 Sekunden auf 2.0x und 360 Grad.
test1 {
    layer: effect1;
 
    start: 0.0;
    end: 3.0;

    from-x: 0;
    from-y: 400;
    from-a: 255;

    to-x: 0;
    to-y: 400;
    to-a: 255;

    # Skalierungs- und Rotationsursprung
    center-x: 600;
    center-y: 100;

    # Skalierungsfaktoren
    from-scale-x: 1.0;
    from-scale-y: 1.0;
    to-scale-x: 2.0;
    to-scale-y: 2.0;
 
    # Drehung (+ für rechts, - für links)
    from-rotate: 0.0;
    to-rotate: -360;
}

# Umkehren.
test2 {
    layer: effect1;

    start: 3.0;
    end: 6.0;

    from-x: 0;
    from-y: 400;
    from-a: 255;

    to-x: 0;
    to-y: 400;
    to-a: 255;

    center-x: 600;
    center-y: 100;

    from-scale-x: 2.0;
    to-scale-x: 1.0;

    from-scale-y: 2.0;
    to-scale-y: 1.0;

    from-rotate: -360;
    to-rotate: 0;
}