UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2025-12-22 02:06:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts] More sequence fixes, see #1956

Browse Source 
Also fixed runtime exports script, must copy all dragon atlas pages.
This commit is contained in:
Mario Zechner 2021-10-13 21:42:11 +02:00
parent a0f1ed1b9b
commit b48e2c33b8
12 changed files with 128 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/export/runtimes.sh
View File

@ -197,7 +197,7 @@ cp -f ../goblins/export/goblins-pma.png "$ROOT/spine-ts/spine-webgl/example/asse
cp -f ../dragon/export/dragon-ess.json "$ROOT/spine-ts/spine-webgl/example/assets/" cp -f ../dragon/export/dragon-ess.json "$ROOT/spine-ts/spine-webgl/example/assets/"
cp -f ../dragon/export/dragon-ess.skel "$ROOT/spine-ts/spine-webgl/example/assets/" cp -f ../dragon/export/dragon-ess.skel "$ROOT/spine-ts/spine-webgl/example/assets/"
cp -f ../dragon/export/dragon-pma.atlas "$ROOT/spine-ts/spine-webgl/example/assets/" cp -f ../dragon/export/dragon-pma.atlas "$ROOT/spine-ts/spine-webgl/example/assets/"
cp -f ../dragon/export/dragon-pma.png "$ROOT/spine-ts/spine-webgl/example/assets/" cp -f ../dragon/export/dragon-pma*.png "$ROOT/spine-ts/spine-webgl/example/assets/"
cp -f ../raptor/export/raptor-pro.json "$ROOT/spine-ts/spine-webgl/example/assets/" cp -f ../raptor/export/raptor-pro.json "$ROOT/spine-ts/spine-webgl/example/assets/"
cp -f ../raptor/export/raptor-pro.skel "$ROOT/spine-ts/spine-webgl/example/assets/" cp -f ../raptor/export/raptor-pro.skel "$ROOT/spine-ts/spine-webgl/example/assets/"

7
spine-ts/.vscode/launch.json vendored
View File

@ -17,6 +17,13 @@
"name": "drag-and-drop", "name": "drag-and-drop",
"url": "http://localhost:8080/spine-webgl/example/drag-and-drop.html", "url": "http://localhost:8080/spine-webgl/example/drag-and-drop.html",
"webRoot": "${workspaceFolder}" "webRoot": "${workspaceFolder}"
},
{
"type": "pwa-chrome",
"request": "launch",
"name": "barebones-dragon",
"url": "http://localhost:8080/spine-webgl/example/barebones-dragon.html",
"webRoot": "${workspaceFolder}"
} }
] ]
} }

2
spine-ts/spine-core/src/Animation.ts
View File

