tuo-scene的TuoObject2D对象

由于之前对3维附属2维对象和3维附属DOM对象的设计不太满意,由其是面向单场景多视图的架构时,会导致构造2维渲染的逻辑特别复杂。因此,我们构造了TuoObject2D对像来实现tuo-scene系统的2维渲染。在整个系统中,TuoObject2D是与Object3D平等的存在,TuoObject2D对象也能够独立的加入到TuoScene场景中。即通过TuoScene.add和TuoScene.remove来添加和移除。

每一个TuoObject2D对象必须实现一个自己的create函数,此函数返回一个如下架构的对象:

{
twoObject: Object, //two.js对象
dom: Object, //dom元素
project2D: Object, //TuoFunctionNode对象
}

TuoFunctionNode对象的apply函数是非常重要的,在这个函数中必须做2个事情,第一更新相应towObject中的坐标数据;第二,更新dom的位置。

create函数接收1个参数:view。这个参数由当前场景拥有的各个视图来传递给它。

TuoScene对TuoObject2D对象的反应

TuoScene只需要在两个场合下对TuoObject2D对象作出反应即可:

  1. 调用TuoScene.add函数添加TuoObject2D对象时,TuoScene会把当前的TuoObject2D对象存如object2DSet中。并发布如下格式的消息
    {
    type: 'tuoObject2DAdded',
    payload: {
    object: TuoObject2D
    }
    }
  2. 调用TuoScene.remove函数移除TuoObject2D对象时,TuoScene会把指定的TuoObject2D对象从object2DSet中移除。并对该对象调用TuoObject2D.dispose()函数。

TuoView对TuoObject2D对象的反应

TuoView需要在3个场合下对TuoObject2D对象作出反应

  1. TuoView被创建后第一次调用render函数做渲染时。此时TuoView需要检查相关TuoScene中的object2DSet是否为空,如果不为空,则需要对每一个TuoObject2D对象调用wrapCreate函数,获取create函数的返回值,并将返回值的数据,按对应关系,添加到自己的twoScene, controlDiv和project2DRoot中去。
  2. 当收到相对应的TuoScene发布的tuoObject2DAdded消息时,应该调用该消息中TuoObject2D的wrapCreate函数,获取create函数的返回值,并将返回值的数据,按对应关系,添加到自己的twoScene, controlDiv和project2DRoot中去。
  3. 在自己的每一次render函数渲染中,需要按以下顺序分别执行渲染运算:1. 先调用一遍所有project2DRoot的子元素的apply函数;2. 渲染twoScene;

发表评论

邮箱地址不会被公开。 必填项已用*标注