lyb-pixi-js 1.12.44 → 1.12.46

package/Components/Custom/LibPixiGridColumnLayout.d.ts

@@ -0,0 +1,35 @@
+export interface GridLayoutParams {
+    /** 行数 */
+    rowNum?: number;
+    /** 列间隔 */
+    colGap?: number;
+    /** 行间隔 */
+    rowGap?: number;
+    /** 元素列表 */
+    elementList?: any[];
+    /** 锚点X */
+    anchorX?: number;
+    /** 锚点Y */
+    anchorY?: number;
+    /** 每列最大行数 */
+    maxRow?: number;
+    /** 布局方向：ltr 左到右，rtl 右到左 */
+    direction?: "ltr" | "rtl";
+}
+import { Container } from "pixi.js";
+/** @description 网格列布局 */
+export declare class LibPixiGridColumnLayout<T extends Container> extends Container {
+    /** 参数 */
+    private _params;
+    /** 元素列表 */
+    private _elementList;
+    constructor(params?: GridLayoutParams);
+    /** @description 追加元素 */
+    push(element: T): void;
+    /** @description 列布局 */
+    layout(): void;
+    /** @description 获取列表元素 */
+    getList(): T[];
+    /** @description 销毁列表元素 */
+    destroyList(): void;
+}

package/Components/Custom/LibPixiGridColumnLayout.js

@@ -0,0 +1,40 @@
+import { Container } from "pixi.js";
+/** @description 网格列布局 */
+export class LibPixiGridColumnLayout extends Container {
+    constructor(params) {
+        super();
+        /** 元素列表 */
+        this._elementList = [];
+        this._params = params || {};
+        this._elementList = this._params.elementList || [];
+    }
+    /** @description 追加元素 */
+    push(element) {
+        this.addChild(element);
+        this._elementList.push(element);
+    }
+    /** @description 列布局 */
+    layout() {
+        const { rowNum = 1, colGap = 325, rowGap = 75, anchorX = 0, anchorY = 0, direction = "ltr", } = this._params;
+        const isRTL = direction === "rtl";
+        this._elementList.forEach((item, index) => {
+            const row = index % rowNum;
+            const col = Math.floor(index / rowNum);
+            item.x = isRTL ? -col * colGap : col * colGap;
+            item.y = row * rowGap;
+        });
+        const bounds = this.getLocalBounds();
+        this.pivot.set(bounds.x + bounds.width * anchorX, bounds.y + bounds.height * anchorY);
+    }
+    /** @description 获取列表元素 */
+    getList() {
+        return this._elementList;
+    }
+    /** @description 销毁列表元素 */
+    destroyList() {
+        this._elementList.forEach((item) => {
+            item.destroy();
+        });
+        this._elementList = [];
+    }
+}

package/Components/Custom/{LibPixiGridLayoutV2.d.ts → LibPixiGridRowLayout.d.ts}

@@ -7,10 +7,14 @@ export interface GridLayoutParams {
     rowGap?: number;
     /** 元素列表 */
     elementList?: any[];
+    /** 锚点X */
+    anchorX?: number;
+    /** 锚点Y */
+    anchorY?: number;
 }
 import { Container } from "pixi.js";