@ -2210,7 +2210,7 @@ export class SequenceTimeline extends Timeline implements SlotTimeline {
let index = modeAndIndex >> 4, count = this.attachment.sequence.regions.length; let index = modeAndIndex >> 4, count = this.attachment.sequence.regions.length;
let mode = SequenceModeValues[modeAndIndex & 0xf]; let mode = SequenceModeValues[modeAndIndex & 0xf];
if (mode != SequenceMode.hold) { if (mode != SequenceMode.hold) {
index += (time - before) / delay + 0.00001; index += (((time - before) / delay + 0.00001) | 0);
switch (mode) { switch (mode) {
case SequenceMode.once: case SequenceMode.once:
index = Math.min(count - 1, index); index = Math.min(count - 1, index);

18
spine-ts/spine-core/src/attachments/HasTextureRegion.ts
View File

@ -32,19 +32,25 @@ import { Color } from "../Utils"
import { Sequence } from "./Sequence" import { Sequence } from "./Sequence"
export interface HasTextureRegion { export interface HasTextureRegion {
/** The name used to find the {@link #region()}. */ /** The name used to find the {@link #getRegion()}. */
path: string; getPath (): string;
/** The region used to draw the attachment. After setting the region or if the region's properties are changed, setPath (path: string): void;
getRegion (): TextureRegion;
/** Sets the region used to draw the attachment. After setting the region or if the region's properties are changed,
* {@link #updateRegion()} must be called. */ * {@link #updateRegion()} must be called. */
region: TextureRegion; setRegion (region: TextureRegion): void;
/** Updates any values the attachment calculates using the {@link #getRegion()}. Must be called after setting the /** Updates any values the attachment calculates using the {@link #getRegion()}. Must be called after setting the
* {@link #getRegion()} or if the region's properties are changed. */ * {@link #getRegion()} or if the region's properties are changed. */
updateRegion (): void; updateRegion (): void;
/** The color to tint the attachment. */ /** The color to tint the attachment. */
color: Color; getColor (): Color;
sequence: Sequence; getSequence (): Sequence;
setSequence (sequence: Sequence): void;
} }

3
spine-ts/spine-core/src/attachments/RegionAttachment.ts
View File

@ -145,7 +145,8 @@ export class RegionAttachment extends Attachment implements HasTextureRegion {
* @param offset The <code>worldVertices</code> index to begin writing values. * @param offset The <code>worldVertices</code> index to begin writing values.
* @param stride The number of <code>worldVertices</code> entries between the value pairs written. */ * @param stride The number of <code>worldVertices</code> entries between the value pairs written. */
computeWorldVertices (slot: Slot, worldVertices: NumberArrayLike, offset: number, stride: number) { computeWorldVertices (slot: Slot, worldVertices: NumberArrayLike, offset: number, stride: number) {
if (this.sequence != null) this.sequence.apply(slot, this); if (this.sequence != null)
this.sequence.apply(slot, this);
let bone = slot.bone; let bone = slot.bone;
let vertexOffset = this.offset; let vertexOffset = this.offset;

BIN
spine-ts/spine-webgl/example/assets/dragon-pma_2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
spine-ts/spine-webgl/example/assets/dragon-pma_3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 77 KiB

BIN
spine-ts/spine-webgl/example/assets/dragon-pma_4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 129 KiB

BIN
spine-ts/spine-webgl/example/assets/dragon-pma_5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 98 KiB

BIN
spine-ts/spine-webgl/example/assets/dragon-pma_6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 80 KiB

81
spine-ts/spine-webgl/example/barebones-dragon.html Normal file
View File

@ -0,0 +1,81 @@
<html>
<script src="../dist/iife/spine-webgl.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
</style>
<body>
<canvas id="canvas" style="position: absolute; width: 100%; height: 100%;"></canvas>
<script>
class App {
constructor() {
this.skeleton = null;
this.animationState = null;
}
loadAssets(canvas) {
// Load the skeleton file.
canvas.assetManager.loadBinary("assets/dragon-ess.skel");
// Load the atlas and its pages.
canvas.assetManager.loadTextureAtlas("assets/dragon-pma.atlas");
}
initialize(canvas) {
let assetManager = canvas.assetManager;
// Create the texture atlas.
var atlas = assetManager.require("assets/dragon-pma.atlas");
// Create a AtlasAttachmentLoader that resolves region, mesh, boundingbox and path attachments
var atlasLoader = new spine.AtlasAttachmentLoader(atlas);
// Create a SkeletonBinary instance for parsing the .skel file.
var skeletonBinary = new spine.SkeletonBinary(atlasLoader);
// Set the scale to apply during parsing, parse the file, and create a new skeleton.
skeletonBinary.scale = 1;
var skeletonData = skeletonBinary.readSkeletonData(assetManager.require("assets/dragon-ess.skel"));
this.skeleton = new spine.Skeleton(skeletonData);
// Create an AnimationState, and set the "run" animation in looping mode.
var animationStateData = new spine.AnimationStateData(skeletonData);
this.animationState = new spine.AnimationState(animationStateData);
this.animationState.setAnimation(0, "flying", true);
}
update(canvas, delta) {
// Update the animation state using the delta time.
this.animationState.update(delta);
// Apply the animation state to the skeleton.
this.animationState.apply(this.skeleton);
// Let the skeleton update the transforms of its bones.
this.skeleton.updateWorldTransform();
}
render(canvas) {
let renderer = canvas.renderer;
// Resize the viewport to the full canvas.
renderer.resize(spine.ResizeMode.Expand);
// Clear the canvas with a light gray color.
canvas.clear(0.2, 0.2, 0.2, 1);
// Begin rendering.
renderer.begin();
// Draw the skeleton
renderer.drawSkeleton(this.skeleton, true);
// Complete rendering.
renderer.end();
}
}
new spine.SpineCanvas(document.getElementById("canvas"), {
app: new App()
})
</script>
</body>
</html>