Cocos2dx 3.0 Spineランタイムを最新にしてデモを表示させる

raharu(仮名)(プログラマー)
これがダイバージェンス1%の先の世界か。。。

どうやら3.1からdownload-deps.pyみたいなのがあるらしいのですが、
まだ3.0のまま使っている私です。
皆さんはバージョンいくつ使っているのでしょうか?

私、気になります!

実はデフォルトで入っているSpineは古く表示位は難なく出来るのですが、
若干のバグがあったり安定版とは言えません。

という事でSpineのランタイムを最新に更新して付属のデモを流すところまでやりたいと思います。
ご指摘等ございましたらご連絡下さいm( )m

結果はこんな感じ

ダウンロード

[https://github.com/EsotericSoftware/spine-runtimes/tree/master/spine-cocos2dx/3.0:title]

zipで落としてもgithubでやっても何でもいいですとりあえず自分のローカルに落として来れたら
こんな状態になっています。今回はデスクトップに落としてきています

f:id:raharu0425:20140522175220p:plain

ごちゃごちゃ入っていますが、Cocos2dxに組み込む時に必要なのは2つ
spine-cocos2dx
spine-c
のフォルダだけです。

テスト用にプロジェクト作成

今回は適当にspineTestというプロジェクト作成します

1
2
3
4
5
6
7
$ cocos new spineTest -p com.your_company.spineTest -l cpp -d ~/Desktop/
Runing command: new
 Copy template into /Users/raharu/Desktop/spineTest
 Copying cocos2d-x files...
 Rename project name from 'HelloCpp' to 'spineTest'
 Replace the project name from 'HelloCpp' to 'spineTest'
 Replace the project package name from 'org.cocos2dx.hellocpp' to 'com.your_company.spineTest'

色々入れていく

プロジェクトに移動します

1
$/Users/raharu/Desktop/spineTest

spineがあるフォルダまで移動

1
2
3
4
5
6
7
8
9
$ cd cocos2d/cocos/editor-support/

$ ls -la
total 0
drwxr-xr-x   5 raharu  staff   170  5 22 17:57 .
drwxr-xr-x  12 raharu  staff   408  5 22 17:57 ..
drwxr-xr-x  55 raharu  staff  1870  5 22 17:57 cocosbuilder
drwxr-xr-x  79 raharu  staff  2686  5 22 17:57 cocostudio
drwxr-xr-x  57 raharu  staff  1938  5 22 17:57 spine

このspineフォルダが古いものなのでリネームして退避させておきましょう。

1
$ mv spine spine_old

そしたらここに
spine-runtimes-master/spine-cocos2dx/3.0/src/spine/と spine-runtimes-master/spine-c/src/spine/を入れます。

1
2
3
4
5
6
7
8
$ cp -R ~/Desktop/spine-runtimes-master/spine-cocos2dx/3.0/src/spine ./
$ cp ~/Desktop/spine-runtimes-master/spine-c/src/spine/* ./spine/
$ ls spine
AtlasAttachmentLoader.c BoundingBoxAttachment.c MeshAttachment.c    SkeletonAnimation.cpp   SkeletonRenderer.cpp    SlotData.c      src
Animation.c     Attachment.c        Event.c         PolygonBatch.cpp    SkeletonAnimation.h SkeletonRenderer.h  extension.c
AnimationState.c    AttachmentLoader.c  EventData.c     PolygonBatch.h      SkeletonBounds.c    Skin.c          include
AnimationStateData.c    Bone.c          Json.c          RegionAttachment.c  SkeletonData.c      SkinnedMeshAttachment.c spine-cocos2dx.cpp
Atlas.c         BoneData.c      Json.h          Skeleton.c      SkeletonJson.c      Slot.c          spine-cocos2dx.h

2dフォルダに移動します cd cocos2d/cocos/2d/ ここにspine-runtimes-master/spine-c/include/spine をコピーします

1
2
3
4
5
6
$ cd ~/Desctop/spineTest/cocos2d/cocos/2d/
$ cp -R ~/Desktop/spine-runtimes-master/spine-c/include/spine ./
$ ls spine
Animation.h     Atlas.h         AttachmentLoader.h  BoundingBoxAttachment.h MeshAttachment.h    SkeletonBounds.h    Skin.h          SlotData.h
AnimationState.h    AtlasAttachmentLoader.h Bone.h          Event.h         RegionAttachment.h  SkeletonData.h      SkinnedMeshAttachment.h extension.h
AnimationStateData.h    Attachment.h        BoneData.h      EventData.h     Skeleton.h      SkeletonJson.h      Slot.h          spine.h

そしたらリソースのディレクトリに移動してリソースをコピーします

1
2
3
4
5
$ cd ~/Desktop/spineTest/Resources/
$ cp -R ~/Desktop/spine-runtimes-master/spine-cocos2dx/3.0/example/Resources/* ./
$ ls
CloseNormal.png     HelloWorld.png      fonts           ipad-retina     iphone-retina
CloseSelected.png   common          ipad            iphone

Classesの下に移動します

1
$ cd ~/Desktop/spineTest/Classes/

元々のAppDelegate.hとAppDelegate.cppが居ますがこれら競合するので削除しておきます。

1
2
$ rm ./AppDelegate.h
$rm ./AppDelegate.cpp

Classesの下に必要なファイルをコピーします

1
2
3
4
$ cp ~/Desktop/spine-runtimes-master/spine-cocos2dx/3.0/example/Classes/* ./
$ ls
AppDelegate.cpp     AppMacros.h     GoblinsExample.h    HelloWorldScene.h   SpineboyExample.h
AppDelegate.h       GoblinsExample.cpp  HelloWorldScene.cpp SpineboyExample.cpp

こんな感じになっているはずです。

xcodeで最新のソースを読み込ませる

xcodeを起動して先ほど追加したファイルを読み直します。

2d/spineフォルダ

f:id:raharu0425:20140523133635p:plain

editor-support/spineフォルダ

f:id:raharu0425:20140523133651p:plain

Classesフォルダ

f:id:raharu0425:20140522181852p:plain

Resourceフォルダ

f:id:raharu0425:20140522181905p:plain

Android.mkファイルの作成

上記でiOSはビルドが通ると思いますが、Androidはmakeファイルが無いためエラーで落ちます。 なのでeditor-support/spineにAndroid.mkファイルを作ります。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
LOCAL_PATH := $(call my-dir)
hnclude $(CLEAR_VARS)

LOCAL_MODULE := spine_static

LOCAL_MODULE_FILENAME := libspine

# フォルダ以下のcpp&cのファイル名をすべて入れる
LOCAL_SRC_FILES := PolygonBatch.cpp \
SkeletonAnimation.cpp \
SkeletonRenderer.cpp \
Animation.c \
AnimationState.c \
AnimationStateData.c \
Atlas.c \
AtlasAttachmentLoader.c \
Attachment.c \
AttachmentLoader.c \
Bone.c \
BoneData.c \
BoundingBoxAttachment.c \
Event.c \
EventData.c \
extension.c \
Json.c \
MeshAttachment.c \
RegionAttachment.c \
Skeleton.c \
SkeletonBounds.c \
SkeletonData.c \
SkeletonJson.c \
Skin.c \
SkinnedMeshAttachment.c \
Slot.c \
SlotData.c \
spine-cocos2dx.cpp

LOCAL_EXPORT_C_INCLUDES := $(LOCAL_PATH)/..

LOCAL_C_INCLUDES := $(LOCAL_PATH)/../../2d \
$(LOCAL_PATH)/..

LOCAL_CFLAGS += -Wno-psabi
LOCAL_EXPORT_CFLAGS += -Wno-psabi

LOCAL_WHOLE_STATIC_LIBRARIES := cocos2dx_static

include $(BUILD_STATIC_LIBRARY)

$(call import-module,2d)

使用する場合はproj.android/jni/Android.mkに追加

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
~~~~~~


LOCAL_WHOLE_STATIC_LIBRARIES += box2d_static
LOCAL_WHOLE_STATIC_LIBRARIES += cocos_extension_static

# 追加
LOCAL_WHOLE_STATIC_LIBRARIES += spine_static

~~~~~~

$(call import-module,extensions)

# 追加
$(call import-module,editor-support/spine)

以上になります。

Cocos2dx 3系の安定版が出る事を切に願って居ます!お願いします!お願いします!