動畫

Anime 是一個透過 anime 標籤播放以圖層為基礎的動畫功能。

Anime 檔案

Anime 檔案是一種文字檔，用來描述圖層轉換的序列。

序列

若要讓訊息視窗在一秒內向右移動 100px，請在 anime 檔案中寫入以下序列。

# 一個區塊描述一段動畫序列。
# 區塊名稱可以隨意命名，不會影響任何事。
move {
    # 這是圖層指定子。
    layer: msg;

    # 這些是時間指定子。（單位：秒）
    start: 0.0;
    end: 1.0;

    # 這些是起始位置指定子。`r0` 代表相對位置 0。
    from-x: r0;
    from-y: r0;

    # 這是起始 alpha 指定子。
    from-a: 255;

    # 這些是結束位置指定子。`r100` 代表相對位置 100。
    to-x: r100;
    to-y: r0;

    # 這是結束 alpha 指定子。
    to-a: 255;
}

圖層結構

以下是我們由下到上的圖層結構。

縮放與旋轉

# 將 `effect1` 圖層在 3 秒內放大到 2.0 倍並旋轉 360 度。
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;

    # 縮放與旋轉的中心點
    center-x: 600;
    center-y: 100;

    # 縮放係數
    from-scale-x: 1.0;
    from-scale-y: 1.0;
    to-scale-x: 2.0;
    to-scale-y: 2.0;
 
    # 旋轉（正值向右，負值向左）
    from-rotate: 0.0;
    to-rotate: -360;
}

# 反向。
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;
}