Find file History
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
resources Adding composer sample, new README Jan 7, 2019
CreaturePackDraw.js Adding ability to manually set mesh color overrides if metaData is lo… Jan 3, 2019
CreaturePackDraw.js.meta Adding new CocosCreator Experimental Sample Dec 26, 2018
CreaturePackDrawAssembler.js VBO rendering fix Dec 26, 2018
CreaturePackDrawAssembler.js.meta Adding new CocosCreator Experimental Sample Dec 26, 2018
CreaturePackMeta.js SkinSwap support for CocosCreator, more to follow Dec 28, 2018
CreaturePackMeta.js.meta Starting to add support for CreatureMetaData ( Skinswap ) for CocosCr… Dec 27, 2018
CreaturePackModule.js SkinSwap support for CocosCreator, more to follow Dec 28, 2018
CreaturePackModule.js.meta Adding new CocosCreator Experimental Sample Dec 26, 2018
CustomIA.fire Adding new CocosCreator Experimental Sample Dec 26, 2018
CustomIA.fire.meta Adding new CocosCreator Experimental Sample Dec 26, 2018
README.md Adding composer sample, new README Jan 7, 2019
base64.js Updating with base64 library Dec 31, 2018
base64.js.meta Updating with base64 library Dec 31, 2018
cocos_creator1.png Adding images Jan 6, 2019
cocos_creator2.png Adding images Jan 6, 2019
fox2x.creature_pack Making it work with Wechat Game Engine. All creature_pack assets need… Dec 29, 2018
fox2x.creature_pack.meta Making it work with Wechat Game Engine. All creature_pack assets need… Dec 29, 2018
msgpack.js Making it work with Wechat Game Engine. All creature_pack assets need… Dec 29, 2018
msgpack.js.meta Adding new CocosCreator Experimental Sample Dec 26, 2018
resources.meta VBO rendering fix Dec 26, 2018
skinSwap2x.creature_pack Making it work with Wechat Game Engine. All creature_pack assets need… Dec 29, 2018
skinSwap2x.creature_pack.meta Making it work with Wechat Game Engine. All creature_pack assets need… Dec 29, 2018
test.fire Updating with base64 library Dec 31, 2018
test.fire.meta VBO rendering fix Dec 26, 2018

README.md

CreaturePack for Cocos Creator

This folder contains files for running CreaturePack in Cocos Creator. This enables you to publish games with the Creature Animation Tool for the various HTML5 and Native Mobile platforms Cocos Creator supports. The CreaturePack plugin is also Wechat Mini Game Engine ready.

Alt text

A full writeup on the process can also be found here.

Overview

This is a sample to show you how to load and run your CreaturePack characters in CocosCreator.

Installation

Please drag/copy all the js files in this repository into your Cocos Creator project. Make sure the relevant meta files are created for the plugin script files to be recognized by the system. Also make sure the character atlas image files as well as converted to text CreaturePack assets + MetaData files are in the resources folder of your project.

Usage

Convert your Creature Pack assets to b64 Text Encoding

This is very important! Please either do this yourself or run the provided b64Encode.py in the main WebGL runtimes directory.

Usage: python b64Encode.py <yourCreaturePack.creature_pack> <outputFile.txt>

So for example if you have a Creature Pack file asset called myCharacter.creature_pack, you will run:

python b64Encode.py myCharacter.creature_pack myCharacter.creature_pack.txt

You will need python3 installed for the conversion script to run. Please make sure the converted file has the .txt extension so that Cocos Creator can recognize it.

MetaData renamed to JSON extension

To make your metaData recognizable by Cocos Creator, also rename your MetaData file to a file with a .json extension.

Setup and Run

Now go into Cocos Creator:

( First, make sure all your assets are in the resource folder of your game project )

  1. Create an Empty Node in your Cocos Creator scene

  2. Drag this CreaturePackDraw as as component into your node

Alt text

  1. Assign the CreaturePack b64 encoded text asset into the Creature Pack Asset slot

  2. Assign your character atlas png file to the Char Texture slot

  3. Optionally, assign the meta data ( please rename with a .json extension ) to the Meta Data Asset slot if you want SkinSwapping

Scripting Details

Controlling the character ( Animation Switching, Skin Swaps etc. )

CreaturePackDraw.js is the file that contains most of the important object handles to controlling your character. In particular, there is the following object in the main class:

this._packRenderer

This is a creaturepack.CreatureHaxeBaseRenderer which allows you to perform most animation game related operations on your character.

Switching Animations

To switch to an animation directly, call:

this._packRenderer.setActiveAnimation("MyNewAnimation");

To switch with blending, call:

this._packRenderer.blendToAnimation("MyNewAnimation", blendDelta);

where blendDelta is 0 < value < 1.0 . We recommend a value of 0.1 to get started.

SkinSwap

You can directly call CreaturePackDraw's method:

switchToSkin("MyNewSwap");

to switch to a new available skinSwap. Take note you will need to have your metaData slot connected for skinSwapping to work.

Changing Mesh Region Colors

You can dynamically set and change mesh region colors via:

setMeshColorOverride("MyMeshRegion", 0.5, 0, 0, 1.0);

This will change your mesh region called MyMeshRegion with RGBA values of (0.5, 0, 0, 1.0). Take note the value ranges are from 0 to 1.0.

Character Scaling Size Implmentation

Pay attention to the onLoad() method where we load our characters into the game. You can alter how the character is scaled with respect to your width/height settings by taking a look at the charScale variable in _updateVertexData() and seeing how it is applied.

Publishing CreaturePack for the Wechat Mini Game Platform

This plugin is ready for the Wechat Mini Game Platform. Once setup, please follow the instructions outlined here to publish for that platform.