EaselJS - 具有兩個不同的FPS畫布

我正在試驗EaselJS和2個動畫實例使用精靈表和2個獨立的畫布在不同位置具有相同的z-index，它們不是分層的。我現在所擁有的是兩個EaselJS函數，每個函數都有不同的階段和精靈表單，instance1在DOM裝入後由jQuery觸發，instance2在mouseter/mouseleave事件中也由jQuery觸發。EaselJS - 具有兩個不同的FPS畫布

EaselJS：

function instance1() { 
    var stage = new Stage(document.getElementById(canvas1)); 
    var ss = new SpriteSheet({ 
     "images": ["sprite1.jpg"], 
     "frames": {"regY": 0, "height": 100, "regX": 0, "width": 200, "count": 17}, 
     "animations": {"instance1": [0, 16]} 
    }); 

     var initInstance1 = new BitmapAnimation(ss); 
    initInstance1.x = 0; 
    initInstance1.y = 0; 
    initInstance1.gotoAndPlay("instance1"); 

    stage.addChild(initInstance1); 
    Ticker.setFPS(10); 
    Ticker.addListener(stage); 
} 
function instance2() { 
    var stage = new Stage(document.getElementById(canvas2)); 
    var ss = new SpriteSheet({ 
     "images": ["sprite2.jpg"], 
     "frames": {"regY": 0, "height": 100, "regX": 0, "width": 200, "count": 17}, 
     "animations": {"instance2": [0, 16]} 
    }); 

     var initInstance2 = new BitmapAnimation(ss); 
    initInstance2.x = 0; 
    initInstance2.y = 0; 
    initInstance2.gotoAndPlay("instance2"); 

    stage.addChild(initInstance2); 
    Ticker.setFPS(24); 
    Ticker.addListener(stage); 
}

測試時，我發現，而不是在每個函數定義的FPS運行，INSTANCE1將在10FPS（）運行，那麼如果INSTANCE2通過的mouseenter調用;使用jQuery，instance1的FPS將自動更改instance2的FPS。是否有方法將不同的Ticker應用於每個實例以保留單獨的FPS？提前致謝。

來源

2012-06-02 dcd0181

documentation指出Ticker提供了「以設定間隔廣播的集中式節拍或心跳」。它還聲明它實現了一個靜態API，不應該被實例化。因此，看起來圖書館不支持創建以不同間隔運行的多個代號。

24 fps對於平滑動畫的幀速率要比10好得多。是否可以將該幀設置爲全局，並使用其他值（例如持續時間）來減慢第一個實例的動畫速度？另一個選項可能是將幀速率設置爲較高的值並實現一些代碼（如jquery throttle plugin），以限制對啓動實例1的函數的調用次數。

來源

2012-06-02 13:32:23

我正在調用instance1，在DOM加載時沒有參數，例如'instance1（）;'，我怎麼能寫'instance1（$。throttle（10，this））;'？它似乎沒有工作，謝謝！ – dcd0181

你能夠將你的代碼的工作版本發佈到http://jsfiddle.net嗎？ –

http://jsfiddle.net/WUB4W/，雖然沒有精靈，所以它不起作用，但這基本上是我的應用程序組成的。感謝您看一看，您提到的油門插件是一個好主意。 – dcd0181

不要將您的Stage對象作爲偵聽器添加到自動收報器中，請嘗試創建自己的tick函數並使用它。這樣你就可以隨時更新你的舞臺。

 
window.tick = function (delta) { 
... 
};
 
Ticker.setFPS(20); 
Ticker.addListener(window);

編輯：或者你可以保持你的代碼完好，並在你的「慢」階段覆蓋 tick方法，並只在需要時更新。

來源

2012-06-08 12:15:09 akonsu

EaselJS - 具有兩個不同的FPS畫布

回答

相關問題