lyb-pixi-js 1.2.5 → 1.3.1

package/README.md

@@ -142,6 +142,8 @@ app.stage.addChild(box);
 
 \- [LibPixiSlideInput-滑块选择值](#LibPixiSlideInput-滑块选择值)
 
+\- [LibGlobalUpdater-事件实例汇总](#LibGlobalUpdater-事件实例汇总)
+
 ## Base-基础
 
 ### LibPixiText-文本
@@ -262,11 +264,11 @@ import { LibPixiButtonHover } from "lyb-pixi-js";
 
 //创建按钮实例
 const button = new LibPixiButtonHover({
-  texture: PIXI.Texture.from('path/to/normal.png'),
-  hoverTexture: PIXI.Texture.from('path/to/hover.png'),
+  texture: PIXI.Texture.from("path/to/normal.png"),
+  hoverTexture: PIXI.Texture.from("path/to/hover.png"),
   tintColor: "#ff0000", //默认颜色
   hoverTintColor: "#00ff00", //悬浮颜色
-  disabledColor: "#cccccc" //禁用颜色
+  disabledColor: "#cccccc", //禁用颜色
 });
 
 //启用/禁用按钮
@@ -275,8 +277,8 @@ button.setDisabled(true); //禁用
 
 //切换按钮材质
 button.toggleTexture(
-  PIXI.Texture.from('path/to/new_normal.png'),
-  PIXI.Texture.from('path/to/new_hover.png')
+  PIXI.Texture.from("path/to/new_normal.png"),
+  PIXI.Texture.from("path/to/new_hover.png")
 );
 
 //添加到Pixi舞台
@@ -492,17 +494,17 @@ const betControl = new LibPixiSubAddMinMax({
     } else if (type === "max") {
       maxButton.tint = 0x999999; //禁用最大按钮
     } else {
-      minButton.tint = 0xFFFFFF; //启用最小按钮
-      maxButton.tint = 0xFFFFFF; //启用最大按钮
+      minButton.tint = 0xffffff; //启用最小按钮
+      maxButton.tint = 0xffffff; //启用最大按钮
     }
-  }
+  },
 });
 
 //设置初始状态
-betControl.min();  //设置为最小值
-betControl.max();  //设置为最大值
-betControl.sub();  //减少下注
-betControl.add();  //增加下注
+betControl.min(); //设置为最小值
+betControl.max(); //设置为最大值
+betControl.sub(); //减少下注
+betControl.add(); //增加下注
 
 //添加到Pixi舞台
 app.stage.addChild(minButton, maxButton, subButton, addButton);
@@ -652,7 +654,6 @@ stopInterval();
 > 点击容器外或入口按钮时隐藏
 
 ```ts
-
 let removeEventListener: () => void;
 const btn = new Sprite(Assets.get("btnIcon"));
 const optionList = new Container();
@@ -680,7 +681,7 @@ libPixiEvent(btn, "pointertap", () => {
 const mask = libPixiOverflowHidden(container); //为容器创建并应用矩形蒙版
 ```
 
-### LibPixiPromiseTickerTimeout-TickerPromise定时器
+### LibPixiPromiseTickerTimeout-TickerPromise 定时器
 
 > 基于 Ticker 和 Promise 的定时器
 
@@ -714,7 +715,7 @@ libPixiShadow(container, {
 });
 ```
 
-### LibPixiTickerTimeout-Ticker定时器
+### LibPixiTickerTimeout-Ticker 定时器
 
 > 基于 Ticker 的定时器
 
@@ -761,3 +762,32 @@ const slideInput = new LibPixiSlideInput({
 slideInput.setValue(0.5);
 ```
 
