lyb-pixi-js 1.12.48 → 1.12.50
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Components/Custom/LibPixiMaskBg.d.ts +11 -0
- package/Components/Custom/LibPixiMaskBg.js +21 -0
- package/Components/Custom/LibPixiScrollContainerY.d.ts +1 -1
- package/Components/Custom/LibPixiScrollContainerY.js +7 -2
- package/Utils/LibPixiDialogManager/ui/LibPixiDialog.d.ts +2 -0
- package/Utils/LibPixiDialogManager/ui/LibPixiDialog.js +5 -10
- package/package.json +1 -1
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Container, Graphics } from "pixi.js";
|
|
2
|
+
/** @description 全屏黑色蒙版 */
|
|
3
|
+
export declare class LibPixiMaskBg extends Graphics {
|
|
4
|
+
/** 舞台 */
|
|
5
|
+
static stage: Container;
|
|
6
|
+
/** 蒙版透明度 */
|
|
7
|
+
static bgAlpha: number;
|
|
8
|
+
constructor();
|
|
9
|
+
/** @description 更新蒙版 */
|
|
10
|
+
updateSize(): void;
|
|
11
|
+
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { Graphics } from "pixi.js";
|
|
2
|
+
/** @description 全屏黑色蒙版 */
|
|
3
|
+
export class LibPixiMaskBg extends Graphics {
|
|
4
|
+
constructor() {
|
|
5
|
+
super();
|
|
6
|
+
}
|
|
7
|
+
/** @description 更新蒙版 */
|
|
8
|
+
updateSize() {
|
|
9
|
+
const topLeft = LibPixiMaskBg.stage.toLocal({ x: 0, y: 0 });
|
|
10
|
+
const bottomRight = LibPixiMaskBg.stage.toLocal({
|
|
11
|
+
x: window.innerWidth,
|
|
12
|
+
y: window.innerHeight,
|
|
13
|
+
});
|
|
14
|
+
this.clear();
|
|
15
|
+
this.beginFill(0x000000, LibPixiMaskBg.bgAlpha);
|
|
16
|
+
this.drawRect(topLeft.x, topLeft.y, bottomRight.x - topLeft.x, bottomRight.y - topLeft.y);
|
|
17
|
+
this.endFill();
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
/** 蒙版透明度 */
|
|
21
|
+
LibPixiMaskBg.bgAlpha = 0.5;
|
|
@@ -77,7 +77,7 @@ export declare class LibPixiScrollContainerY extends LibPixiContainer {
|
|
|
77
77
|
*/
|
|
78
78
|
setDimensions(width: number, height: number): void;
|
|
79
79
|
/** @description 返回顶部 */
|
|
80
|
-
scrollToTop(): void;
|
|
80
|
+
scrollToTop(animate?: boolean): void;
|
|
81
81
|
/** @description 往滚动内容添加元素 */
|
|
82
82
|
addContent(container: Container): void;
|
|
83
83
|
/** @description 更新右边距坐标 */
|
|
@@ -120,9 +120,14 @@ export class LibPixiScrollContainerY extends LibPixiContainer {
|
|
|
120
120
|
this._updateBottomMargin();
|
|
121
121
|
}
|
|
122
122
|
/** @description 返回顶部 */
|
|
123
|
-
scrollToTop() {
|
|
123
|
+
scrollToTop(animate = false) {
|
|
124
124
|
gsap.killTweensOf(this._content);
|
|
125
|
-
|
|
125
|
+
if (animate) {
|
|
126
|
+
gsap.to(this._content, { y: 0, duration: 0.25 });
|
|
127
|
+
}
|
|
128
|
+
else {
|
|
129
|
+
this._content.y = 0;
|
|
130
|
+
}
|
|
126
131
|
}
|
|
127
132
|
/** @description 往滚动内容添加元素 */
|
|
128
133
|
addContent(container) {
|
|
@@ -10,19 +10,21 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import { Container } from "pixi.js";
|
|
11
11
|
import gsap from "gsap";
|
|
12
12
|
import { LibJsResizeWatcher } from "lyb-js/Base/LibJsResizeWatcher.js";
|
|
13
|
-
import { LibPixiRectangle } from "../../../Components/Base/LibPixiRectangle";
|
|
14
13
|
import { libPixiEvent } from "../../LibPixiEvent";
|
|
15
14
|
import { LibPixiBaseContainer } from "./LibPixiBaseContainer";
|
|
15
|
+
import { LibPixiMaskBg } from "../../../Components/Custom/LibPixiMaskBg";
|
|
16
16
|
/** @description 弹窗组件 */
|
|
17
17
|
export class LibPixiDialog extends LibPixiBaseContainer {
|
|
18
18
|
constructor(params) {
|
|
19
19
|
super();
|
|
20
20
|
/** 竖版缩放大小 */
|
|
21
21
|
this._vScale = 1;
|
|
22
|
+
LibPixiMaskBg.stage = LibPixiDialog.stage;
|
|
23
|
+
LibPixiMaskBg.bgAlpha = LibPixiDialog.bgAlpha;
|
|
22
24
|
const { onClickMask, vScale = 1, needBg = true } = params || {};
|
|
23
25
|
this._vScale = vScale;
|
|
24
26
|
//蒙版
|
|
25
|
-
this._maskUI = new
|
|
27
|
+
this._maskUI = new LibPixiMaskBg();
|
|
26
28
|
this.addChild(this._maskUI);
|
|
27
29
|
this._maskUI.alpha = 0;
|
|
28
30
|
this._maskUI.eventMode = "static";
|
|
@@ -108,22 +110,15 @@ export class LibPixiDialog extends LibPixiBaseContainer {
|
|
|
108
110
|
}
|
|
109
111
|
/** @description 重绘弹窗 */
|
|
110
112
|
_redraw(w, h) {
|
|
113
|
+
this._maskUI.updateSize();
|
|
111
114
|
if (this._lastIsH === w > h)
|
|
112
115
|
return;
|
|
113
116
|
this._lastIsH = w > h;
|
|
114
117
|
let scale = 0;
|
|
115
118
|
if (w > h) {
|
|
116
|
-
this._maskUI.width = 2700;
|
|
117
|
-
this._maskUI.height = 1080;
|
|
118
|
-
this._maskUI.x = -(2700 - 1920) / 2;
|
|
119
|
-
this._maskUI.y = 0;
|
|
120
119
|
scale = 1;
|
|
121
120
|
}
|
|
122
121
|
else {
|
|
123
|
-
this._maskUI.width = 1080;
|
|
124
|
-
this._maskUI.height = 2700;
|
|
125
|
-
this._maskUI.x = 0;
|
|
126
|
-
this._maskUI.y = -(2700 - 1920) / 2;
|
|
127
122
|
scale = this._vScale;
|
|
128
123
|
}
|
|
129
124
|
this.updatePosition(w, h);
|