[Cocos2d-x 환경 및 도구]creator_to_cocos2dx 플러그인

• creator_to_cocos2dx 플러그인
  Cocos Creator는 효율적으로 씬과 UI를 편집할수 있고 JavaScript가 지원됩니다.
  이것은 JavaScript개발자에겐 좋은소식이지만 C++/Lua개발자에겐 곧바로 Creator를 사용할수 없어서 아쉽다.
• 이런 아쉬움을 해결하고자 우리는 creator_to_cocos2dx 플러그인을 제공한다.
  이것은 개발자가 Creator가 Cocos2d-x의 C++/Lua환경에서 사용할수 있게 해준다.
  플러그인의 로직은 크게 두부분으로 나뉜다.
  

Creator플러그인	Creator에서 만든 씬을 .ccreator파일로 출력한다.
2.reader	C++/LUA 환경에서 .ccreator파일을 해석한다.

 

특성

플러그인 요구사항은 Cocos2d-x v3.14+,Creator 버전 v1.4+이다.

Creator는 컴포넌트 기반의 모델로 객체를 생성하지만 Cocos2d-x는 객체마다 자기자신의 구조를 가진다.

때문에 플러그인은 Creator의 전체 특성을 지원하긴 어렵다.

아래는 현재 지원하는 특성이다.

Node	Node	Node	Node	Node
Scene	Sprite	Canvas	ScrollView	Label
EditBox	ParticleSystem	TiledMap	Button	ProgressBar
RichText	SpineSkeleton	Widget	Animations	VideoPlayer
WebView	Slider	Toggle	ToggleGroup	PageView
Mask	Collider	Prefab	DragonBones

사용하면서 어떤특성이 지원되지 않는다면 Cocos2d-x와 Creator를 업그레이드하는것이 해결방법중 하나일것이다.

 

프로그램 설치

Cocos Creator에서 creator_to_cocos2dx플러그인을 추가한다:

•  GitHub 레포지토리에서  Creator To Cocos2d-x 프로젝트를 Clone한다.
• 플러그인을 다운받은 디렉토리에서 creator_project/packages/creator_luacpp_support를 Creator프로젝트의 packages디렉토리로 복사한다.
• 
• Creator로 방금 추가한 플러그인 프로젝트를 열고 Project-> LuaCpp Support 메뉴를 선택한다

Creator 장면 내보내기

플러그인을 사용하여 장면 내보내기:

• Project -> LuaCPP Support -> Setup Target Project 항목을 클릭하고 대화상자의 Project Path 를 Cocos2d-x의 프로젝트 경로로 설정한다.
• 
• Build를 클릭하면 빌드가 될것이다.
• Cocos2d-x프로젝트를 컴파일하기전에 다시 Build를 해야한다.Build가 완료되면 reader코드와 Creator리소스는 아래경로에 위치한다.
• C++ 프로젝트：
  reader코드： NATIVE_PROJECT_ROOT/Classes/reader
  리소스： NATIVE_PROJECT_ROOT/Resources/creator
• LUA 프로젝트：
  reader코드：NATIVE_PROJECT_ROOT/frameworks/runtime-src/Classes/reader
  리소스：NATIVE_PROJECT_ROOT/frameworks/runtime-src/Resources/Creator
  NATIVE_PROJECT_ROOT는  Build할때 설정하는 Project Path경로이다.

 

내보내기 옵션

• Export Resource Only,
• 플러그인에 포함된 reader코드를 포함시키지 않는다.Creator의 씬과 관련된 리소스만 내보낸다.이방식은 두번째 추출때 새로만든 reader코드가 프로젝트에 존재하는 reader파일에 덮어씌워지는것을 막을수 있다.
• Export Resource Dynamically Loaded,
• 동적으로 로딩될수 있는 리소스도 같이 추출한다.Creator의 리소스 사용규범에 따라서 동적으로 로딩될수 있는 리소스는 resources디렉토리에 추출된다.디폴트 추출옵션은 Creator씬에서 정적으로 사용되는 리소스파일만 추출한다.
• Auto Build After Scene Saved
• Creator에서 씬을 저장하고 난후 백그라운드에서 플러그인을 실행한다.패널의 설정에 따라 추출을 진행한다.이방법을 통해서 개발자들은 플러그인에서 실행하는 추출과정을 간략화 할수있다.

 

Cocos2d-x프로젝트 읽어오기

