lyb-pixi-js 1.0.4 → 1.0.6
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/dist/Base/LibPixiBitText/index.js +1 -26
- package/dist/Base/LibPixiContainer/index.js +1 -65
- package/dist/Base/LibPixiParticleMove/index.js +1 -127
- package/dist/Base/LibPixiRectBgColor/index.js +1 -54
- package/dist/Base/LibPixiSpine/index.d.ts +1 -1
- package/dist/Base/LibPixiSpine/index.js +1 -151
- package/dist/Base/LibPixiText/index.js +1 -50
- package/dist/index.js +1 -1
- package/dist/libPixiJs.js +1 -21
- package/package.json +5 -3
- package/umd/lyb-pixi.js +63 -63
|
@@ -1,26 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
/** @description 自定义位图文本 */
|
|
3
|
-
var LibPixiBitText = /** @class */ (function () {
|
|
4
|
-
/**
|
|
5
|
-
* @param fontName 字体名称
|
|
6
|
-
* @param defaultFontSize 默认字体大小
|
|
7
|
-
*/
|
|
8
|
-
function LibPixiBitText(fontName, defaultFontSize) {
|
|
9
|
-
this._fontName = fontName;
|
|
10
|
-
this._defaultFontSize = defaultFontSize;
|
|
11
|
-
}
|
|
12
|
-
/** @description 创建位图文本
|
|
13
|
-
* @param text 文本内容
|
|
14
|
-
* @param fontSize 字体大小,不填则使用默认大小
|
|
15
|
-
* @returns 位图实例
|
|
16
|
-
*/
|
|
17
|
-
LibPixiBitText.prototype.createText = function (text, fontSize) {
|
|
18
|
-
var bitMapText = new BitmapText(text.toString(), {
|
|
19
|
-
fontName: this._fontName,
|
|
20
|
-
fontSize: this._defaultFontSize || fontSize,
|
|
21
|
-
});
|
|
22
|
-
return bitMapText;
|
|
23
|
-
};
|
|
24
|
-
return LibPixiBitText;
|
|
25
|
-
}());
|
|
26
|
-
export { LibPixiBitText };
|
|
1
|
+
"use strict";import{BitmapText as i}from"pixi.js";export class LibPixiBitText{constructor(t,e){this._fontName=t,this._defaultFontSize=e}createText(t,e){return new i(t.toString(),{fontName:this._fontName,fontSize:this._defaultFontSize||e})}}
|
|
@@ -1,65 +1 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
if (typeof b !== "function" && b !== null)
|
|
10
|
-
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
-
extendStatics(d, b);
|
|
12
|
-
function __() { this.constructor = d; }
|
|
13
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
-
};
|
|
15
|
-
})();
|
|
16
|
-
import { Container, Graphics, Sprite } from "pixi.js";
|
|
17
|
-
import { LibPixiRectBgColor } from "../LibPixiRectBgColor";
|
|
18
|
-
/** @description 自定义容器大小及背景色 */
|
|
19
|
-
var LibPixiContainer = /** @class */ (function (_super) {
|
|
20
|
-
__extends(LibPixiContainer, _super);
|
|
21
|
-
/**
|
|
22
|
-
* @param width 容器宽度
|
|
23
|
-
* @param height 容器高度
|
|
24
|
-
* @param bgColor 背景色
|
|
25
|
-
*/
|
|
26
|
-
function LibPixiContainer(params) {
|
|
27
|
-
var _this = _super.call(this) || this;
|
|
28
|
-
var width = params.width, height = params.height, overHidden = params.overHidden, bgColor = params.bgColor;
|
|
29
|
-
if (overHidden) {
|
|
30
|
-
var mask = new Graphics();
|
|
31
|
-
mask.beginFill(0xffffff); // 创建一个白色矩形
|
|
32
|
-
mask.drawRect(0, 0, width, height);
|
|
33
|
-
mask.endFill();
|
|
34
|
-
_this.addChild(mask);
|
|
35
|
-
_this.mask = mask;
|
|
36
|
-
}
|
|
37
|
-
if (bgColor) {
|
|
38
|
-
_this._bgColorFill = new LibPixiRectBgColor({
|
|
39
|
-
width: width,
|
|
40
|
-
height: height,
|
|
41
|
-
bgColor: bgColor,
|
|
42
|
-
});
|
|
43
|
-
_this.addChild(_this._bgColorFill);
|
|
44
|
-
}
|
|
45
|
-
else {
|
|
46
|
-
_this._fill = new Sprite();
|
|
47
|
-
_this._fill.width = width;
|
|
48
|
-
_this._fill.height = height;
|
|
49
|
-
_this.addChild(_this._fill);
|
|
50
|
-
}
|
|
51
|
-
return _this;
|
|
52
|
-
}
|
|
53
|
-
/** @description 设置容器大小 */
|
|
54
|
-
LibPixiContainer.prototype.setSize = function (width, height) {
|
|
55
|
-
if (this._fill) {
|
|
56
|
-
this._fill.width = width;
|
|
57
|
-
this._fill.height = height;
|
|
58
|
-
}
|
|
59
|
-
if (this._bgColorFill) {
|
|
60
|
-
this._bgColorFill.renderBg(width, height);
|
|
61
|
-
}
|
|
62
|
-
};
|
|
63
|
-
return LibPixiContainer;
|
|
64
|
-
}(Container));
|
|
65
|
-
export { LibPixiContainer };
|
|
1
|
+
"use strict";import{Container as o,Graphics as r,Sprite as f}from"pixi.js";import{LibPixiRectBgColor as d}from"../LibPixiRectBgColor";export class LibPixiContainer extends o{constructor(t){super();const{width:i,height:s,overHidden:e,bgColor:h}=t;if(e){const l=new r;l.beginFill(16777215),l.drawRect(0,0,i,s),l.endFill(),this.addChild(l),this.mask=l}h?(this._bgColorFill=new d({width:i,height:s,bgColor:h}),this.addChild(this._bgColorFill)):(this._fill=new f,this._fill.width=i,this._fill.height=s,this.addChild(this._fill))}setSize(t,i){this._fill&&(this._fill.width=t,this._fill.height=i),this._bgColorFill&&this._bgColorFill.renderBg(t,i)}}
|
|
@@ -1,127 +1 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
if (typeof b !== "function" && b !== null)
|
|
10
|
-
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
-
extendStatics(d, b);
|
|
12
|
-
function __() { this.constructor = d; }
|
|
13
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
-
};
|
|
15
|
-
})();
|
|
16
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
17
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
18
|
-
if (ar || !(i in from)) {
|
|
19
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
20
|
-
ar[i] = from[i];
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
24
|
-
};
|
|
25
|
-
import { Container, ParticleContainer, Ticker } from "pixi.js";
|
|
26
|
-
import { Emitter } from "@pixi/particle-emitter";
|
|
27
|
-
import gsap from "gsap";
|
|
28
|
-
import { LibPixiText } from "../LibPixiText";
|
|
29
|
-
/** @description 利用贝塞尔曲线实现粒子移动 */
|
|
30
|
-
var LibPixiParticleMove = /** @class */ (function (_super) {
|
|
31
|
-
__extends(LibPixiParticleMove, _super);
|
|
32
|
-
function LibPixiParticleMove(params) {
|
|
33
|
-
var _this = _super.call(this) || this;
|
|
34
|
-
var start = params.start, control = params.control, end = params.end, json = params.json, duration = params.duration, _a = params.ease, ease = _a === void 0 ? "power1.out" : _a, _b = params.showControl, showControl = _b === void 0 ? false : _b, _c = params.loop, loop = _c === void 0 ? false : _c;
|
|
35
|
-
_this._particleContainer = new ParticleContainer();
|
|
36
|
-
_this.addChild(_this._particleContainer);
|
|
37
|
-
// 初始化粒子发射器
|
|
38
|
-
var flyParticle = new Emitter(_this._particleContainer, json);
|
|
39
|
-
// 创建贝塞尔曲线的路径
|
|
40
|
-
var path = _this._createBezierPoints(__spreadArray(__spreadArray([start], control, true), [end], false), 100, showControl);
|
|
41
|
-
// 用来控制路径动画的对象
|
|
42
|
-
var flyObj = { pathThrough: 0 };
|
|
43
|
-
gsap.to(flyObj, {
|
|
44
|
-
duration: duration,
|
|
45
|
-
pathThrough: path.length - 1,
|
|
46
|
-
repeat: loop ? -1 : 0,
|
|
47
|
-
ease: ease,
|
|
48
|
-
onStart: function () {
|
|
49
|
-
flyParticle.emit = true;
|
|
50
|
-
},
|
|
51
|
-
onUpdate: function () {
|
|
52
|
-
var i = Math.floor(flyObj.pathThrough);
|
|
53
|
-
var p = path[i];
|
|
54
|
-
flyParticle.updateOwnerPos(p.x, p.y);
|
|
55
|
-
},
|
|
56
|
-
onComplete: function () {
|
|
57
|
-
gsap.to(_this, {
|
|
58
|
-
alpha: 0,
|
|
59
|
-
duration: 0.5,
|
|
60
|
-
onComplete: function () {
|
|
61
|
-
flyParticle.emit = false;
|
|
62
|
-
ticker.destroy();
|
|
63
|
-
_this.removeFromParent();
|
|
64
|
-
},
|
|
65
|
-
});
|
|
66
|
-
},
|
|
67
|
-
});
|
|
68
|
-
var ticker = new Ticker();
|
|
69
|
-
ticker.add(function () {
|
|
70
|
-
flyParticle.update(1 / 75);
|
|
71
|
-
});
|
|
72
|
-
ticker.start();
|
|
73
|
-
return _this;
|
|
74
|
-
}
|
|
75
|
-
LibPixiParticleMove.prototype._createBezierPoints = function (anchorPoints, pointsAmount, showControl) {
|
|
76
|
-
var _this = this;
|
|
77
|
-
var points = [];
|
|
78
|
-
// 渲染控制点
|
|
79
|
-
if (showControl) {
|
|
80
|
-
anchorPoints.forEach(function (item, index) {
|
|
81
|
-
//创建一个小圆点
|
|
82
|
-
var text = new LibPixiText({
|
|
83
|
-
text: index + 1,
|
|
84
|
-
fontSize: 16,
|
|
85
|
-
});
|
|
86
|
-
text.position.set(item.x, item.y);
|
|
87
|
-
_this.addChild(text);
|
|
88
|
-
});
|
|
89
|
-
}
|
|
90
|
-
// 计算并存储贝塞尔曲线上的点
|
|
91
|
-
for (var i = 0; i < pointsAmount; i++) {
|
|
92
|
-
var point = this._multiPointBezier(anchorPoints, i / pointsAmount);
|
|
93
|
-
points.push(point);
|
|
94
|
-
}
|
|
95
|
-
return points;
|
|
96
|
-
};
|
|
97
|
-
LibPixiParticleMove.prototype._multiPointBezier = function (points, t) {
|
|
98
|
-
var len = points.length;
|
|
99
|
-
var x = 0, y = 0;
|
|
100
|
-
// 预计算组合数
|
|
101
|
-
var binomials = [];
|
|
102
|
-
for (var i = 0; i < len; i++) {
|
|
103
|
-
binomials[i] = this._binomial(len - 1, i);
|
|
104
|
-
}
|
|
105
|
-
// 计算贝塞尔曲线上的点
|
|
106
|
-
for (var i = 0; i < len; i++) {
|
|
107
|
-
var point = points[i];
|
|
108
|
-
var binom = binomials[i];
|
|
109
|
-
var factorT = Math.pow(t, i);
|
|
110
|
-
var factor1MinusT = Math.pow(1 - t, len - 1 - i);
|
|
111
|
-
x += point.x * factor1MinusT * factorT * binom;
|
|
112
|
-
y += point.y * factor1MinusT * factorT * binom;
|
|
113
|
-
}
|
|
114
|
-
return { x: x, y: y };
|
|
115
|
-
};
|
|
116
|
-
LibPixiParticleMove.prototype._binomial = function (n, k) {
|
|
117
|
-
if (k === 0 || k === n)
|
|
118
|
-
return 1;
|
|
119
|
-
var res = 1;
|
|
120
|
-
for (var i = 1; i <= k; i++) {
|
|
121
|
-
res = (res * (n - i + 1)) / i;
|
|
122
|
-
}
|
|
123
|
-
return res;
|
|
124
|
-
};
|
|
125
|
-
return LibPixiParticleMove;
|
|
126
|
-
}(Container));
|
|
127
|
-
export { LibPixiParticleMove };
|
|
1
|
+
"use strict";import{Container as x,ParticleContainer as C,Ticker as P}from"pixi.js";import{Emitter as w}from"@pixi/particle-emitter";import u from"gsap";import{LibPixiText as _}from"../LibPixiText";export class LibPixiParticleMove extends x{constructor(n){super();const{start:i,control:o,end:e,json:r,duration:s,ease:t="power1.out",showControl:c=!1,loop:h=!1}=n;this._particleContainer=new C,this.addChild(this._particleContainer);const a=new w(this._particleContainer,r),l=this._createBezierPoints([i,...o,e],100,c),f={pathThrough:0};u.to(f,{duration:s,pathThrough:l.length-1,repeat:h?-1:0,ease:t,onStart:()=>{a.emit=!0},onUpdate:()=>{const d=Math.floor(f.pathThrough),m=l[d];a.updateOwnerPos(m.x,m.y)},onComplete:()=>{u.to(this,{alpha:0,duration:.5,onComplete:()=>{a.emit=!1,p.destroy(),this.removeFromParent()}})}});const p=new P;p.add(()=>{a.update(1/75)}),p.start()}_createBezierPoints(n,i,o){const e=[];o&&n.forEach((r,s)=>{const t=new _({text:s+1,fontSize:16});t.position.set(r.x,r.y),this.addChild(t)});for(let r=0;r<i;r++){const s=this._multiPointBezier(n,r/i);e.push(s)}return e}_multiPointBezier(n,i){const o=n.length;let e=0,r=0;const s=[];for(let t=0;t<o;t++)s[t]=this._binomial(o-1,t);for(let t=0;t<o;t++){const c=n[t],h=s[t],a=Math.pow(i,t),l=Math.pow(1-i,o-1-t);e+=c.x*l*a*h,r+=c.y*l*a*h}return{x:e,y:r}}_binomial(n,i){if(i===0||i===n)return 1;let o=1;for(let e=1;e<=i;e++)o=o*(n-e+1)/e;return o}}
|
|
@@ -1,54 +1 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
if (typeof b !== "function" && b !== null)
|
|
10
|
-
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
-
extendStatics(d, b);
|
|
12
|
-
function __() { this.constructor = d; }
|
|
13
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
-
};
|
|
15
|
-
})();
|
|
16
|
-
import { Graphics } from "pixi.js";
|
|
17
|
-
import gsap from "gsap";
|
|
18
|
-
/** @description 自定义矩形背景色 */
|
|
19
|
-
var LibPixiRectBgColor = /** @class */ (function (_super) {
|
|
20
|
-
__extends(LibPixiRectBgColor, _super);
|
|
21
|
-
function LibPixiRectBgColor(options) {
|
|
22
|
-
var _this = _super.call(this) || this;
|
|
23
|
-
/** 启用着色 */
|
|
24
|
-
_this.enableTint = true;
|
|
25
|
-
/** 背景颜色 */
|
|
26
|
-
_this.bgColor = "#fff";
|
|
27
|
-
var _a = options.x, x = _a === void 0 ? 0 : _a, _b = options.y, y = _b === void 0 ? 0 : _b, _c = options.width, width = _c === void 0 ? 0 : _c, _d = options.height, height = _d === void 0 ? 0 : _d, _e = options.bgColor, bgColor = _e === void 0 ? "#fff" : _e, _f = options.enableTint, enableTint = _f === void 0 ? true : _f;
|
|
28
|
-
_this.x = x;
|
|
29
|
-
_this.y = y;
|
|
30
|
-
_this.enableTint = enableTint;
|
|
31
|
-
_this.bgColor = bgColor;
|
|
32
|
-
_this.renderBg(width, height);
|
|
33
|
-
return _this;
|
|
34
|
-
}
|
|
35
|
-
/** @description 重新绘制并添加颜色 */
|
|
36
|
-
LibPixiRectBgColor.prototype.updateColor = function (tint) {
|
|
37
|
-
gsap.to(this, { tint: tint, duration: 0.25 });
|
|
38
|
-
};
|
|
39
|
-
/** @description 更新宽度 */
|
|
40
|
-
LibPixiRectBgColor.prototype.renderBg = function (width, height) {
|
|
41
|
-
this.clear();
|
|
42
|
-
if (this.enableTint) {
|
|
43
|
-
this.beginFill("#fff");
|
|
44
|
-
this.tint = this.bgColor;
|
|
45
|
-
}
|
|
46
|
-
else {
|
|
47
|
-
this.beginFill(this.bgColor);
|
|
48
|
-
}
|
|
49
|
-
this.drawRect(0, 0, width, height);
|
|
50
|
-
this.endFill();
|
|
51
|
-
};
|
|
52
|
-
return LibPixiRectBgColor;
|
|
53
|
-
}(Graphics));
|
|
54
|
-
export { LibPixiRectBgColor };
|
|
1
|
+
"use strict";import{Graphics as l}from"pixi.js";import n from"gsap";export class LibPixiRectBgColor extends l{constructor(t){super(),this.enableTint=!0,this.bgColor="#fff";const{x:i=0,y:e=0,width:s=0,height:r=0,bgColor:o="#fff",enableTint:h=!0}=t;this.x=i,this.y=e,this.enableTint=h,this.bgColor=o,this.renderBg(s,r)}updateColor(t){n.to(this,{tint:t,duration:.25})}renderBg(t,i){this.clear(),this.enableTint?(this.beginFill("#fff"),this.tint=this.bgColor):this.beginFill(this.bgColor),this.drawRect(0,0,t,i),this.endFill()}}
|
|
@@ -32,7 +32,7 @@ export declare class LibPixiSpine extends Spine {
|
|
|
32
32
|
private _isStart;
|
|
33
33
|
/** spine更新函数 */
|
|
34
34
|
private _loopFn;
|
|
35
|
-
constructor(
|
|
35
|
+
constructor(spineNameOrTexture: string | any, params?: LibPixiSpineParams);
|
|
36
36
|
/** @description 设置动画
|
|
37
37
|
* @param animationName 动画名称
|
|
38
38
|
* @param loop 是否循环播放
|
|
@@ -1,151 +1 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
if (typeof b !== "function" && b !== null)
|
|
10
|
-
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
-
extendStatics(d, b);
|
|
12
|
-
function __() { this.constructor = d; }
|
|
13
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
-
};
|
|
15
|
-
})();
|
|
16
|
-
import { Ticker } from "pixi.js";
|
|
17
|
-
import { Spine } from "@pixi-spine/runtime-3.8";
|
|
18
|
-
import gsap from "gsap";
|
|
19
|
-
/** @description 自定义 Spine 动画 */
|
|
20
|
-
var LibPixiSpine = /** @class */ (function (_super) {
|
|
21
|
-
__extends(LibPixiSpine, _super);
|
|
22
|
-
function LibPixiSpine(texture, params) {
|
|
23
|
-
var _this = this;
|
|
24
|
-
var _a = params || {}, followPointList = _a.followPointList, _b = _a.visible, visible = _b === void 0 ? false : _b;
|
|
25
|
-
_this = _super.call(this, texture.spineData) || this;
|
|
26
|
-
/** 挂点 */
|
|
27
|
-
_this._followDots = [];
|
|
28
|
-
/** 是否已开始 */
|
|
29
|
-
_this._isStart = false;
|
|
30
|
-
_this.visible = visible;
|
|
31
|
-
_this.autoUpdate = false;
|
|
32
|
-
//如果存在挂点
|
|
33
|
-
if (followPointList === null || followPointList === void 0 ? void 0 : followPointList.length) {
|
|
34
|
-
followPointList === null || followPointList === void 0 ? void 0 : followPointList.forEach(function (item) {
|
|
35
|
-
item.follow.alpha = 0;
|
|
36
|
-
_this._followDots.push({
|
|
37
|
-
point: _this.skeleton.findBone(item.boneName),
|
|
38
|
-
follow: item.follow,
|
|
39
|
-
onUpdate: item.onUpdate,
|
|
40
|
-
angleFollow: item.angleFollow || false,
|
|
41
|
-
scaleFollow: item.scaleFollow || true,
|
|
42
|
-
});
|
|
43
|
-
});
|
|
44
|
-
}
|
|
45
|
-
_this._loopFn = _this._loop.bind(_this);
|
|
46
|
-
Ticker.system.add(_this._loopFn);
|
|
47
|
-
return _this;
|
|
48
|
-
}
|
|
49
|
-
/** @description 设置动画
|
|
50
|
-
* @param animationName 动画名称
|
|
51
|
-
* @param loop 是否循环播放
|
|
52
|
-
* @param delay 是否延迟播放
|
|
53
|
-
*/
|
|
54
|
-
LibPixiSpine.prototype.setAnimation = function (animationName, loop, delay) {
|
|
55
|
-
var _this = this;
|
|
56
|
-
if (animationName === void 0) { animationName = "Animation"; }
|
|
57
|
-
if (loop === void 0) { loop = false; }
|
|
58
|
-
if (delay === void 0) { delay = true; }
|
|
59
|
-
return new Promise(function (resolve) {
|
|
60
|
-
_this.visible = true;
|
|
61
|
-
_this.state.setAnimation(0, animationName, loop).listener = {
|
|
62
|
-
complete: function () {
|
|
63
|
-
if (delay) {
|
|
64
|
-
requestAnimationFrame(function () {
|
|
65
|
-
resolve();
|
|
66
|
-
});
|
|
67
|
-
}
|
|
68
|
-
else {
|
|
69
|
-
resolve();
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
};
|
|
73
|
-
});
|
|
74
|
-
};
|
|
75
|
-
/** @description 添加动画
|
|
76
|
-
* @param animationName 动画名称
|
|
77
|
-
* @param loop 是否循环播放
|
|
78
|
-
* @param delay 延迟播放时间
|
|
79
|
-
*/
|
|
80
|
-
LibPixiSpine.prototype.addAnimation = function (animationName, loop, delay) {
|
|
81
|
-
var _this = this;
|
|
82
|
-
if (animationName === void 0) { animationName = "Animation"; }
|
|
83
|
-
if (loop === void 0) { loop = false; }
|
|
84
|
-
if (delay === void 0) { delay = 0; }
|
|
85
|
-
return new Promise(function (resolve) {
|
|
86
|
-
_this.state.addAnimation(0, animationName, loop, delay).listener = {
|
|
87
|
-
complete: function () {
|
|
88
|
-
requestAnimationFrame(function () {
|
|
89
|
-
resolve();
|
|
90
|
-
});
|
|
91
|
-
},
|
|
92
|
-
};
|
|
93
|
-
});
|
|
94
|
-
};
|
|
95
|
-
/** @description 改变骨骼数据 */
|
|
96
|
-
LibPixiSpine.prototype.setSkin = function (skinName) {
|
|
97
|
-
this.skeleton.setSkinByName(skinName);
|
|
98
|
-
};
|
|
99
|
-
/** @description 销毁动画及挂点 */
|
|
100
|
-
LibPixiSpine.prototype.destroyAll = function () {
|
|
101
|
-
Ticker.system.remove(this._loopFn);
|
|
102
|
-
this.destroy();
|
|
103
|
-
this.removeFromParent();
|
|
104
|
-
};
|
|
105
|
-
/** @description 更新渲染 */
|
|
106
|
-
LibPixiSpine.prototype._loop = function () {
|
|
107
|
-
this.update(Ticker.system.deltaMS / 1000);
|
|
108
|
-
this._updateFollowPoint();
|
|
109
|
-
};
|
|
110
|
-
/** @description 更新挂点 */
|
|
111
|
-
LibPixiSpine.prototype._updateFollowPoint = function () {
|
|
112
|
-
if (this._followDots.length === 0)
|
|
113
|
-
return;
|
|
114
|
-
this._followDots.forEach(function (item) {
|
|
115
|
-
var _a = item.point, x = _a.worldX, y = _a.worldY;
|
|
116
|
-
var rotate = item.point.getWorldRotationX() * (Math.PI / 180);
|
|
117
|
-
var scaleX = item.point.getWorldScaleX();
|
|
118
|
-
var scaleY = item.point.getWorldScaleY();
|
|
119
|
-
if (item.onUpdate) {
|
|
120
|
-
item.onUpdate({
|
|
121
|
-
x: x,
|
|
122
|
-
y: y,
|
|
123
|
-
rotate: rotate,
|
|
124
|
-
scaleX: scaleX,
|
|
125
|
-
scaleY: scaleY,
|
|
126
|
-
});
|
|
127
|
-
}
|
|
128
|
-
else {
|
|
129
|
-
if (item.angleFollow) {
|
|
130
|
-
item.follow.rotation = rotate;
|
|
131
|
-
}
|
|
132
|
-
if (item.scaleFollow) {
|
|
133
|
-
item.follow.scale.set(scaleX, scaleY);
|
|
134
|
-
}
|
|
135
|
-
item.follow.position.set(x + 1920 / 2 - item.follow.width / 2, y + 1080 / 2 - item.follow.height / 2);
|
|
136
|
-
}
|
|
137
|
-
});
|
|
138
|
-
if (!this._isStart) {
|
|
139
|
-
this._isStart = true;
|
|
140
|
-
this._followDots.forEach(function (item) {
|
|
141
|
-
gsap.to(item.follow, {
|
|
142
|
-
alpha: 1,
|
|
143
|
-
duration: 0.25,
|
|
144
|
-
delay: 0.15,
|
|
145
|
-
});
|
|
146
|
-
});
|
|
147
|
-
}
|
|
148
|
-
};
|
|
149
|
-
return LibPixiSpine;
|
|
150
|
-
}(Spine));
|
|
151
|
-
export { LibPixiSpine };
|
|
1
|
+
"use strict";import{Assets as a,Ticker as n}from"pixi.js";import{Spine as r}from"@pixi-spine/runtime-3.8";import f from"gsap";export class LibPixiSpine extends r{constructor(o,e){const{followPointList:t,visible:l=!1}=e||{};let i;typeof o=="string"?i=a.get(o).spineData:i=o.spineData,super(i),this._followDots=[],this._isStart=!1,this.visible=l,this.autoUpdate=!1,t?.length&&t?.forEach(s=>{s.follow.alpha=0,this._followDots.push({point:this.skeleton.findBone(s.boneName),follow:s.follow,onUpdate:s.onUpdate,angleFollow:s.angleFollow||!1,scaleFollow:s.scaleFollow||!0})}),this._loopFn=this._loop.bind(this),n.system.add(this._loopFn)}setAnimation(o="Animation",e=!1,t=!0){return new Promise(l=>{this.visible=!0,this.state.setAnimation(0,o,e).listener={complete:()=>{t?requestAnimationFrame(()=>{l()}):l()}}})}addAnimation(o="Animation",e=!1,t=0){return new Promise(l=>{this.state.addAnimation(0,o,e,t).listener={complete:()=>{requestAnimationFrame(()=>{l()})}}})}setSkin(o){this.skeleton.setSkinByName(o)}destroyAll(){n.system.remove(this._loopFn),this.destroy(),this.removeFromParent()}_loop(){this.update(n.system.deltaMS/1e3),this._updateFollowPoint()}_updateFollowPoint(){this._followDots.length!==0&&(this._followDots.forEach(o=>{const{worldX:e,worldY:t}=o.point,l=o.point.getWorldRotationX()*(Math.PI/180),i=o.point.getWorldScaleX(),s=o.point.getWorldScaleY();o.onUpdate?o.onUpdate({x:e,y:t,rotate:l,scaleX:i,scaleY:s}):(o.angleFollow&&(o.follow.rotation=l),o.scaleFollow&&o.follow.scale.set(i,s),o.follow.position.set(e+1920/2-o.follow.width/2,t+1080/2-o.follow.height/2))}),this._isStart||(this._isStart=!0,this._followDots.forEach(o=>{f.to(o.follow,{alpha:1,duration:.25,delay:.15})})))}}
|
|
@@ -1,50 +1 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
if (typeof b !== "function" && b !== null)
|
|
10
|
-
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
-
extendStatics(d, b);
|
|
12
|
-
function __() { this.constructor = d; }
|
|
13
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
-
};
|
|
15
|
-
})();
|
|
16
|
-
import { Text, TextStyle } from "pixi.js";
|
|
17
|
-
/** @description 自定义文本类 */
|
|
18
|
-
var LibPixiText = /** @class */ (function (_super) {
|
|
19
|
-
__extends(LibPixiText, _super);
|
|
20
|
-
function LibPixiText(options) {
|
|
21
|
-
var _this = this;
|
|
22
|
-
var text = options.text, _a = options.fontSize, fontSize = _a === void 0 ? 36 : _a, _b = options.fontColor, fontColor = _b === void 0 ? 0xffffff : _b, stroke = options.stroke, strokeColor = options.strokeColor, strokeThickness = options.strokeThickness, _c = options.fontFamily, fontFamily = _c === void 0 ? "MicrosoftYaHei" : _c, _d = options.fontWeight, fontWeight = _d === void 0 ? "normal" : _d, _e = options.wordWrap, wordWrap = _e === void 0 ? false : _e, _f = options.wordWrapWidth, wordWrapWidth = _f === void 0 ? 100 : _f, _g = options.lineHeight, lineHeight = _g === void 0 ? 1.25 : _g, _h = options.align, align = _h === void 0 ? "left" : _h, _j = options.indent, indent = _j === void 0 ? 0 : _j, shadow = options.shadow;
|
|
23
|
-
var style = new TextStyle({
|
|
24
|
-
fontSize: fontSize,
|
|
25
|
-
wordWrap: wordWrap,
|
|
26
|
-
wordWrapWidth: wordWrapWidth,
|
|
27
|
-
fontWeight: fontWeight,
|
|
28
|
-
lineHeight: lineHeight * fontSize,
|
|
29
|
-
breakWords: wordWrap,
|
|
30
|
-
fill: fontColor,
|
|
31
|
-
align: align,
|
|
32
|
-
fontFamily: fontFamily,
|
|
33
|
-
stroke: stroke ? strokeColor : "transparent",
|
|
34
|
-
strokeThickness: stroke ? strokeThickness : 0,
|
|
35
|
-
lineJoin: "round",
|
|
36
|
-
});
|
|
37
|
-
if (shadow) {
|
|
38
|
-
style.dropShadow = true;
|
|
39
|
-
style.dropShadowColor = shadow[0];
|
|
40
|
-
style.dropShadowAngle = shadow[1] * (Math.PI / 180);
|
|
41
|
-
style.dropShadowBlur = shadow[2];
|
|
42
|
-
style.dropShadowDistance = shadow[3];
|
|
43
|
-
}
|
|
44
|
-
_this = _super.call(this, text, style) || this;
|
|
45
|
-
_this.position.x = indent * fontSize;
|
|
46
|
-
return _this;
|
|
47
|
-
}
|
|
48
|
-
return LibPixiText;
|
|
49
|
-
}(Text));
|
|
50
|
-
export { LibPixiText };
|
|
1
|
+
"use strict";import{Text as k,TextStyle as S}from"pixi.js";export class LibPixiText extends k{constructor(n){const{text:s,fontSize:e=36,fontColor:a=16777215,stroke:r,strokeColor:l,strokeThickness:d,fontFamily:f="MicrosoftYaHei",fontWeight:h="normal",wordWrap:i=!1,wordWrapWidth:p=100,lineHeight:c=1.25,align:w="left",indent:x=0,shadow:t}=n,o=new S({fontSize:e,wordWrap:i,wordWrapWidth:p,fontWeight:h,lineHeight:c*e,breakWords:i,fill:a,align:w,fontFamily:f,stroke:r?l:"transparent",strokeThickness:r?d:0,lineJoin:"round"});t&&(o.dropShadow=!0,o.dropShadowColor=t[0],o.dropShadowAngle=t[1]*(Math.PI/180),o.dropShadowBlur=t[2],o.dropShadowDistance=t[3]),super(s,o),this.position.x=x*e}}
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";import*as i from"./libPixiJs";export{i as LibPixiJs};
|
package/dist/libPixiJs.js
CHANGED
|
@@ -1,21 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { LibPixiContainer } from "./Base/LibPixiContainer";
|
|
3
|
-
import { LibPixiParticleMove } from "./Base/LibPixiParticleMove";
|
|
4
|
-
import { LibPixiRectBgColor } from "./Base/LibPixiRectBgColor";
|
|
5
|
-
import { LibPixiSpine } from "./Base/LibPixiSpine";
|
|
6
|
-
import { LibPixiText } from "./Base/LibPixiText";
|
|
7
|
-
/** @description 基础方法 */
|
|
8
|
-
export var Base = {
|
|
9
|
-
/** @description 自定义位图文本 */
|
|
10
|
-
LibPixiBitText: LibPixiBitText,
|
|
11
|
-
/** @description 自定义容器大小及背景色 */
|
|
12
|
-
LibPixiContainer: LibPixiContainer,
|
|
13
|
-
/** @description 粒子移动 */
|
|
14
|
-
LibPixiParticleMove: LibPixiParticleMove,
|
|
15
|
-
/** @description 自定义矩形背景色 */
|
|
16
|
-
LibPixiRectBgColor: LibPixiRectBgColor,
|
|
17
|
-
/** @description 自定义 Spine 动画 */
|
|
18
|
-
LibPixiSpine: LibPixiSpine,
|
|
19
|
-
/** @description 自定义普通文本类 */
|
|
20
|
-
LibPixiText: LibPixiText,
|
|
21
|
-
};
|
|
1
|
+
"use strict";import{LibPixiBitText as i}from"./Base/LibPixiBitText";import{LibPixiContainer as o}from"./Base/LibPixiContainer";import{LibPixiParticleMove as r}from"./Base/LibPixiParticleMove";import{LibPixiRectBgColor as t}from"./Base/LibPixiRectBgColor";import{LibPixiSpine as m}from"./Base/LibPixiSpine";import{LibPixiText as e}from"./Base/LibPixiText";export const Base={LibPixiBitText:i,LibPixiContainer:o,LibPixiParticleMove:r,LibPixiRectBgColor:t,LibPixiSpine:m,LibPixiText:e};
|
package/package.json
CHANGED
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "lyb-pixi-js",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.6",
|
|
4
4
|
"description": "自用Pixi.JS方法库",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"types": "./dist/index.d.ts",
|
|
8
8
|
"main": "./dist/index.js",
|
|
9
9
|
"scripts": {
|
|
10
|
-
"
|
|
10
|
+
"umd": "vite build",
|
|
11
|
+
"esm": "tsc & esbuild dist/**/*.js --minify --outdir=dist --allow-overwrite"
|
|
11
12
|
},
|
|
12
13
|
"exports": {
|
|
13
14
|
"./*": "./dist/*"
|
|
@@ -34,7 +35,8 @@
|
|
|
34
35
|
],
|
|
35
36
|
"devDependencies": {
|
|
36
37
|
"@types/node": "^22.10.5",
|
|
37
|
-
"
|
|
38
|
+
"esbuild": "^0.24.2",
|
|
39
|
+
"typescript": "^5.7.3"
|
|
38
40
|
},
|
|
39
41
|
"dependencies": {
|
|
40
42
|
"@pixi-spine/runtime-3.8": "^4.0.3",
|