目錄

Sprite 

容器操作

Sprite 

Package	laya.display
類	public class Sprite
Inheritance	Sprite Node EventDispatcher Object
子類	AnimationBase, PerfHUD, Scene, Stage, Text

1、Sprite 是基本的顯示圖形的顯示列表節點， Sprite 預設沒有寬高，預設不接受滑鼠事件。

2、通過 graphics 可以繪製圖片或者向量圖，支援旋轉，縮放，位移等操作。

3、laya.display.Sprite 同時也是容器類，可用來新增多個子節點。

容器操作

/**
 * 新增子節點。此方法繼承在父類 laya.display.Node
 * @param   node 節點物件
 * @return  返回新增的節點
 */
addChild(node: Node): Node;

實現上圖的方案之一是建立一個 Sprite 作為容器，然後將4個小貓作為其子節點(Sprite)，最後設定好子節點位置，進行定時呼叫改變父容器 Sprite 角度即可。實現程式碼如下：

/**ES6類 */
class Tomcat_Container {
    /**類的構造器函式 */
    constructor() {
        const Browser = Laya.Browser;//瀏覽器物件路徑，方便後續建立物件
        const Stage = Laya.Stage;//舞臺物件路徑，方便後續建立物件

        /**初始化舞臺，不支援WebGL時自動切換至Canvas
         * 裝置畫素解析度：clientWidth、clientHeight
         */
        Laya.init(Browser.clientWidth, Browser.clientHeight, Laya.WebGL);

        /**設定舞臺水平對齊模式居中，垂直對齊模式為居中
         * SCALE_SHOWALL:應用顯示全部內容，按照最小比率縮放，等比縮放不變形，一邊可能會留空白，stage的寬高等於設計寬高
         */
        Laya.stage.alignV = Stage.ALIGN_MIDDLE;
        Laya.stage.alignH = Stage.ALIGN_CENTER;
        Laya.stage.scaleMode = Stage.SCALE_SHOWALL;

        this.showTomcat();
    }

    /**顯示 Tomcat 貓容器 */
    showTomcat() {
        const Sprite = Laya.Sprite;//精靈物件路徑，方便後續建立物件
        const layoutRadius = 150;
        var radianUnit = Math.PI / 2;

        // tomcats：這個精靈將當做一個容器使用，用於裝載子精靈(4 張圖片)
        //this.tomcats表示建立的是類的全域性屬性，可以在本來的任意方法中呼叫
        this.tomcats = new Sprite();
        Laya.stage.addChild(this.tomcats);

        // tom：4 張子圖片(精靈)，將新增到精靈 tomcats 父容器中
        let tom;
        for (let i = 0; i < 4; i++) {
            tom = new Sprite();
            this.tomcats.addChild(tom);/**新增子節點 */
            tom.loadImage('http://tomcat.apache.org/res/images/tomcat.png');/**載入並顯示一個圖片*/
            /**pivot：設定軸心點，返回物件本身；pos：設定座標位置 */
            tom.pivot(55, 72).pos(Math.cos(radianUnit * i) * layoutRadius, Math.sin(radianUnit * i) * layoutRadius);
        }
        /**設定容器 tomcats 的顯示的位置*/
        this.tomcats.pos(Laya.stage.width / 2, Laya.stage.height / 2);

        /**定時重複執行(基於幀率)。
         * frameLoop(delay: number, caller: any, method: Function, args?: Array<any>, coverBefore?: boolean)
         * delay	間隔幾幀(單位為幀)；caller	執行域(this)；method	定時器回撥函式。
         * args	回撥引數； coverBefore	是否覆蓋之前的延遲執行，預設為 true 。
         */
        Laya.timer.frameLoop(1, this, this.animate);
    }

    /**幀動畫回撥函式 */
    animate() {
        /**rotation：旋轉角度，預設值為0。以角度為單位。決定了影象執行的快慢*/
        this.tomcats.rotation += 0.5;
    }
}

/**執行本類 */
new Tomcat_Container();