lyb-pixi-js 1.12.15 → 1.12.17

package/Components/Custom/LibPixiScrollContainerY.d.ts

@@ -63,6 +63,8 @@ export declare class LibPixiScrollContainerY extends LibPixiContainer {
     /** 滚动触发 */
     private _onScroll?;
     constructor(params: LibPixiScrollContainerYParams);
+    /** @description 添加边距 */
+    addMargin(topMargin: number, bottomMargin: number): void;
     /** @description 设置滚动容器可视区宽高
      * @param width 宽度
      * @param height 高度

package/Components/Custom/LibPixiScrollContainerY.js

@@ -8,7 +8,7 @@ import { LibPixiRectangle } from "../Base/LibPixiRectangle";
  */
 export class LibPixiScrollContainerY extends LibPixiContainer {
     constructor(params) {
-        const { width, height, scrollbar = false, scrollContent, scrollbarRgiht = 0, scrollbarWidth = 10, scrollbarColor = "#ffffff", onScroll, bgColor, topMargin = 0, bottomMargin = 0, } = params;
+        const { width, height, scrollbar = false, scrollContent, scrollbarRgiht = 0, scrollbarWidth = 10, scrollbarColor = "#ffffff", onScroll, bgColor, } = params;
         super(width, height, bgColor);
         /** 开始位置 */
         this._startY = 0;
@@ -36,24 +36,6 @@ export class LibPixiScrollContainerY extends LibPixiContainer {
         this._content = new Container();
         this.addChild(this._content);
         this._content.addChild(this._scrollContent);
-        if (topMargin) {
-            //创建底部边距
-            const topMarginBox = new Sprite();
-            this._content.addChild(topMarginBox);
-            topMarginBox.height = topMargin;
-            requestAnimationFrame(() => {
-                this._scrollContent.y += topMargin;
-            });
-        }
-        if (bottomMargin) {
-            //创建底部边距
-            const bottomMarginBox = new Sprite();
-            this._content.addChild(bottomMarginBox);
-            bottomMarginBox.height = bottomMargin;
-            requestAnimationFrame(() => {
-                bottomMarginBox.y = topMargin + this._scrollContent.height;
-            });
-        }
         // 创建遮罩
         this._maskGraphics = new LibPixiRectangle(width, height, "#000");
         this.addChild(this._maskGraphics);
@@ -102,6 +84,21 @@ export class LibPixiScrollContainerY extends LibPixiContainer {
             this._onDragEnd();
         });
     }
+    /** @description 添加边距 */
+    addMargin(topMargin, bottomMargin) {
+        if (topMargin) {
+            const topMarginBox = new Sprite();
+            this._content.addChild(topMarginBox);
+            topMarginBox.height = topMargin;
+            this._scrollContent.y += topMargin;
+        }
+        if (bottomMargin) {
+            const bottomMarginBox = new Sprite();
+            this._content.addChild(bottomMarginBox);
+            bottomMarginBox.height = bottomMargin;
+            bottomMarginBox.y = topMargin + this._scrollContent.height;
+        }
+    }
     /** @description 设置滚动容器可视区宽高
      * @param width 宽度
      * @param height 高度

package/Utils/LibPixiDialogManager/ui/LibPixiDialog.d.ts

@@ -25,13 +25,13 @@ export declare class LibPixiDialog extends LibPixiBaseContainer {
     private _size;
     /** 竖版初始大小 */
     private _initialSize;
-    /** 窗口变化 */
-    private _resize?;
     /** 停止监听窗口 */
     private _offResize?;
     constructor(params?: Params);
     /** @description 设置弹窗内容 */
     setDialogContent(content: Container): void;
+    /** @description 重绘弹窗 */
+    redraw(w?: number, h?: number): void;
     /** @description 关闭 */
     close(): Promise<void>;
 }

package/Utils/LibPixiDialogManager/ui/LibPixiDialog.js

@@ -10,7 +10,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { Container } from "pixi.js";
 import gsap from "gsap";
 import { LibJsResizeWatcher } from "lyb-js/Base/LibJsResizeWatcher.js";
-import { LibPixiRectBgColor } from "../../../Components/Base/LibPixiRectBgColor";
+import { LibPixiRectangle } from "../../../Components/Base/LibPixiRectangle";
 import { libPixiEvent } from "../../LibPixiEvent";
 import { LibPixiBaseContainer } from "./LibPixiBaseContainer";
 /** @description 弹窗组件 */
@@ -22,11 +22,7 @@ export class LibPixiDialog extends LibPixiBaseContainer {
         const { size = 1, onClickMask, needBg = true } = params || {};
         this._initialSize = size;
         //蒙版
-        this._maskUI = new LibPixiRectBgColor({
-            width: 2700,
-            height: 1080,
-            bgColor: "#000",
-        });
+        this._maskUI = new LibPixiRectangle(2700, 1080, "#000");
         this.addChild(this._maskUI);
         this._maskUI.alpha = 0;
         this._maskUI.eventMode = "static";
@@ -44,14 +40,13 @@ export class LibPixiDialog extends LibPixiBaseContainer {
         this._dialogContainer = new Container();
         this.addChild(this._dialogContainer);
         this._dialogContainer.eventMode = "static";
+        const resize = new LibJsResizeWatcher(LibPixiDialog.adaptation);
+        this._offResize = resize.on(this.redraw.bind(this));
     }
     /** @description 设置弹窗内容 */
     setDialogContent(content) {
-        var _a, _b;
         this._dialogContainer.addChild(content);
-        const w = this._dialogContainer.width / 2;
-        const h = this._dialogContainer.height / 2;
-        this._dialogContainer.pivot.set(w, h);
+        this.redraw();
         this._dialogContainer.scale.set(0);
         this._dialogContainer.alpha = 0;
         gsap.to(this._maskUI, {
@@ -62,36 +57,39 @@ export class LibPixiDialog extends LibPixiBaseContainer {
             duration: LibPixiDialog.durationIn,
             alpha: 1,
         });
-        //部分场景需要重复调用此方法来重新更新布局重新监听尺寸变化，所以需要判断一下
-        (_a = this._resize) !== null && _a !== void 0 ? _a : (this._resize = new LibJsResizeWatcher(LibPixiDialog.adaptation));
-        (_b = this._offResize) === null || _b === void 0 ? void 0 : _b.call(this);
-        this._offResize = this._resize.on((w, h) => {
-            const halfW = 1920 / 2;
-            const halfH = 1080 / 2;
-            if (w > h) {
-                this._maskUI.renderBg(2700, 1080);
-                this._maskUI.x = -(2700 - 1920) / 2;
-                this._dialogContainer.position.set(halfW, halfH);
-                this._size = 1;
-                if (this._dialogContainer.scale.x === this._initialSize) {
-                    this._dialogContainer.scale.set(1);
-                }
+    }
+    /** @description 重绘弹窗 */
+    redraw(w = window.innerWidth, h = window.innerHeight) {
+        const dialogW = this._dialogContainer.width / 2;
+        const dialogH = this._dialogContainer.height / 2;
+        this._dialogContainer.pivot.set(dialogW, dialogH);
+        const halfW = 1920 / 2;
+        const halfH = 1080 / 2;
+        if (w > h) {
+            this._maskUI.width = 2700;
+            this._maskUI.height = 1080;
+            this._maskUI.x = -(2700 - 1920) / 2;
+            this._dialogContainer.position.set(halfW, halfH);
+            this._size = 1;
+            if (this._dialogContainer.scale.x === this._initialSize) {
+                this._dialogContainer.scale.set(1);
             }
-            else {
-                this._maskUI.renderBg(1080, 2700);
-                this._maskUI.x = 0;
-                this._dialogContainer.position.set(halfH, halfW);
-                this._size = this._initialSize;
-                if (this._dialogContainer.scale.x === 1) {
-                    this._dialogContainer.scale.set(this._initialSize);
-                }
+        }
+        else {
+            this._maskUI.width = 1080;
+            this._maskUI.height = 2700;
+            this._maskUI.x = 0;
+            this._dialogContainer.position.set(halfH, halfW);
+            this._size = this._initialSize;
+            if (this._dialogContainer.scale.x === 1) {
+                this._dialogContainer.scale.set(this._initialSize);
             }
-            gsap.to(this._dialogContainer.scale, {
-                duration: LibPixiDialog.durationIn,
-                ease: "back.out",
-                x: this._size,
-                y: this._size,
-            });
+        }
+        gsap.to(this._dialogContainer.scale, {
+            duration: LibPixiDialog.durationIn,
+            ease: "back.out",
+            x: this._size,
+            y: this._size,
         });
     }
     /** @description 关闭 */

package/lyb-pixi.js

@@ -49359,9 +49359,7 @@ void main(void)\r
         scrollbarWidth = 10,
         scrollbarColor = "#ffffff",
         onScroll,
-        bgColor,
-        topMargin = 0,
-        bottomMargin = 0
+        bgColor
       } = params;
       super(width, height, bgColor);
       this._startY = 0;
@@ -49381,22 +49379,6 @@ void main(void)\r
       this._content = new Container();
       this.addChild(this._content);
       this._content.addChild(this._scrollContent);
-      if (topMargin) {
-        const topMarginBox = new Sprite();
-        this._content.addChild(topMarginBox);
-        topMarginBox.height = topMargin;
-        requestAnimationFrame(() => {
-          this._scrollContent.y += topMargin;
-        });
-      }
-      if (bottomMargin) {
-        const bottomMarginBox = new Sprite();
-        this._content.addChild(bottomMarginBox);
-        bottomMarginBox.height = bottomMargin;
-        requestAnimationFrame(() => {
-          bottomMarginBox.y = topMargin + this._scrollContent.height;
-        });
-      }
       this._maskGraphics = new LibPixiRectangle(width, height, "#000");
       this.addChild(this._maskGraphics);
       this.mask = this._maskGraphics;
@@ -49449,6 +49431,21 @@ void main(void)\r
         this._onDragEnd();
       });
     }
+    /** @description 添加边距 */
+    addMargin(topMargin, bottomMargin) {
+      if (topMargin) {
+        const topMarginBox = new Sprite();
+        this._content.addChild(topMarginBox);
+        topMarginBox.height = topMargin;
+        this._scrollContent.y += topMargin;
+      }
+      if (bottomMargin) {
+        const bottomMarginBox = new Sprite();
+        this._content.addChild(bottomMarginBox);
+        bottomMarginBox.height = bottomMargin;
+        bottomMarginBox.y = topMargin + this._scrollContent.height;
+      }
+    }
     /** @description 设置滚动容器可视区宽高
      * @param width 宽度
      * @param height 高度

package/package.json

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