lyb-pixi-js 1.5.3 → 1.6.1

package/README.md

@@ -144,6 +144,8 @@ app.stage.addChild(box);
 
 \- [LibPixiPolygonDrawTool-多边形绘制](#LibPixiPolygonDrawTool-多边形绘制)
 
+\- [LibPixiWatchProperty-对象属性监听](#LibPixiWatchProperty-对象属性监听)
+
 ## Base-基础
 
 ### LibPixiText-文本
@@ -818,3 +820,20 @@ $bus.on("play", () => {
 ```ts
 new LibPixiPolygonDrawTool(app);
 ```
+
+### LibPixiWatchProperty-对象属性监听
+
+> 内部通过 Ticker 每秒调用10次循环判断被监听的属性是否发生改变，当元素被销毁时自动销毁 Ticker，取决于是否传递了元素
+
+```ts
+LibPixiWatchProperty(
+  gameStore,
+  ["a", "b"],
+  () => {
+    warningContainer.visible = a;
+    useBtn.eventMode = a || b ? "none" : "static";
+  },
+  this
+);
+```
+

package/Utils/LibPixiWatchProperty.d.ts

@@ -0,0 +1,9 @@
+import { type Container } from "pixi.js";
+/** @description 对象属性监听
+ * @param obj 对象
+ * @param keys 监听的对象属性
+ * @param callback 监听的对象属性发生变化时触发回调
+ * @param container 容器对象，用于判断元素是否被销毁
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiWatchProperty-对象属性监听
+ */
+export declare const LibPixiWatchProperty: <T extends object, K extends keyof T>(obj: T, keys: K[], callback: () => void, container?: Container) => void;

package/Utils/LibPixiWatchProperty.js

@@ -0,0 +1,46 @@
+import { Ticker } from "pixi.js";
+/** @description 对象属性监听
+ * @param obj 对象
+ * @param keys 监听的对象属性
+ * @param callback 监听的对象属性发生变化时触发回调
+ * @param container 容器对象，用于判断元素是否被销毁
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiWatchProperty-对象属性监听
+ */
+export const LibPixiWatchProperty = (obj, keys, callback, container) => {
+    const ticker = new Ticker();
+    const lastValues = new Map();
+    ticker.maxFPS = 10;
+    callback();
+    //存储上一次的值
+    for (let i = 0; i < keys.length; i++) {
+        const key = keys[i];
+        lastValues.set(key, obj[key]);
+    }
+    const flag = (key) => {
+        if (lastValues.get(key) !== obj[key]) {
+            lastValues.set(key, obj[key]);
+            return true;
+        }
+        return false;
+    };
+    ticker.add(() => {
+        //如果元素被销毁
+        if (container === null || container === void 0 ? void 0 : container.destroyed) {
+            ticker.destroy();
+            return;
+        }
+        let changed = false;
+        if (keys.length === 1) {
+            changed = flag(keys[0]);
+        }
+        else {
+            for (let i = 0; i < keys.length; i++) {
+                const key = keys[i];
+                changed = flag(key);
+            }
+        }
+        if (changed)
+            callback();
+    });
+    ticker.start();
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lyb-pixi-js",
-  "version": "1.5.3",
+  "version": "1.6.1",
   "description": "自用Pixi.JS方法库",
   "license": "ISC",
   "exports": {