위에서 추출을 완료하고 reader코드와 Creator리소스모두 파일시스템에 놓여져 있다.

이때 당신은 이파일들을 사용하여 프로젝트에 추가할수 있다.

 

헤더파일 탐색경로 추가하기

아래의 디렉터리들을 프로세스의 헤더파일 탐색경로에 추가해야 한다.

C++프로젝트는:

```sh

reader

```

Lua 프로젝트는：

```sh

reader

reader/collider

reader/animation

reader/dragonbones/cocos2dx

reader/dragonbones/armature

reader/dragonbones/animation

reader/dragonbones/events

reader/dragonbones/factories

reader/dragonbones/core

reader/dragonbones/geom

```

 

Android 플랫폼에서의 특별한 처리

Android플랫폼의 헤더파일 탐색경로추가방법은 좀 특별하다.

Android.mk를 수정해주어야 한다.

아래의 예시를 따라서 다음을 include 파일을 추가하라.

 

C++프로젝트：

```sh

LOCAL_STATIC_LIBRARIES += creator_reader

# _COCOS_LIB_ANDROID_BEGIN

# _COCOS_LIB_ANDROID_END

$(call import-module, ./../../Classes/reader)  # import module path

```

Lua프로젝트：

```sh

# for lua

include $(CLEAR_VARS)

LOCAL_MODULE := creator_reader_lua

LOCAL_MODULE_FILENAME := libcreatorreaderlua

LOCAL_ARM_MODE := arm

LOCAL_SRC_FILES := $(cpp_src) \

lua-bindings/creator_reader_bindings.cpp \

lua-bindings/reader/lua_creator_reader_auto.cpp \

lua-bindings/reader/lua_creator_reader_manual.cpp \

lua-bindings/dragonbones/lua_dragonbones_manual.cpp \

lua-bindings/dragonbones/lua_dragonbones_auto.cpp

LOCAL_STATIC_LIBRARIES += creator_reader_lua

# _COCOS_LIB_ANDROID_BEGIN

# _COCOS_LIB_ANDROID_END

$(call import-module, ./../../Classes/reader)

```

 

씬을 읽어오기

위의 작업을 완료하면 코드를 추가하여 Creator에서 추출한 씬을 사용할수 있다.사용방법은 아래와 같다.

C++프로젝트:

// mygame.cpp

#include "reader/CreatorReader.h"

void some_function()

{

    creator::CreatorReader* reader = creator::CreatorReader::createWithFilename("creator/CreatorSprites.ccreator");

// will create the needed spritesheets + design resolution

    reader->setup();

// get the scene graph

    Scene* scene = reader->getSceneGraph();

// ...and use it

    Director::getInstance()->replaceScene(scene);

}

 

Lua프로젝트：

• reader binding 을 regist하기:

  #include "reader/lua-bindings/creator_reader_bindings.hpp"

 

...

 

register_creator_reader_manual(L);

• 내보낸 장면을 사용하기위한 코드 추가
    local creatorReader = creator.CreatorReader:createWithFilename('creator/CreatorSprites.ccreator')
    creatorReader:setup()
    local scene = creatorReader:getSceneGraph()
    cc.Director:getInstance():replaceScene(scene)

 

ColliderManager를 사용하는 방법

우리가 ColliderManager 객체를 제공하여 충돌을 관리해왔다.

씬마다  ColliderManager 인스턴스가 존재하고 이 인스턴스를 사용하여 충돌을 감지할수 있다.

creator::CreatorReader* reader = creator::CreatorReader::createWithFilename("creator/CreatorSprites.ccreator");

// will create the needed spritesheets + design resolution

reader->setup();

// get the scene graph

Scene* scene = reader->getSceneGraph();

auto colliderManager = scene->getColliderManager();

colliderManager->registerCollitionCallback([=](creator::Contract::CollisionType type, creator::Collider* collider1, creator::Collider* collider2) {

        if (type == creator::Contract::CollisionType::ENTER)

            colliderManager->enableDebugDraw(true);

if (type == creator::Contract::CollisionType::EXIT)

            colliderManager->enableDebugDraw(false);

}, "");

 

더많은 ColliderManager 특성을 알고싶으면 ColliderManager.h 를 참조하라.

출처: <http://cocos2d-x.org/docs/cocos2d-x/zh/editors_and_tools/creator_to_cocos2dx.html>