lyb-pixi-js 1.10.7 → 1.10.8

package/Components/Custom/LibPixiPuzzleBg.d.ts

@@ -0,0 +1,7 @@
+import { Container } from "pixi.js";
+/** @description 设计图背景拼接
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiPuzzleBg-设计图背景拼接
+ */
+export declare class LibPixiPuzzleBg extends Container {
+    constructor();
+}

package/Components/Custom/LibPixiPuzzleBg.js

@@ -0,0 +1,45 @@
+import { libJsDecimal } from "lyb-js/Math/LibJsDecimal.js";
+import { Assets, Container, Sprite } from "pixi.js";
+/** @description 设计图背景拼接
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiPuzzleBg-设计图背景拼接
+ */
+export class LibPixiPuzzleBg extends Container {
+    constructor() {
+        super();
+        this.eventMode = "none";
+        // 背景
+        const bg = new Sprite(Assets.get("preload/bg"));
+        this.addChild(bg);
+        bg.visible = false;
+        //读取配置
+        const config = JSON.parse(localStorage.getItem("puzzle_bg_config") || "{}");
+        const { alpha, x, y } = config;
+        bg.alpha = alpha || 0.25;
+        bg.position.set(x || 0, y || 0);
+        //监听鼠标空格事件
+        document.addEventListener("keydown", (e) => {
+            if (e.code === "Space") {
+                bg.visible = !bg.visible;
+            }
+            else if (e.code === "ArrowUp") {
+                bg.y -= 2;
+            }
+            else if (e.code === "ArrowDown") {
+                bg.y += 2;
+            }
+            else if (e.code === "ArrowLeft") {
+                bg.x -= 2;
+            }
+            else if (e.code === "ArrowRight") {
+                bg.x += 2;
+            }
+            if (e.code === "NumpadAdd" && bg.alpha < 1) {
+                bg.alpha = libJsDecimal(bg.alpha, 0.1, "+");
+            }
+            else if (e.code === "NumpadSubtract" && bg.alpha > 0) {
+                bg.alpha = libJsDecimal(bg.alpha, 0.1, "-");
+            }
+            localStorage.setItem("puzzle_bg_config", JSON.stringify({ alpha: bg.alpha, x: bg.x, y: bg.y }));
+        });
+    }
+}

package/Components/Custom/LibPixiScrollContainerX.d.ts

@@ -13,7 +13,7 @@ export interface LibPixiScrollContainerXParams {
     rightMargin?: number;
 }
 /** @description 支持鼠标滚轮滚动、鼠标拖动、手指滑动，支持惯性滚动及回弹
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerX-X 轴滚动容器
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerX-X轴滚动容器
  */
 export declare class LibPixiScrollContainerX extends LibPixiContainer {
     /** 开始位置 */

package/Components/Custom/LibPixiScrollContainerX.js

@@ -2,7 +2,7 @@ import { Container, Graphics, Sprite, } from "pixi.js";
 import { gsap } from "gsap";
 import { LibPixiContainer } from "../Base/LibPixiContainer";
 /** @description 支持鼠标滚轮滚动、鼠标拖动、手指滑动，支持惯性滚动及回弹
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerX-X 轴滚动容器
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerX-X轴滚动容器
  */
 export class LibPixiScrollContainerX extends LibPixiContainer {
     constructor(params) {

package/Components/Custom/LibPixiScrollContainerY.d.ts

@@ -23,7 +23,7 @@ export interface LibPixiScrollContainerYParams {
     onScroll?: (y: number) => void;
 }
 /** @description 支持鼠标滚轮滚动、鼠标拖动、手指滑动，支持惯性滚动及回弹
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerY-Y 轴滚动容器
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerY-Y轴滚动容器
  */
 export declare class LibPixiScrollContainerY extends LibPixiContainer {
     /** 开始位置 */

package/Components/Custom/LibPixiScrollContainerY.js

@@ -4,7 +4,7 @@ import { libPixiEvent } from "../../Utils/LibPixiEvent";
 import { LibPixiContainer } from "../Base/LibPixiContainer";
 import { LibPixiRectangle } from "../Base/LibPixiRectangle";
 /** @description 支持鼠标滚轮滚动、鼠标拖动、手指滑动，支持惯性滚动及回弹
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerY-Y 轴滚动容器
+ * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiScrollContainerY-Y轴滚动容器
  */
 export class LibPixiScrollContainerY extends LibPixiContainer {
     constructor(params) {

package/libPixiJs.d.ts

@@ -25,6 +25,7 @@ import { LibPixiPolygon } from "./Components/Base/LibPixiPolygon";
 import { LibPixiCircular } from "./Components/Base/LibPixiCircular";
 import { LibPixiSlide } from "./Components/Custom/LibPixiSlide";
 import { LibPixiLabelValue } from "./Components/Custom/LibPixiLabelValue";
+import { LibPixiPuzzleBg } from "./Components/Custom/LibPixiPuzzleBg";
 /** @description 组件 */
 export declare const Components: {
     Base: {
@@ -122,6 +123,10 @@ export declare const Components: {
          * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiLabelValue-标签值
          */
         LibPixiLabelValue: typeof LibPixiLabelValue;
+        /** @description 设计图背景拼接
+         * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiPuzzleBg-设计图背景拼接
+         */
+        LibPixiPuzzleBg: typeof LibPixiPuzzleBg;
     };
 };
 /** @description 方法 */

package/libPixiJs.js

@@ -40,6 +40,7 @@ import { LibPixiArrangeLinear } from "./Utils/LibPixiArrangeLinear";
 import { LibPixiSlide } from "./Components/Custom/LibPixiSlide";
 import { LibPixiEmitContainerEvent } from "./Utils/LibPixiEmitContainerEvent";
 import { LibPixiLabelValue } from "./Components/Custom/LibPixiLabelValue";
+import { LibPixiPuzzleBg } from "./Components/Custom/LibPixiPuzzleBg";
 /** @description 组件 */
 export const Components = {
     Base: {
@@ -137,6 +138,10 @@ export const Components = {
          * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiLabelValue-标签值
          */
         LibPixiLabelValue,
+        /** @description 设计图背景拼接
+         * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiPuzzleBg-设计图背景拼接
+         */
+        LibPixiPuzzleBg,
     },
 };
 /** @description 方法 */