lyb-pixi-js 1.10.0 → 1.10.2
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/README.md +3 -3
- package/Utils/LibPixiDialogManager/ui/LibPixiDialog.d.ts +9 -5
- package/Utils/LibPixiDialogManager/ui/LibPixiDialog.js +46 -43
- package/Utils/LibPixiEmitContainerEvent.d.ts +7 -0
- package/Utils/LibPixiEmitContainerEvent.js +13 -0
- package/libPixiJs.d.ts +1 -1
- package/libPixiJs.js +2 -2
- package/lyb-pixi.js +15 -7
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -166,7 +166,7 @@ app.stage.addChild(box);
|
|
|
166
166
|
|
|
167
167
|
\- [LibPixiArrangeLinear-间隔布局](#LibPixiArrangeLinear-间隔布局)
|
|
168
168
|
|
|
169
|
-
\- [
|
|
169
|
+
\- [LibPixiEmitContainerEvent-触发后代监听](#LibPixiEmitContainerEvent-触发后代监听)
|
|
170
170
|
|
|
171
171
|
## Base-基础
|
|
172
172
|
|
|
@@ -1200,11 +1200,11 @@ LibPixiGridLayout(cardList, 20, 3); //间隔20,一行三个
|
|
|
1200
1200
|
LibPixiArrangeLinear(cardList, 20, "y"); //间隔20,y轴排列
|
|
1201
1201
|
```
|
|
1202
1202
|
|
|
1203
|
-
###
|
|
1203
|
+
### LibPixiEmitContainerEvent-触发后代监听
|
|
1204
1204
|
|
|
1205
1205
|
> 递归调用后代的事件发射器
|
|
1206
1206
|
|
|
1207
1207
|
```ts
|
|
1208
|
-
|
|
1208
|
+
LibPixiEmitContainerEvent(this, "EVENT_NAME", {})
|
|
1209
1209
|
```
|
|
1210
1210
|
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { Container } from "pixi.js";
|
|
2
2
|
import { LibPixiBaseContainer } from "./LibPixiBaseContainer";
|
|
3
3
|
interface Params {
|
|
4
|
+
/** 黑色背景透明度 */
|
|
5
|
+
bgAlpha?: number;
|
|
4
6
|
/** 是否需要显示黑色背景 */
|
|
5
7
|
needBg?: boolean;
|
|
6
8
|
/** 竖版初始大小 */
|
|
@@ -11,15 +13,17 @@ interface Params {
|
|
|
11
13
|
/** @description 弹窗组件 */
|
|
12
14
|
export declare class LibPixiDialog extends LibPixiBaseContainer {
|
|
13
15
|
/** 蒙版UI */
|
|
14
|
-
private
|
|
16
|
+
private _maskUI;
|
|
15
17
|
/** 内容容器 */
|
|
16
|
-
private
|
|
18
|
+
private _dialogContainer;
|
|
17
19
|
/** 当前大小 */
|
|
18
|
-
private
|
|
20
|
+
private _size;
|
|
19
21
|
/** 竖版初始大小 */
|
|
20
|
-
private
|
|
22
|
+
private _initialSize;
|
|
23
|
+
/** 黑色背景透明度 */
|
|
24
|
+
private _bgAlpha;
|
|
21
25
|
/** 是否处于关闭动画状态 */
|
|
22
|
-
private
|
|
26
|
+
private _isCloseAnimating;
|
|
23
27
|
constructor(params?: Params);
|
|
24
28
|
/** @description 设置弹窗内容 */
|
|
25
29
|
setDialogContent(content: Container): void;
|
|
@@ -17,46 +17,49 @@ export class LibPixiDialog extends LibPixiBaseContainer {
|
|
|
17
17
|
constructor(params) {
|
|
18
18
|
super();
|
|
19
19
|
/** 当前大小 */
|
|
20
|
-
this.
|
|
20
|
+
this._size = 1;
|
|
21
|
+
/** 黑色背景透明度 */
|
|
22
|
+
this._bgAlpha = 0.5;
|
|
21
23
|
/** 是否处于关闭动画状态 */
|
|
22
|
-
this.
|
|
23
|
-
const { size = 1, onClickMask, needBg = true } = params || {};
|
|
24
|
-
this.
|
|
24
|
+
this._isCloseAnimating = false;
|
|
25
|
+
const { bgAlpha = 0.5, size = 1, onClickMask, needBg = true, } = params || {};
|
|
26
|
+
this._initialSize = size;
|
|
27
|
+
this._bgAlpha = bgAlpha;
|
|
25
28
|
//蒙版
|
|
26
|
-
this.
|
|
29
|
+
this._maskUI = new LibPixiRectBgColor({
|
|
27
30
|
width: 2700,
|
|
28
31
|
height: 1080,
|
|
29
32
|
bgColor: "#000",
|
|
30
33
|
});
|
|
31
|
-
this.addChild(this.
|
|
32
|
-
this.
|
|
33
|
-
this.
|
|
34
|
-
this.
|
|
34
|
+
this.addChild(this._maskUI);
|
|
35
|
+
this._maskUI.alpha = 0;
|
|
36
|
+
this._maskUI.eventMode = "static";
|
|
37
|
+
this._maskUI.visible = needBg;
|
|
35
38
|
if (onClickMask) {
|
|
36
|
-
libPixiEvent(this.
|
|
37
|
-
if (this.
|
|
39
|
+
libPixiEvent(this._maskUI, "pointertap", () => {
|
|
40
|
+
if (this._isCloseAnimating)
|
|
38
41
|
return;
|
|
39
42
|
onClickMask === null || onClickMask === void 0 ? void 0 : onClickMask();
|
|
40
43
|
});
|
|
41
44
|
}
|
|
42
45
|
//弹窗内容容器
|
|
43
|
-
this.
|
|
44
|
-
this.addChild(this.
|
|
45
|
-
this.
|
|
46
|
+
this._dialogContainer = new Container();
|
|
47
|
+
this.addChild(this._dialogContainer);
|
|
48
|
+
this._dialogContainer.eventMode = "static";
|
|
46
49
|
}
|
|
47
50
|
/** @description 设置弹窗内容 */
|
|
48
51
|
setDialogContent(content) {
|
|
49
|
-
this.
|
|
50
|
-
const w = this.
|
|
51
|
-
const h = this.
|
|
52
|
-
this.
|
|
53
|
-
this.
|
|
54
|
-
this.
|
|
55
|
-
gsap.to(this.
|
|
52
|
+
this._dialogContainer.addChild(content);
|
|
53
|
+
const w = this._dialogContainer.width / 2;
|
|
54
|
+
const h = this._dialogContainer.height / 2;
|
|
55
|
+
this._dialogContainer.pivot.set(w, h);
|
|
56
|
+
this._dialogContainer.scale.set(0);
|
|
57
|
+
this._dialogContainer.alpha = 0;
|
|
58
|
+
gsap.to(this._maskUI, {
|
|
56
59
|
duration: 0.5,
|
|
57
|
-
alpha:
|
|
60
|
+
alpha: this._bgAlpha,
|
|
58
61
|
});
|
|
59
|
-
gsap.to(this.
|
|
62
|
+
gsap.to(this._dialogContainer, {
|
|
60
63
|
duration: 0.5,
|
|
61
64
|
alpha: 1,
|
|
62
65
|
});
|
|
@@ -64,49 +67,49 @@ export class LibPixiDialog extends LibPixiBaseContainer {
|
|
|
64
67
|
const halfW = 1920 / 2;
|
|
65
68
|
const halfH = 1080 / 2;
|
|
66
69
|
if (w > h) {
|
|
67
|
-
this.
|
|
68
|
-
this.
|
|
69
|
-
this.
|
|
70
|
-
this.
|
|
71
|
-
if (this.
|
|
72
|
-
this.
|
|
70
|
+
this._maskUI.renderBg(2700, 1080);
|
|
71
|
+
this._maskUI.x = -(2700 - 1920) / 2;
|
|
72
|
+
this._dialogContainer.position.set(halfW, halfH);
|
|
73
|
+
this._size = 1;
|
|
74
|
+
if (this._dialogContainer.scale.x === this._initialSize) {
|
|
75
|
+
this._dialogContainer.scale.set(1);
|
|
73
76
|
}
|
|
74
77
|
}
|
|
75
78
|
else {
|
|
76
|
-
this.
|
|
77
|
-
this.
|
|
78
|
-
this.
|
|
79
|
-
this.
|
|
80
|
-
if (this.
|
|
81
|
-
this.
|
|
79
|
+
this._maskUI.renderBg(1080, 2700);
|
|
80
|
+
this._maskUI.x = 0;
|
|
81
|
+
this._dialogContainer.position.set(halfH, halfW);
|
|
82
|
+
this._size = this._initialSize;
|
|
83
|
+
if (this._dialogContainer.scale.x === 1) {
|
|
84
|
+
this._dialogContainer.scale.set(this._initialSize);
|
|
82
85
|
}
|
|
83
86
|
}
|
|
84
|
-
gsap.to(this.
|
|
87
|
+
gsap.to(this._dialogContainer.scale, {
|
|
85
88
|
duration: 0.5,
|
|
86
89
|
ease: "back.out",
|
|
87
|
-
x: this.
|
|
88
|
-
y: this.
|
|
90
|
+
x: this._size,
|
|
91
|
+
y: this._size,
|
|
89
92
|
});
|
|
90
93
|
});
|
|
91
94
|
}
|
|
92
95
|
/** @description 关闭 */
|
|
93
96
|
close() {
|
|
94
97
|
return __awaiter(this, void 0, void 0, function* () {
|
|
95
|
-
if (this.
|
|
98
|
+
if (this._isCloseAnimating)
|
|
96
99
|
return;
|
|
97
|
-
this.
|
|
98
|
-
gsap.to(this.
|
|
100
|
+
this._isCloseAnimating = true;
|
|
101
|
+
gsap.to(this._dialogContainer.scale, {
|
|
99
102
|
duration: 0.5,
|
|
100
103
|
ease: "back.in",
|
|
101
104
|
x: 0,
|
|
102
105
|
y: 0,
|
|
103
106
|
});
|
|
104
|
-
gsap.to(this.
|
|
107
|
+
gsap.to(this._dialogContainer, {
|
|
105
108
|
duration: 0.5,
|
|
106
109
|
delay: 0.25,
|
|
107
110
|
alpha: 0,
|
|
108
111
|
});
|
|
109
|
-
yield gsap.to(this.
|
|
112
|
+
yield gsap.to(this._maskUI, {
|
|
110
113
|
duration: 0.5,
|
|
111
114
|
delay: 0.25,
|
|
112
115
|
alpha: 0,
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/** @description 触发后代监听
|
|
2
|
+
* @param container 容器
|
|
3
|
+
* @param event 事件名称
|
|
4
|
+
* @param payload 事件携带数据
|
|
5
|
+
*/
|
|
6
|
+
export const LibPixiEmitContainerEvent = (container, event, payload) => {
|
|
7
|
+
container.children.forEach((child) => {
|
|
8
|
+
child.emit(event, payload);
|
|
9
|
+
if ("children" in child) {
|
|
10
|
+
LibPixiEmitContainerEvent(child, event, payload);
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
};
|
package/libPixiJs.d.ts
CHANGED
|
@@ -230,5 +230,5 @@ export declare const Utils: {
|
|
|
230
230
|
* @param event 事件名称
|
|
231
231
|
* @param payload 事件携带数据
|
|
232
232
|
*/
|
|
233
|
-
|
|
233
|
+
LibPixiEmitContainerEvent: (container: import("pixi.js").Container, event: string, payload?: any) => void;
|
|
234
234
|
};
|
package/libPixiJs.js
CHANGED
|
@@ -38,7 +38,7 @@ import { LibPixiDownScaleAnimation } from "./Utils/LibPixiDownScaleAnimation";
|
|
|
38
38
|
import { LibPixiGridLayout } from "./Utils/LibPixiGridLayout";
|
|
39
39
|
import { LibPixiArrangeLinear } from "./Utils/LibPixiArrangeLinear";
|
|
40
40
|
import { LibPixiSlide } from "./Components/Custom/LibPixiSlide";
|
|
41
|
-
import {
|
|
41
|
+
import { LibPixiEmitContainerEvent } from "./Utils/LibPixiEmitContainerEvent";
|
|
42
42
|
/** @description 组件 */
|
|
43
43
|
export const Components = {
|
|
44
44
|
Base: {
|
|
@@ -245,5 +245,5 @@ export const Utils = {
|
|
|
245
245
|
* @param event 事件名称
|
|
246
246
|
* @param payload 事件携带数据
|
|
247
247
|
*/
|
|
248
|
-
|
|
248
|
+
LibPixiEmitContainerEvent,
|
|
249
249
|
};
|
package/lyb-pixi.js
CHANGED
|
@@ -1904,7 +1904,15 @@
|
|
|
1904
1904
|
};
|
|
1905
1905
|
var implementation = implementation$1;
|
|
1906
1906
|
var functionBind = Function.prototype.bind || implementation;
|
|
1907
|
-
var functionCall
|
|
1907
|
+
var functionCall;
|
|
1908
|
+
var hasRequiredFunctionCall;
|
|
1909
|
+
function requireFunctionCall() {
|
|
1910
|
+
if (hasRequiredFunctionCall)
|
|
1911
|
+
return functionCall;
|
|
1912
|
+
hasRequiredFunctionCall = 1;
|
|
1913
|
+
functionCall = Function.prototype.call;
|
|
1914
|
+
return functionCall;
|
|
1915
|
+
}
|
|
1908
1916
|
var functionApply;
|
|
1909
1917
|
var hasRequiredFunctionApply;
|
|
1910
1918
|
function requireFunctionApply() {
|
|
@@ -1917,12 +1925,12 @@
|
|
|
1917
1925
|
var reflectApply = typeof Reflect !== "undefined" && Reflect && Reflect.apply;
|
|
1918
1926
|
var bind$2 = functionBind;
|
|
1919
1927
|
var $apply$1 = requireFunctionApply();
|
|
1920
|
-
var $call$2 =
|
|
1928
|
+
var $call$2 = requireFunctionCall();
|
|
1921
1929
|
var $reflectApply = reflectApply;
|
|
1922
1930
|
var actualApply = $reflectApply || bind$2.call($call$2, $apply$1);
|
|
1923
1931
|
var bind$1 = functionBind;
|
|
1924
1932
|
var $TypeError$4 = type;
|
|
1925
|
-
var $call$1 =
|
|
1933
|
+
var $call$1 = requireFunctionCall();
|
|
1926
1934
|
var $actualApply = actualApply;
|
|
1927
1935
|
var callBindApplyHelpers = function callBindBasic2(args) {
|
|
1928
1936
|
if (args.length < 1 || typeof args[0] !== "function") {
|
|
@@ -2040,7 +2048,7 @@
|
|
|
2040
2048
|
var $ObjectGPO = requireObject_getPrototypeOf();
|
|
2041
2049
|
var $ReflectGPO = requireReflect_getPrototypeOf();
|
|
2042
2050
|
var $apply = requireFunctionApply();
|
|
2043
|
-
var $call =
|
|
2051
|
+
var $call = requireFunctionCall();
|
|
2044
2052
|
var needsEval = {};
|
|
2045
2053
|
var TypedArray = typeof Uint8Array === "undefined" || !getProto ? undefined$1 : getProto(Uint8Array);
|
|
2046
2054
|
var INTRINSICS = {
|
|
@@ -55355,11 +55363,11 @@ void main(void){
|
|
|
55355
55363
|
}
|
|
55356
55364
|
}
|
|
55357
55365
|
}
|
|
55358
|
-
const
|
|
55366
|
+
const LibPixiEmitContainerEvent = (container, event, payload) => {
|
|
55359
55367
|
container.children.forEach((child) => {
|
|
55360
55368
|
child.emit(event, payload);
|
|
55361
55369
|
if ("children" in child) {
|
|
55362
|
-
|
|
55370
|
+
LibPixiEmitContainerEvent(child, event, payload);
|
|
55363
55371
|
}
|
|
55364
55372
|
});
|
|
55365
55373
|
};
|
|
@@ -55567,7 +55575,7 @@ void main(void){
|
|
|
55567
55575
|
* @param event 事件名称
|
|
55568
55576
|
* @param payload 事件携带数据
|
|
55569
55577
|
*/
|
|
55570
|
-
|
|
55578
|
+
LibPixiEmitContainerEvent
|
|
55571
55579
|
};
|
|
55572
55580
|
const LibPixiJs = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
55573
55581
|
__proto__: null,
|