-/** @description 网格布局 */
-export declare class LibPixiGridLayoutV2<T extends Container> extends Container {
+/** @description 网格行布局 */
+export declare class LibPixiGridRowLayout<T extends Container> extends Container {
     /** 参数 */
     private _params;
     /** 元素列表 */

package/Components/Custom/{LibPixiGridLayoutV2.js → LibPixiGridRowLayout.js}

@@ -1,6 +1,6 @@
 import { Container } from "pixi.js";
-/** @description 网格布局 */
-export class LibPixiGridLayoutV2 extends Container {
+/** @description 网格行布局 */
+export class LibPixiGridRowLayout extends Container {
     constructor(params) {
         super();
         /** 元素列表 */
@@ -15,13 +15,16 @@ export class LibPixiGridLayoutV2 extends Container {
     }
     /** @description 布局 */
     layout() {
-        const { colNum = this._elementList.length, colGap = 325, rowGap = 75, } = this._params;
+        const { colNum = this._elementList.length, colGap = 325, rowGap = 75, anchorX = 0, anchorY = 0, } = this._params;
         this._elementList.forEach((item, index) => {
             const col = index % colNum;
             const row = Math.floor(index / colNum);
             item.x = col * colGap;
             item.y = row * rowGap;
         });
+        // 根据 anchor 调整整体偏移
+        const bounds = this.getLocalBounds();
+        this.pivot.set(bounds.x + bounds.width * anchorX, bounds.y + bounds.height * anchorY);
     }
     /** @description 获取列表元素 */
     getList() {

package/Components/Custom/LibPixiInput.d.ts

@@ -6,7 +6,7 @@ interface Params {
     /** 高度 */
     height: number;
     /** 字体与高度比 */
-    fontSizeRatio: number;
+    fontSizeRatio?: number;
     /** 使用字体 */
     fontFamily?: string;
     /** 是否加粗 */

package/README.md

@@ -915,9 +915,9 @@ const amountContainer = new LibLabelValue({
 
 > 内部创建文本类组，公共样式和单个设置样式，并整体支持换行
 
-### LibPixiGridLayoutV2-网格布局V2
+### LibPixiGridRowLayout-网格行布局
 
-> 省略自己创建数组对组件进行 `push` ，内部做了 `push` 处理
+> 一列占满后进入下一列
 
 ### LibPixiAreaClick-扩大点击范围
 
@@ -927,6 +927,10 @@ const amountContainer = new LibLabelValue({
 
 > 只支持一个标题和一个内容，一般用于一些隐私政策和服务条款
 
+### LibPixiGridColumnLayout-网格列布局
+
+> 一列占满后进入下一列，支持从左到右或从右到左
+
 ## Utils-工具方法
 
 ### LibPixiAudio-音频播放器
@@ -1077,6 +1081,36 @@ libPixiEvent(btn, "pointertap", () => {
     removeEventListener();
   }
 });
+
+//带动画
+libPixiEvent(tipIcon, "pointertap", () => {
+  this._isShowTip = !this._isShowTip;
+  gsap.to(tipContainer, {
+    duration: 0.25,
+    ease: this._isShowTip ? "back.out" : "back.in",
+    pixi: {
+      scale: this._isShowTip ? 1 : 0,
+    },
+  });
+
+  //列表显示后开始监听是否点击容器外
+  if (this._isShowTip) {
+    removeEventListener = libPixiOutsideClick(tipContainer, tipIcon, () => {
+      this._isShowTip = false;
+      gsap.to(tipContainer, {
+        duration: 0.25,
+        ease: "back.in",
+        pixi: {
+          scale: 0,
+        },
+      });
+    });
+  }
+  //如果通过再次点击按钮关闭了列表，则移除监听器
+  else {
+    removeEventListener?.();
+  }
+});
 ```
 
 ### LibPixiPromiseTickerTimeout-TickerPromise 定时器

package/Utils/LibPixiDialogManager/index.d.ts

@@ -22,4 +22,6 @@ export declare class LibPixiDialogManager {
      * @param id 页面名称
      */
     close(id: string): Promise<void>;
+    /** @description 关闭并销毁所有弹窗 */
+    closeAll(): Promise<void>;
 }

package/Utils/LibPixiDialogManager/index.js

@@ -40,4 +40,13 @@ export class LibPixiDialogManager {
             }
         });
     }
+    /** @description 关闭并销毁所有弹窗 */
+    closeAll() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const ids = Object.keys(this.views);
+            for (const id of ids) {
+                yield this.close(id);
+            }
+        });
+    }
 }

package/package.json

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