【杂】dragonBones.支持phaserV3.90版本
dragonBones官方只支持到了3.1.但phaser3.6+后大改过。TextureTintPipeline.prototype.batchSprite完全不兼容了。
如今借助AI大模型。1小时搞定,换成过去的话,熟悉接口阅读文档,至少1~3天。
var TextureTintPipeline = /** @class */ (function (_super) {
__extends(TextureTintPipeline, _super);
function TextureTintPipeline(config) {
var _this = _super.call(this, config) || this;
_this._tempMatrix1 = new phaser.util.TransformMatrix();
_this._tempMatrix2 = new phaser.util.TransformMatrix();
_this._tempMatrix3 = new phaser.util.TransformMatrix();
return _this;
}
TextureTintPipeline.prototype.batchSprite = function (sprite, camera, parentTransformMatrix) {
// 1. 检查批处理是否已满
if (this.currentBatch !== null && this.currentBatch.count === this.maxQuadCount) {
this.flush();
}
this.renderer.pipelines.set(this, sprite);
// 2. 准备矩阵对象
var camMatrix = this._tempMatrix1;
var spriteMatrix = this._tempMatrix2;
var calcMatrix = this._tempMatrix3;
var frame = sprite.frame;
var texture = frame.glTexture;
var unit = this.setTexture2D(texture);
// 3. --- 核心修复:矩阵计算 (解决散架问题) ---
// 第一步:计算 Sprite 自身的局部变换(位移、旋转、缩放)
spriteMatrix.applyITRSC(
sprite.x,
sprite.y,
sprite.rotation,
sprite.scaleX,
sprite.scaleY,
sprite.skewX,
sprite.skewY
);
// 第二步:结合父级矩阵(如果有)
if (parentTransformMatrix) {
// 关键点:父矩阵 * 子矩阵 = 最终世界矩阵
// 之前你的代码在这里重置了 e/f,导致父级位移失效,这里修正了
parentTransformMatrix.multiply(spriteMatrix, calcMatrix);
} else {
calcMatrix.copyFrom(spriteMatrix);
}
// 第三步:应用摄像机滚动 (Scroll Factor)
calcMatrix.e -= camera.scrollX * sprite.scrollFactorX;
calcMatrix.f -= camera.scrollY * sprite.scrollFactorY;
// 第四步:应用摄像机变换 (缩放/旋转)
camMatrix.copyFrom(camera.matrix);
// 摄像机矩阵 * 物体矩阵
camMatrix.multiply(calcMatrix, calcMatrix);
// 4. --- 顶点计算 ---
var width = frame.width;
var height = frame.height;
var x = -sprite.displayOriginX;
var y = -sprite.displayOriginY;
// 处理裁剪 (Crop)
var u0 = frame.u0;
var v0 = frame.v0;
var u1 = frame.u1;
var v1 = frame.v1;
if (sprite.isCropped) {
var crop = sprite._crop;
if (crop.flipX !== sprite.flipX || crop.flipY !== sprite.flipY) {
frame.updateCropUVs(crop, sprite.flipX, sprite.flipY);
}
width = crop.width;
height = crop.height;
u0 = crop.u0;
v0 = crop.v0;
u1 = crop.u1;
v1 = crop.v1;
}
if (sprite.flipX) { width *= -1; x += width; }
if (sprite.flipY) { height *= -1; y += height; }
var xw = x + width;
var yh = y + height;
// 使用计算好的 calcMatrix 转换四个顶点坐标
var tx0 = calcMatrix.getX(x, y);
var ty0 = calcMatrix.getY(x, y);
var tx1 = calcMatrix.getX(x, yh);
var ty1 = calcMatrix.getY(x, yh);
var tx2 = calcMatrix.getX(xw, yh);
var ty2 = calcMatrix.getY(xw, yh);
var tx3 = calcMatrix.getX(xw, y);
var ty3 = calcMatrix.getY(xw, y);
// 5. --- 颜色计算 (解决不显示问题) ---
// 必须计算 Alpha 和 Tint,否则可能全黑或透明
var getTint = Phaser.Renderer.WebGL.Utils.getTintAppendFloatAlpha;
var baseAlpha = camera.alpha * sprite.alpha;
var tintTL = getTint(sprite.tintTopLeft, baseAlpha);
var tintTR = getTint(sprite.tintTopRight, baseAlpha);
var tintBL = getTint(sprite.tintBottomLeft, baseAlpha);
var tintBR = getTint(sprite.tintBottomRight, baseAlpha);
var tintEffect = (sprite.isTinted && sprite.tintFill);
// 像素取整(可选,防止抖动)
if (camera.roundPixels) {
tx0 = Math.round(tx0); ty0 = Math.round(ty0);
tx1 = Math.round(tx1); ty1 = Math.round(ty1);
tx2 = Math.round(tx2); ty2 = Math.round(ty2);
tx3 = Math.round(tx3); ty3 = Math.round(ty3);
}
// 6. --- 提交绘制 ---
// 恢复标准的 batchQuad 调用,只传 u0, v0, u1, v1
this.batchQuad(
sprite,
tx0, ty0,
tx1, ty1,
tx2, ty2,
tx3, ty3,
u0, v0,
u1, v1,
tintTL, tintTR, tintBL, tintBR,
tintEffect,
texture,
unit
);
};
return TextureTintPipeline;
}(Phaser.Renderer.WebGL.Pipelines.MultiPipeline));