+### LibGlobalUpdater-事件实例汇总
+
+> 将组件实例化后，将涉及通过事件总线更新的实例进行存储，用于事件总线统一在一个位置监听并通过从实例汇总中获取实例调用实例的方法进行更新
+
+```ts
+//app.ts
+this.gameUI = new GameUI();
+this.addChild(this.gameUI);
+globalUpdater.setInstance("GameUI", this.gameUI);
+
+this.toolbarUI = new ToolbarUI();
+this.addChild(this.toolbarUI);
+globalUpdater.setInstance("ToolbarUI", this.toolbarUI);
+
+//globalUpdater.ts
+import type { GameUI } from "@/app/ui/GameUI";
+import type { ToolbarUI } from "@/app/ui/ToolbarUI";
+
+type Instances = "GameUI" | "ToolbarUI"
+const globalUpdater = new GlobalUpdater<Instances>();
+export { globalUpdater };
+
+//开始游戏
+$bus.on("play", () => {
+  globalUpdater.getInstance<GameUI>("GameUI").play();
+  globalUpdater.getInstance<ToolbarUI>("ToolbarUI").play();
+});
+```
+

package/Utils/LibGlobalUpdater.d.ts

@@ -0,0 +1,15 @@
+import type { Container } from "pixi.js";
+/** @description 事件总线更新实例汇总 */
+export declare class LibGlobalUpdater<Instances> {
+    /** 实例列表 */
+    private instances;
+    /** @description 存储实例
+     * @param key 实例key
+     * @param instance 实例
+     */
+    setInstance(key: Instances, instance: Container): void;
+    /** @description 获取实例
+     * @param key 实例key
+     */
+    getInstance<T>(key: Instances): T;
+}

package/Utils/LibGlobalUpdater.js

@@ -0,0 +1,21 @@
+/** @description 事件总线更新实例汇总 */
+export class LibGlobalUpdater {
+    constructor() {
+        /** 实例列表 */
+        this.instances = new Map();
+    }
+    /** @description 存储实例
+     * @param key 实例key
+     * @param instance 实例
+     */
+    setInstance(key, instance) {
+        this.instances.has(key) && this.instances.delete(key);
+        this.instances.set(key, instance);
+    }
+    /** @description 获取实例
+     * @param key 实例key
+     */
+    getInstance(key) {
+        return this.instances.get(key);
+    }
+}

package/libPixiJs.d.ts

@@ -16,6 +16,7 @@ import { LibPixiSubAddMinMax } from "./Components/Custom/LibPixiSubAddMinMax";
 import { LibPixiTable } from "./Components/Custom/LibPixiTable";
 import { LibPixiAudio } from "./Utils/LibPixiAudio";
 import { LibPixiSlideInput } from "./Utils/LibPixiSlideInput";
+import { LibGlobalUpdater } from "./Utils/LibGlobalUpdater";
 /** @description 组件 */
 export declare const Components: {
     Base: {
@@ -165,4 +166,8 @@ export declare const Utils: {
      * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSlideInput-滑动选择值
      */
     LibPixiSlideInput: typeof LibPixiSlideInput;
+    /** @description 事件总线更新实例汇总
+     * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibGlobalUpdater-事件实例汇总
+     */
+    LibGlobalUpdater: typeof LibGlobalUpdater;
 };

package/libPixiJs.js

@@ -27,6 +27,7 @@ import { libPixiFilter } from "./Utils/LibPixiFilter";
 import { libPixiShadow } from "./Utils/LibPixiShadow";
 import { libPixiTickerTimeout } from "./Utils/LibPixiTickerTimeout";
 import { LibPixiSlideInput } from "./Utils/LibPixiSlideInput";
+import { LibGlobalUpdater } from "./Utils/LibGlobalUpdater";
 /** @description 组件 */
 export const Components = {
     Base: {
@@ -176,4 +177,8 @@ export const Utils = {
      * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiSlideInput-滑动选择值
      */
     LibPixiSlideInput,
+    /** @description 事件总线更新实例汇总
+     * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibGlobalUpdater-事件实例汇总
+     */
+    LibGlobalUpdater,
 };