Ticker
PixiJS 中的 Ticker 类提供了一种强大而灵活的机制,用于在每个动画帧上执行回调。它对于管理游戏循环、动画以及任何基于时间的更新非常有用。
🌐 The Ticker class in PixiJS provides a powerful and flexible mechanism for executing callbacks on every animation frame. It's useful for managing game loops, animations, and any time-based updates.
import { Ticker } from 'pixi.js';
const ticker = new Ticker();
ticker.add((ticker) => {
console.log(`Delta Time: ${ticker.deltaTime}`);
});
// Start the ticker
ticker.start();
添加和移除监听器
🌐 Adding and Removing Listeners
Ticker 类允许你添加多个监听器,这些监听器将在每一帧上被调用。你还可以为回调指定上下文,这对于保持正确的 this 引用非常有用。
🌐 The Ticker class allows you to add multiple listeners that will be called on every frame. You can also specify a context for the callback, which is useful for maintaining the correct this reference.
ticker.add(myFunction, myContext);
ticker.addOnce(myFunction, myContext);
ticker.remove(myFunction, myContext);
控制 Ticker
🌐 Controlling the Ticker
ticker.start(); // Begin calling listeners every frame
ticker.stop(); // Pause the ticker and cancel the animation frame
要在添加监听器时自动启动计时器,请启用 autoStart:
🌐 To automatically start the ticker when a listener is added, enable autoStart:
ticker.autoStart = true;
确定监听器优先级
🌐 Prioritizing Listeners
监听器可以被分配优先级。数值越高,运行越早。
🌐 Listeners can be assigned a priority. Higher values run earlier.
import { UPDATE_PRIORITY } from 'pixi.js';
ticker.add(fnA, null, UPDATE_PRIORITY.HIGH); // runs before...
ticker.add(fnB, null, UPDATE_PRIORITY.NORMAL); // ...this
可用常量包括:
🌐 Available constants include:
UPDATE_PRIORITY.HIGH = 50UPDATE_PRIORITY.NORMAL = 0UPDATE_PRIORITY.LOW = -50
配置 FPS
🌐 Configuring FPS
Tickers 允许通过 FPS 限制来控制更新速率。
🌐 Tickers allows FPS limits to control the update rate.
minFPS
限制帧允许的最慢速度。用来限制 deltaTime:
🌐 Caps how slow frames are allowed to be. Used to clamp deltaTime:
ticker.minFPS = 30; // deltaTime will never act as if below 30 FPS
maxFPS
限制计时器运行的速度。对节省 CPU/GPU 有用:
🌐 Limits how fast the ticker runs. Useful for conserving CPU/GPU:
ticker.maxFPS = 60; // will not tick faster than 60fps
设置为 0 以允许无限帧率:
🌐 Set to 0 to allow unlimited framerate:
ticker.maxFPS = 0;
API 参考
🌐 API Reference