Spine: 2D skeletal animation tool

Treon · March 27, 2013, 1:59pm

Thanks Nathan, I makes sense now

Cheers

lumendes · March 30, 2013, 7:49am

Didn’t managed to run this for android yet, any android project examples available ?
Especially regarding the makefile, adding reference to headers is trivial:

LOCAL_C_INCLUDES := $(LOCAL_PATH)/../../Classes \
                    ../../spine-runtimes/spine-cpp/include \
                    ../../spine-runtimes/spine-cocos2dx/include

Having difficulties to reference the source files though.
Using wildcard doesn’t seem to find any sources (cant disregard syntax or path issue here)

#GAME
LOCAL_SRC_FILES := hellocpp/main.cpp \
                   ../../Classes/AppDelegate.cpp \
(...)
#JSON
LOCAL_SRC_FILES += $(wildcard $(LOCAL_PATH) ../../spine-runtimes/spine-cpp/src/json/*.cpp)

Adding every single source file (exhausting…) leads to compile error.

# GAME
LOCAL_SRC_FILES := hellocpp/main.cpp \
                   ../../Classes/AppDelegate.cpp \
(...)
# JSON
LOCAL_SRC_FILES += ../../../spine-runtimes/spine-cpp/src/json/json_reader.cpp \
                   ../../../spine-runtimes/spine-cpp/src/json/json_value.cpp \
                   ../../../spine-runtimes/spine-cpp/src/json/json_writer.cpp

jni/../../../spine-runtimes/spine-cpp/src/json/json_reader.cpp: In function 'std::istream& Json::operator>>(std::istream&, Json::Value&)':
jni/../../../spine-runtimes/spine-cpp/src/json/json_reader.cpp:880: error: exception handling disabled, use -fexceptions to enable

willyx · March 30, 2013, 1:46pm

We are running the example and sometime we have problems with alpha transparency.
In my Pc (Seven64, Radeon 6850) the alpha transparency is always gone (look the right picture at the eyes). And the fade rutine…is not working as intent (left).
In another PC (WinXP) sometime runs nice, sometime doesn’t work…any idea?

PS: skeletonNode->boundingBox().width and height return always 0. Bug?

NateS · March 30, 2013, 5:07pm

I’ve been working on a C API, which I just finished:

https://github.com/EsotericSoftware/spine-runtimes/tree/master/spine-c

I don’t think it makes sense to maintain both a C++ and C API, so I will get rid of spine-cpp and convert spine-cocos2dx to use spine-c. Things are better in spine-c too, the attachment loading is cleaner, the JSON parsing is much better. spine-c is also easier to extend, just implement a couple functions. I’ve converted spine-sfml to use spine-c instead of spine-cpp and the whole SFML runtime is only 136 LOC!

https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-sfml/src/spine/spine-sfml.cpp

`Luis Mendes, I haven’t had a chance to build it for Android. Use “ls -1 > files.txt” to make a list of files to paste into the build. spine-c is plain C so should be easier to build. Of course it doesn’t use exceptions so that won’t be a problem anymore.

`Williams Piazza, your alpha transparency looks like a problem with premultiplied alpha. The left image looks correct, Spine draws many images on top of each other so if you fade them all this is how they will look. You can render to an FBO and then draw that with transparency to avoid the issue. Setting the CCSkeleton’s bounding box isn’t implemented, I didn’t notice it was needed. It can be computed by taking the min/max of each vertex for each region attachment. sometime runs nice, sometime doesn’t work
https://code.google.com/p/libgdx/wiki/GettingHelp#Problem_Statement

willyx · March 30, 2013, 5:20pm

@Williams Piazza, your alpha transparency looks like a problem with premultiplied alpha. The left image looks correct, Spine draws many images on top of each other so if you fade them all this is how they will look. You can render to an FBO and then draw that with transparency to avoid the issue. Setting the CCSkeleton’s bounding box isn’t implemented, I didn’t notice it was needed. It can be computed by taking the min/max of each vertex for each region attachment. sometime runs nice, sometime doesn’t work
https://code.google.com/p/libgdx/wiki/GettingHelp\#Problem\_Statement

bounding box is not needed, just used it to test and reported. Maybe a LOG call with “Bounding not implemented” inside the function is enought.
For the “premultiplied alpha” i’ve just run the example and that was how looks. Not as intended i suppose …

Nice for u to remove the c++ stuff, less work for u = faster release for us

NateS · April 2, 2013, 1:06am

The alpha problem is fixed.

I’ve finished rewriting the cocos2dx runtime. It now uses spine-c, the generic C runtime. The entire cocos2dx specific code is ~250 lines in a single file:

https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/src/spine/spine-cocos2dx.cpp

The API to make use of it looks like this:

https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/example/Classes/ExampleLayer.cpp#L18

Hope you guys like it!

xinjuese · April 2, 2013, 2:30am

Nathan Sweet wrote:

The alpha problem is fixed.
>
I’ve finished rewriting the cocos2dx runtime. It now uses spine-c, the generic C runtime. The entire cocos2dx specific code is ~250 lines in a single file:
>
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/src/spine/spine-cocos2dx.cpp
>
The API to make use of it looks like this:
>
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/example/Classes/ExampleLayer.cpp\#L18
>
Hope you guys like it!

Like it very much! Thanks so much!

willyx · April 2, 2013, 7:46pm

Nathan Sweet wrote:

The alpha problem is fixed.
>
I’ve finished rewriting the cocos2dx runtime. It now uses spine-c, the generic C runtime. The entire cocos2dx specific code is ~250 lines in a single file:
>
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/src/spine/spine-cocos2dx.cpp
>
The API to make use of it looks like this:
>
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/example/Classes/ExampleLayer.cpp\#L18
>
Hope you guys like it!

Tnks for the new example, now the mix is easier to learn
However now the skeletonNode->timeScale is set to 0 by default and i need to put at 1.0f to run something…
Tryed to compile my code and was all stoned

Treon · April 2, 2013, 8:45pm

Nathan Sweet wrote:

The alpha problem is fixed.
>
I’ve finished rewriting the cocos2dx runtime. It now uses spine-c, the generic C runtime. The entire cocos2dx specific code is ~250 lines in a single file:
>
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/src/spine/spine-cocos2dx.cpp
>
The API to make use of it looks like this:
>
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/example/Classes/ExampleLayer.cpp\#L18
>
Hope you guys like it!

Lovely Nathan ! Good job

NateS · April 3, 2013, 12:03am

Oops! timeScale is fixed.

Yehsam · April 3, 2013, 4:46am

@Nathan Sweet

How can i detect the animation is done?

Have any callback method when selected animation is done?

lumendes · April 8, 2013, 8:13pm

Hi, I’ve created an android project for the spine-cocos2dx example.
Just unzip it under “spine-runtimes\spine-cocos2dx\example\proj.android” modify build_native.sh to point to your NDK path and try to compile the library.
Project was created with latest cocos2dx-2.1.2 project creator, in which eclipse project contains c++ build settings and can also be compiled from there (add NDK to PATH first).
Tried it in my SGS3 and worked fine, please try it out and fix it if needed

NateS · April 8, 2013, 9:19pm

`Wei-Sung Yeh, sorry I didn’t see your post sooner. You know an animation is done when the time is >= the animation duration. If you are using AnimationState, the time is state->time. Eg, for CCSkeleton it’s “skeleton->state->time >= skeleton->state->animation->duration”.

`Luis Mendes, nice, thanks! I’ve added your project to spine-cocos2dx. Haven’t had a chance to test it though.

S74nk0 · April 13, 2013, 10:24am

Hello!
@Nathan Sweet: Spine is a great tool and we’ll be using it for sure :). I understand that the runtimes are still under development and that you are working on that. I was testing the runtime under Linux and mostly it works great, but there are a few issues:

The Goblins Example doesn’t display any skin ( even if I set the skins to goblin or goblingirl), it only displays the knife and spear as it is the default if I understand correctly.
I have checked for memory leaks with Valgrind and it reports:

Mismatched free() / delete / delete [] in spine::CCSkeleton::create(char const*, char const*, float) in Classes/spine-cocos2dx.cpp:86
Mismatched free() / delete / delete [] in spine::CCSkeleton::create(char const*, char const*, float) in Classes/spine-cocos2dx.cpp:90
32 bytes in 1 blocks are definitely lost in loss record 39 of 118 in spine::CCSkeleton::create(char const*, char const*, float) in Classes/spine-cocos2dx.cpp:88
22,122 (72 direct, 22,050 indirect) bytes in 1 blocks are definitely lost in loss record 118 of 118 in spine::CCSkeleton::create(char const*, char const*, float) in Classes/spine-cocos2dx.cpp:90
Not really an issue, but more of a feature lack, it would be nice to flip (X or Y) the skeleton (as I said I understand that it’s still under development :), and will be patient).

I also have a suggestion ( it includes more the cocos2dx community). To keep all the projects well organised it would make sense to make a static library (like chipmunk) of the spine-c runtime, in the “external” folder (where all the others are). I have done just that for Linux, will make it for Blackberry soon, but with Android I have a few issues.

With Android I’m having trouble. The example from Luis Mendes, the project builds but there is no bin folder and no apk (no binary). And the static lib approach gives me reference errors.

Sorry for the long post, and I hope I was clear and not confusing :).

NateS · April 13, 2013, 12:22pm

@Stanko Krstić, thanks for your feedback!

You’ll need to call setSlotsToBindPose() after calling setSkin. See comments on setSkin, but it only attaches images from the new skin if an attachment was there from the old skin. Since you are setting the skin for the first time, there is no old skin so setSkin doesn’t attach anything. setSlotsToBindPose sets the image for each slot to how they are in the bind pose.
Maybe I’m blind, but I don’t see why it complains?
https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-cocos2dx/src/spine/spine-cocos2dx.cpp#L82
Use skeletonNode~~>skeleton~~>flipX/Y = true. You can also setScaleX(–1) on the skeleton node.

Including static libraries would be nice, but is a lot of effort for me to do for each change. Better people just grab the source and compile themselves, which seems to be the cocos2d way.

Not sure on Android, sorry! A native Android build can be a huge pain. Anything Android can be a huge pain!

S74nk0 · April 13, 2013, 12:32pm

@Nathan Sweet: Thank you for your reply :). Next time I’ll read the documentation first and examine the code :). The memory thing doesn’t make sense to me either (I will check in to that). And the Android thing was meant for the community. I’ll play a little with that and hope to manage to get it working. You just focus on the runtimes ;). And have a nice day

NateS · April 13, 2013, 12:39pm

No worries, it’s tricky (especially setSkin) and there isn’t much (ok, any) documentation for the runtime yet.

Treon · April 13, 2013, 7:25pm

It would be really fun to see the some ragdoll effect with box2d physics, Is possible to manipulate spine bones when the animation is running?

Good job !

NateS · April 13, 2013, 7:32pm

For Box2D you’d use the skeleton and animation to position Box2D bodys. For rag doll you’d stop positioning them and let the physics take over. Here is an example of the first part (in Java):

github.com

EsotericSoftware/spine-workshop/blob/master/src/com/esotericsoftware/spine/workshop/I_Box2D.java


package com.esotericsoftware.spine.workshop;

import com.esotericsoftware.spine.Animation;
import com.esotericsoftware.spine.Attachment;
import com.esotericsoftware.spine.AttachmentType;
import com.esotericsoftware.spine.Bone;
import com.esotericsoftware.spine.Skeleton;
import com.esotericsoftware.spine.SkeletonData;
import com.esotericsoftware.spine.SkeletonJson;
import com.esotericsoftware.spine.Slot;
import com.esotericsoftware.spine.attachments.RegionAttachment;
import com.esotericsoftware.spine.attachments.TextureAtlasAttachmentLoader;

import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.backends.lwjgl.LwjglApplication;
import com.badlogic.gdx.backends.lwjgl.LwjglApplicationConfiguration;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.OrthographicCamera;

This file has been truncated. show original

Yes, you can manipulate bones at runtime and combine that with animations:

github.com

EsotericSoftware/spine-workshop/blob/master/src/com/esotericsoftware/spine/workshop/H_AnimationProcedural.java


package com.esotericsoftware.spine.workshop;

import com.esotericsoftware.spine.Animation;
import com.esotericsoftware.spine.Bone;
import com.esotericsoftware.spine.Skeleton;
import com.esotericsoftware.spine.SkeletonData;
import com.esotericsoftware.spine.SkeletonJson;

import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.backends.lwjgl.LwjglApplication;
import com.badlogic.gdx.backends.lwjgl.LwjglApplicationConfiguration;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureAtlas;
import com.badlogic.gdx.graphics.glutils.ShapeRenderer;
import com.badlogic.gdx.math.MathUtils;

public class H_AnimationProcedural extends ApplicationAdapter {

This file has been truncated. show original

lumendes · April 13, 2013, 7:34pm

Stanko Krstić wrote:

@Nathan Sweet: Thank you for your reply :). Next time I’ll read the documentation first and examine the code :). The memory thing doesn’t make sense to me either (I will check in to that). And the Android thing was meant for the community. I’ll play a little with that and hope to manage to get it working. You just focus on the runtimes ;). And have a nice day

Hi Stanko,

I provided the initial android project example, not sure if there were additional changes afterwards, I think not though.
Am not an android or programming expert so I invite anyone in the community to improve/correct the example.
The process was simple though:

generated a dummy project with cocos2dx-2.1.2/tools/project-creator
modified project, package name, etc.
modified Android.mk to include external spine-c & spine-cocos2dx sources & headers

Regarding the issues you faced, I tried now with project from repository (to exclude any diff in my local files):

Considering the cocos2dx android project (org.cocos2dx.lib) is already open in Eclipse

Eclipse ~~> File~~> Import ~~> Android~~> Existing Android Code Into Workspace
Modify build_native.sh, change NDK path
Eclipse ~~> Project~~> Build All

Build was successful, no APK generated though. Not sure if APK should generated at this step, probably just the library.
However if running the project in emulator or device APK is generated.

My setup is Windows 7, cygwin + NDK R8E.

Cheers,
Luis