UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-02-06 07:14:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts] Closes #1966, PolygonBatcher does not flush if the blend mode has not changed.

Browse Source
This commit is contained in:
Mario Zechner 2021-10-11 16:16:55 +02:00
parent 555c124a44
commit d296fa3efa
3 changed files with 113 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
spine-ts/spine-core/src/AnimationState.ts
View File

@ -1095,24 +1095,24 @@ export enum EventType {
* {@link AnimationState#addListener()}. */
export interface AnimationStateListener {
/** Invoked when this entry has been set as the current entry. */
start? (entry: TrackEntry): void;
start?(entry: TrackEntry): void;
/** Invoked when another entry has replaced this entry as the current entry. This entry may continue being applied for
* mixing. */
interrupt? (entry: TrackEntry): void;
interrupt?(entry: TrackEntry): void;
/** Invoked when this entry is no longer the current entry and will never be applied again. */
end? (entry: TrackEntry): void;
end?(entry: TrackEntry): void;
/** Invoked when this entry will be disposed. This may occur without the entry ever being set as the current entry.
* References to the entry should not be kept after dispose is called, as it may be destroyed or reused. */
dispose? (entry: TrackEntry): void;
dispose?(entry: TrackEntry): void;
/** Invoked every time this entry's animation completes a loop. */
complete? (entry: TrackEntry): void;
complete?(entry: TrackEntry): void;
/** Invoked when this entry's animation triggers an event. */
event? (entry: TrackEntry, event: Event): void;
event?(entry: TrackEntry, event: Event): void;
}
export abstract class AnimationStateAdapter implements AnimationStateListener {

1
spine-ts/spine-webgl/src/PolygonBatcher.ts
View File

@ -72,6 +72,7 @@ export class PolygonBatcher implements Disposable {
}
setBlendMode (srcColorBlend: number, srcAlphaBlend: number, dstBlend: number) {
if (this.srcColorBlend == srcColorBlend && this.srcAlphaBlend == srcAlphaBlend && this.dstBlend == dstBlend) return;
this.srcColorBlend = srcColorBlend;
this.srcAlphaBlend = srcAlphaBlend;
this.dstBlend = dstBlend;

106
spine-ts/spine-webgl/tests/test-drawcalls.html Normal file
View File

@ -0,0 +1,106 @@
<html>
<script src="../dist/iife/spine-webgl.js"></script>
<style>
html,
body {
margin: 0;
padding: 0;
}
</style>
<body>
<canvas id="canvas" style="position: absolute; width: 100%; height: 100%;"></canvas>
<div id="info" style="position: absolute; top: 0; left: 0; color: white; margin: 1em;">test</div>
</body>
<script>
// Define the class running in the Spine canvas
class App {
numSkeletons;
skeletons;
states;
info;
loadAssets(canvas) {
this.numSkeletons = 100;
this.skeletons = [];
this.states = [];
this.info = document.querySelector("#info")[0];
canvas.assetManager.loadTextureAtlas("mix-and-match-pma.atlas");
canvas.assetManager.loadBinary("mix-and-match-pro.skel");
}
initialize(canvas) {
let assetManager = canvas.assetManager;
// Create the atlas
let atlas = canvas.assetManager.require("mix-and-match-pma.atlas");
let atlasLoader = new spine.AtlasAttachmentLoader(atlas);
// Create the skeleton
let skeletonBinary = new spine.SkeletonBinary(atlasLoader);
skeletonBinary.scale = 0.5;
let skeletonData = skeletonBinary.readSkeletonData(assetManager.require("mix-and-match-pro.skel"));
let stateData = new spine.AnimationStateData(skeletonData);
for (var i = 0; i < this.numSkeletons; i++) {
let skeleton = new spine.Skeleton(skeletonData);
// Create the animation state
let state = new spine.AnimationState(stateData);
state.setAnimation(0, "dance", true);
// Create a new skin, by mixing and matching other skins
// that fit together. Items making up the girl are individual
// skins. Using the skin API, a new skin is created which is
// a combination of all these individual item skins.
let mixAndMatchSkin = new spine.Skin("custom-girl");
mixAndMatchSkin.addSkin(skeletonData.findSkin("skin-base"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("nose/short"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("eyelids/girly"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("eyes/violet"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("hair/brown"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("clothes/hoodie-orange"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("legs/pants-jeans"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("accessories/bag"));
mixAndMatchSkin.addSkin(skeletonData.findSkin("accessories/hat-red-yellow"));
skeleton.setSkin(mixAndMatchSkin);
skeleton.x = Math.random() * 400;
skeleton.y = Math.random() * 400;
this.skeletons.push(skeleton);
this.states.push(state);
}
}
update(canvas, delta) {
for (var i = 0; i < this.numSkeletons; i++) {
let state = this.states[i];
let skeleton = this.skeletons[i];
state.update(delta);
state.apply(skeleton);
skeleton.updateWorldTransform();
}
}
render(canvas) {
let renderer = canvas.renderer;
renderer.resize(spine.ResizeMode.Expand);
canvas.clear(0.2, 0.2, 0.2, 1);
renderer.begin();
for (var i = 0; i < this.numSkeletons; i++) {
let skeleton = this.skeletons[i];
renderer.drawSkeleton(skeleton, true);
}
renderer.end();
info.innerText = "Draw calls: " + renderer.batcher.drawCalls;
}
}
// Create the Spine canvas which runs the app
new spine.SpineCanvas(document.getElementById("canvas"), {
pathPrefix: "assets/",
app: new App()
});
</script>
</html>