UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-03-26 22:49:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts][pixi] Updated ts example on v7 and added to v8

Browse Source
This commit is contained in:
Davide Tantillo 2024-11-07 15:54:28 +01:00
parent 9d14027ebb
commit 97a83c2430
11 changed files with 3331 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
spine-ts/spine-pixi-v7/example/typescript/index.ts
View File

@ -1,5 +1,5 @@
import { Application, Assets } from 'pixi.js';
import { Spine } from '@esotericsoftware/spine-pixi';
import { Spine } from '@esotericsoftware/spine-pixi-v7';
/** The PixiJS app Application instance, shared across the project */
export const app = new Application<HTMLCanvasElement>({

28
spine-ts/spine-pixi-v7/example/typescript/package-lock.json generated
View File

@ -1,15 +1,15 @@
{
"name": "spine-pixi-ts-example",
"name": "spine-pixi-v7-ts-example",
"version": "1.0.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "spine-pixi-ts-example",
"name": "spine-pixi-v7-ts-example",
"version": "1.0.0",
"license": "LicenseRef-LICENSE",
"dependencies": {
"@esotericsoftware/spine-pixi": "~4.2.43",
"@esotericsoftware/spine-pixi-v7": "~4.2.63",
"pixi.js": "^7.2.4"
},
"devDependencies": {
@ -370,12 +370,19 @@
"node": ">=12"
}
},
"node_modules/@esotericsoftware/spine-pixi": {
"version": "4.2.43",
"resolved": "https://registry.npmjs.org/@esotericsoftware/spine-pixi/-/spine-pixi-4.2.43.tgz",
"integrity": "sha512-MJ9Mmul9lPV5XXgBK9AfEMhiX5LQmxIz2QcNQhjLqARvFhVC1M+CALmqrnZX0HJjX1avgynuMuB9vXphmyo6Og==",
"node_modules/@esotericsoftware/spine-core": {
"version": "4.2.63",
"resolved": "https://registry.npmjs.org/@esotericsoftware/spine-core/-/spine-core-4.2.63.tgz",
"integrity": "sha512-GzoQstbYRkNowTkZiNzk30lRFzuqlwxyTa64DA6fyU7xm9sVyJKHLeaGqqiBXqBXz2oDCFna7le/RQfIK80qgw==",
"license": "LicenseRef-LICENSE"
},
"node_modules/@esotericsoftware/spine-pixi-v7": {
"version": "4.2.63",
"resolved": "https://registry.npmjs.org/@esotericsoftware/spine-pixi-v7/-/spine-pixi-v7-4.2.63.tgz",
"integrity": "sha512-z/yIBxv8NqLV7FpO2QT+a9I7SX//qI8cXDpMbxhhf8m75soVKR9o+IsvwkqhchthwEfHP4/60MGnhHi3oDB6Rw==",
"license": "LicenseRef-LICENSE",
"dependencies": {
"@esotericsoftware/spine-core": "4.2.43"
"@esotericsoftware/spine-core": "4.2.63"
},
"peerDependencies": {
"@pixi/assets": "^7.2.4",
@ -386,11 +393,6 @@
"@pixi/text": "^7.2.4"
}
},
"node_modules/@esotericsoftware/spine-pixi/node_modules/@esotericsoftware/spine-core": {
"version": "4.2.43",
"resolved": "https://registry.npmjs.org/@esotericsoftware/spine-core/-/spine-core-4.2.43.tgz",
"integrity": "sha512-FzpNkJllTwu7l1bHO6186r8D4/0UR3bkPWqMlLUZf57sh2ErV8iQFyPXiz3suZTXpfAjw4k5dVhAebPVUZMtXw=="
},
"node_modules/@pixi/accessibility": {
"version": "7.4.2",
"resolved": "https://registry.npmjs.org/@pixi/accessibility/-/accessibility-7.4.2.tgz",

8
spine-ts/spine-pixi-v7/example/typescript/package.json
View File

@ -1,15 +1,15 @@
{
"name": "spine-pixi-ts-example",
"name": "spine-pixi-v7-ts-example",
"description": "Spine pixi ts example",
"author": "Esoteric Software LLC",
"license": "LicenseRef-LICENSE",
"version": "1.0.0",
"version": "1.0.0",
"scripts": {
"build":"npx esbuild index.ts --bundle --sourcemap --outfile=build/index.js",
"dev": "npx concurrently \"npx live-server --no-browser\" \"npm run build -- --watch\""
"dev": "npx concurrently \"npx live-server --no-browser\" \"npm run build -- --watch\""
},
"dependencies": {
"@esotericsoftware/spine-pixi": "~4.2.43",
"@esotericsoftware/spine-pixi-v7": "~4.2.63",
"pixi.js": "^7.2.4"
},
"devDependencies": {

6
spine-ts/spine-pixi-v8/example/typescript/README.md Normal file
View File

@ -0,0 +1,6 @@
# spine-pixi TypeScript
Minimal example project using Pixi, spine-pixi, and TypeScript via NPM and [esbuild](https://esbuild.github.io/).
1. Install dependencies: `npm install`
2. Build bundle: `npm run build`
3. Development (run server and recompile in watch mode): `npm run dev`

95
spine-ts/spine-pixi-v8/example/typescript/assets/spineboy-pma.atlas Normal file
View File

@ -0,0 +1,95 @@
spineboy-pma.png
size: 1024, 256
filter: Linear, Linear
pma: true
scale: 0.5
crosshair
bounds: 352, 7, 45, 45
eye-indifferent
bounds: 862, 105, 47, 45
eye-surprised
bounds: 505, 79, 47, 45
front-bracer
bounds: 826, 66, 29, 40
front-fist-closed
bounds: 786, 65, 38, 41
front-fist-open
bounds: 710, 51, 43, 44
rotate: 90
front-foot
bounds: 210, 6, 63, 35
front-shin
bounds: 665, 128, 41, 92
rotate: 90
front-thigh
bounds: 2, 2, 23, 56
rotate: 90
front-upper-arm
bounds: 250, 205, 23, 49
goggles
bounds: 665, 171, 131, 83
gun
bounds: 798, 152, 105, 102
head
bounds: 2, 27, 136, 149
hoverboard-board
bounds: 2, 178, 246, 76
hoverboard-thruster
bounds: 722, 96, 30, 32
rotate: 90
hoverglow-small
bounds: 275, 81, 137, 38
mouth-grind
bounds: 614, 97, 47, 30
mouth-oooo
bounds: 612, 65, 47, 30
mouth-smile
bounds: 661, 64, 47, 30
muzzle-glow
bounds: 382, 54, 25, 25
muzzle-ring
bounds: 275, 54, 25, 105
rotate: 90
muzzle01
bounds: 911, 95, 67, 40
rotate: 90
muzzle02
bounds: 792, 108, 68, 42
muzzle03
bounds: 956, 171, 83, 53
rotate: 90
muzzle04
bounds: 275, 7, 75, 45
muzzle05
bounds: 140, 3, 68, 38
neck
bounds: 250, 182, 18, 21
portal-bg
bounds: 140, 43, 133, 133
portal-flare1
bounds: 554, 65, 56, 30
portal-flare2
bounds: 759, 112, 57, 31
rotate: 90
portal-flare3
bounds: 554, 97, 58, 30
portal-shade
bounds: 275, 121, 133, 133
portal-streaks1
bounds: 410, 126, 126, 128
portal-streaks2
bounds: 538, 129, 125, 125
rear-bracer
bounds: 857, 67, 28, 36
rear-foot
bounds: 663, 96, 57, 30
rear-shin
bounds: 414, 86, 38, 89
rotate: 90
rear-thigh
bounds: 756, 63, 28, 47
rear-upper-arm
bounds: 60, 5, 20, 44
rotate: 90
torso
bounds: 905, 164, 49, 90

BIN
spine-ts/spine-pixi-v8/example/typescript/assets/spineboy-pma.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 239 KiB

BIN
spine-ts/spine-pixi-v8/example/typescript/assets/spineboy-pro.skel Normal file
View File

Binary file not shown.

12
spine-ts/spine-pixi-v8/example/typescript/index.html Normal file
View File

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>Pixi Typescript Example</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
</head>
<body>
<script src='build/index.js'></script>
</body>
</html>

50
spine-ts/spine-pixi-v8/example/typescript/index.ts Normal file
View File

@ -0,0 +1,50 @@
import { Application, Assets } from 'pixi.js';
import { Spine } from '@esotericsoftware/spine-pixi-v8';
/** The PixiJS app Application instance, shared across the project */
export const app = new Application();
/** Setup app and initialise assets */
async function init() {
await app.init({
width: window.innerWidth,
height: window.innerHeight,
resolution: window.devicePixelRatio || 1,
autoDensity: true,
resizeTo: window,
backgroundColor: 0x2c3e50,
hello: true,
})
// Add pixi canvas element (app.view) to the document's body
document.body.appendChild(app.canvas);
// Pre-load the skeleton data and atlas. You can also load .json skeleton data.
Assets.add({ alias: "spineboyData", src: "assets/spineboy-pro.skel" });
Assets.add({ alias: "spineboyAtlas", src: "assets/spineboy-pma.atlas" });
await Assets.load(["spineboyData", "spineboyAtlas"]);
// Create the spine display object
const spineboy = Spine.from({
atlas: "spineboyAtlas",
skeleton: "spineboyData",
scale: 0.5,
});
// Set the default mix time to use when transitioning
// from one animation to the next.
spineboy.state.data.defaultMix = 0.2;
// Center the spine object on screen.
spineboy.x = window.innerWidth / 2;
spineboy.y = window.innerHeight / 2 + spineboy.getBounds().height / 2;
// Set animation "cape-follow-example" on track 0, looped.
spineboy.state.setAnimation(0, "run", true);
// Add the display object to the stage.
app.stage.addChild(spineboy);
}
// Init everything
init();

3128
spine-ts/spine-pixi-v8/example/typescript/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

20
spine-ts/spine-pixi-v8/example/typescript/package.json Normal file
View File

@ -0,0 +1,20 @@
{
"name": "spine-pixi-v8-ts-example",
"description": "Spine pixi ts example",
"author": "Esoteric Software LLC",
"license": "LicenseRef-LICENSE",
"version": "1.0.0",
"scripts": {
"build":"npx esbuild index.ts --bundle --sourcemap --outfile=build/index.js",
"dev": "npx concurrently \"npx live-server --no-browser\" \"npm run build -- --watch\""
},
"dependencies": {
"@esotericsoftware/spine-pixi-v8": "~4.2.63",
"pixi.js": "^8.4.0"
},
"devDependencies": {
"esbuild": "0.17.17",
"concurrently": "^7.6.0",
"live-server": "^1.2.2"
}
}