How to fix Rendering for Creature runtimes in latest version

Hello,

With the new upgrade to the latest Cocos Creator, the plugin is now broken/no longer works. Can I understand why this happened and how should I got about fixing the rendering system? It seems like there was a revamp of the Cocos Creator rendering system which broke the way things are rendered?

I have my render/draw object defined as so:

The input assembler is created above on line 241 with the appropriate Vertex and Indexbuffers.

The assembler is here:

Basically the method to render a 2D deforming mesh ( points, indices, uvs ) is broken in the code above after your latest update.
So advice will be appreciated.

Thanks

@jare, please meet Jiayi, the author of the Amazing software, Creature. Can you help?

Hi, @kestrelm, Thanks for port Creature to Cocos Creator.
It seems the creature runtime is based on Cocos Creator 2.0.x version.

Here are some advice to upgrade to Cocos Creator 2.2.x:

  1. Material was reimplement as an asset, there was no renderEngine.SpriteMaterial any more.
let material = cc.Material.getInstantiatedBuiltinMaterial('sprite', renderComponent);
material.setProperty('texture', this.charTexture);
renderComponent.setMaterial(index, material);
  1. Upgrade assembler to something like this:
class CreatureAssembler extends cc.Assembler {
  fillBuffers (comp, renderer) {
    // first flush batched commands
    renderer._flush();

    // update render states before flush
    renderer.material = comp._materials[0];
    renderer.node = comp.node;
    renderer.cullingMask = comp.node._cullingMask;

    // flush ia directly
    renderer._flushIA(comp._ia);
  }
}

// register assembler to render component
cc.Assembler.register(CreatureComponent, CreatureAssembler);
2 Likes

Hello, @jare @jyinkailej
I tried what you suggested but am getting the following errors:

assembler.js:36 Can not find assembler for render component : [CreaturePackDraw]

render-flow.js:75 Uncaught TypeError: comp._assembler.updateRenderData is not a function
at RenderFlow.251._proto._updateRenderData (render-flow.js:75)
at RenderFlow.251._proto._worldTransform (render-flow.js:49)
at RenderFlow.251._proto._localTransform (render-flow.js:29)
at RenderFlow.init [as _func] (render-flow.js:188)
at RenderFlow.251._proto._children (render-flow.js:112)
at RenderFlow.251._proto._color (render-flow.js:61)
at RenderFlow.251._proto._opacity (render-flow.js:58)
at RenderFlow.251._proto._worldTransform (render-flow.js:49)
at RenderFlow.251._proto._localTransform (render-flow.js:29)
at RenderFlow.251._proto._children (render-flow.js:112)

It looks like it has something to do with the assembler. I am confused as to what I need to do to resolve this. It seems that I need to somehow assign the assember to the CreaturePackDraw ( which extends the RenderComponent ) ?

You examples are not clear how to do this. I tried the following and the same errors all get thrown:

__preload () {
    this._assembler = CreatureAssembler; // Tried this did not work
    //this._resetAssembler(); // Tried this from your examples also did not work
},

I have my assembler defined as:

let CreaturePackDraw = require('./CreaturePackDraw');

class CreatureAssembler extends cc.Assembler {    
    fillBuffers (comp, renderer) {
      // first flush batched commands
      renderer._flush();
  
      // update render states before flush
      renderer.material = comp._materials[0];
      renderer.node = comp.node;
      renderer.cullingMask = comp.node._cullingMask;
  
      // flush ia directly
      renderer._flushIA(comp._ia);
    }
  }
  
  // register assembler to render component
  cc.Assembler.register(CreaturePackDraw, CreatureAssembler);
  module.exports = CreatureAssembler;

What should I be doing here to fix this?

Thanks

Hello,

Nevermind I think I got it working:

Will obviously need more testing but I figured most of the tricky caveats out. You can get the latest Creature runtimes updated for Cocos Creator 2.2 here:

Demo here:

Cheers

1 Like