在TWaver3D编辑器的设计中,借助于ModuleManager实现了模块(module)的动态加载,这样用户可以自定义扩展3D模板,用于增加可编辑对象,提高编辑器能力。那么如何来扩展这些模板呢,让我来带领大家认识一下Editor的动态module应用机制。在TWaver3D产品包中,发布出两个模板模块,分别命名为room和equipment。这两个模块分别完成房间模型,设备模型的模板置入,Editor加载了这两个模块之后,就会出现下面的模型分组,用户可以从分组中拖拽出自己期望的模型对象到编辑场景中去,实现3D场景的可视化编辑。但是在实际应用的时候,用户需要用更多的模型模板来做场景编辑,例如新的设备,新的房型等,这时能不能由用户进行模型模板的扩展呢?例如客户需要向设备上添加一个信号灯对象,那么如何把这种模型模板添加到TWaver的3D编辑器中?首先,用户需要打开IDE环境,创建一个module文件。(以FlashBuilder为例) 我们将之命名为Signal.mxml,然后,需要在开发工程中引入必要的开发包,TWaver提供3个必要的包,分别是TWaver.swc, TWaver3D.swc和 EditorLib.swc。 这样我们就可以按照Editor的动态模块机制来进行自己的扩展了。下面我们就来开始自己扩展一个模块,用于向Editor中注入信号灯模型。第一要求实现EditorLib中定义的一个接口IResources。向我们生成的Signal.mxml文件头中添加implements=”module.IResources”
1
<?xml version=
"1.0"
encoding=
"utf-8"
?>
2
<mx:Module xmlns:fx=
"http://ns.adobe.com/mxml/2009"
3
xmlns:mx=
"library://ns.adobe.com/flex/mx"
layout=
"absolute"
implements
=
"module.IResources"
>
4
5
</mx:Module>
IResources的定义如下
01
public
interface
IResources{
02
//初始化函数。模块被加载后,自己需要执行的初始化动作
03
function init():
void
;
04
//模块名
05
function getName():String;
06
07
function getInfo():String;
08
//模型需要的贴图集合,以key-value的映射方式进行存储
09
function getImages():Object;
10
//模块中包含的全部的模型对象的描述
11
function getItems():Array;
12
//。
13
function exportClasses():Array;
14
}
然后我们来做实现代码
width=
"400"
height=
"300"
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import
extentdata.SignalData;
extentdata.XYData;
module.ResourcesConsts;
module.ResourcesItem;
[Embed(source=
"demo/images/signal.png"
)]
15
static
const
SignalIcon:Class;
16
17
{
18
19
function getName():String
20
21
return
"信号灯资源包"
22
23
function exportClasses():Array{
24
[extentdata.SignalData];
25
26
function getImages():Object
27
28
var classInfo:XML=describeType(Signal);
29
var imageMap:Object=
new
Object();
30
for
each (var c:XML in classInfo..constant)
31
32
var name:String=c.
@name
33
imageMap[name]=Signal[name];
34
35
imageMap;
36
37
function getXYItems():Array
38
39
var array:Array=
Array();
40
var item:ResourcesItem=
ResourcesItem();
41
//用于在Editor的属性表中绑定模型对象的属性,可以无限增加
42
item.addModelProperty(
"width"
,
"直径"
);
43
"altitude"
"深度"
44
//指明信号灯对象默认的大小
45
item.length=
46
item.width=
47
item.height=
48
//填充的信号灯模型所属的分组名
49
item.category=
"信号灯"
50
//在模型模板分组中用来表示信号灯的图片
51
item.icon=
"SignalIcon"
52
//在模型模板分组中,信号灯对象的tooltip
53
item.tooltip=
54
item.name = item.tooltip;
55
//用来表示模型对象的数据类型
56
item.clazz = extentdata.SignalData;
57
//需要通过Editor进行配置的client property,可以无限增加
58
item.addClientProperty(
"bid"
"BID"
59
//声明模型对象在xy平面上进行操作
60
item.type=ResourcesConsts.TYPE_XY;
61
array.push(item);
62
array;
63
64
function getItems():Array
65
66
67
array=array.concat(getXYItems());
68
69
70
]]>
71
</fx:Script>
72
然后我们就可以在IDE下编译我们写的这个新module了,打包称为Signal.swf。接着把这个swf文件放在Editor.swf的同目录下,就可以直接加载了。加载成功之后,就会在模型模板库中看到新添加的信号灯对象。这时我们就可以直接在编辑器中使用信号灯,向原有模型中添加了信号灯对象了。让我们来看看添加信号等前后的不同–>
添加完信号灯,就可以将图纸保存出来。在监控系统中,加载这个图纸,通过程序可以找到信号灯对象,然后根据采集到的数据,动态修改信号灯的颜色,就可以实现实时显示监控信息了。注:本文中用到的相关扩展文件可以在TWaver 3D产品下载包中获取,另外例子的完整代码可以从这里下载。扩展module代码
Powered by: BlogJava Copyright © TWaver