Code Monkey home page Code Monkey logo

pixi-spine's Introduction

pixi-spine

Build Status

Spine implementation for pixi v3 and pixi v4.

For v5 please see next branch and use npm version 2.0.0-alpha

Usage

Prebuilt Files

If you are just including the built files, pixi spine adds itself to a pixi namespace:

new PIXI.spine.Spine();

Basic example

var app = new PIXI.Application();

document.body.appendChild(app.view);

PIXI.loader
    .add('spineCharacter', 'spine-data-1/HERO.json')
    .load(function (loader, resources) {
        var animation = new PIXI.spine.Spine(resources.spineCharacter.spineData);

        // add the animation to the scene and render...
        app.stage.addChild(animation);
        
        // run 
        var animation = new PIXI.spine.Spine(spineBoyData);
        if (animation.state.hasAnimation('run')) {
            // run forever, little boy!
            animation.state.setAnimation(0, 'run', true);
            // dont run too fast
            animation.state.timeScale = 0.1;
        }
        
        app.start();
    });

Want to go advanced?

Read our docs.

Using webpack or browserify?

Our library is tested for integration with webpack and browserify, check our travis config and checkpack.

Typescript

There's "bin/pixi-spine.d.ts" file, you can use it.

Spine version

Pixi-spine 1.3.x works ONLY with data exported from Spine 3.5.

Please enable "beta updates" and re-export everything from the spine editor.

According to spine runtime license, you can use runtime only if you have bought the editor, so exporting latest versions of animations shouldn't be a problem for you.

Building

You will need to have node setup on your machine.

Make sure you have yarn installed:

npm install -g yarn

Then you can install dependencies and build:

yarn
yarn build

That will output the built distributables to ./bin.

pixi-spine's People

Contributors

alebles avatar alemoroz avatar arksu avatar congtung10t2 avatar cursedcoder avatar englercj avatar finscn avatar goodboydigital avatar gurmukhp avatar ivanpopelyshev avatar jmlee2k avatar johanlajili avatar jonlepage avatar kieirra avatar knifhen avatar krzysztof-o avatar mattostgard avatar paolotozzo avatar patrick-hammond avatar pawelstan avatar probityrules avatar qwertykg avatar rblstr avatar simontadram avatar smlmyck avatar zprodev avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.