基于Flex的Web流程设计器开发第二季---Tabbed Properties View

第一季回顾
基于Flex的Web流程设计器开发第一季。
在08年四月份采用Flex开发完成了Web流程设计器第一个版本。具体请参见开篇的链接。这个版本的Web流程设计器的属性页采用的是HTML页面，当初主要考虑采用HTML属性页易于与业务系统的页面进行集成。HTML属性页虽然有易于集成的优点，但缺点太多。具体缺点如下：

• 与流程设计器整体风格不一致，用户体验差；
• 代码复杂，不易于维护；
• JavaScript存在浏览器兼容问题；
• 运行效率低；

综上原因，对属性页进行改良势在必行。

Tabbed Properties View
通过回顾第一季，已经认知到HTML属性的不足，那么如何改进呢？在这里又要再次感谢Eclipse开源组织，因为Eclipse平台提供了Tabbed Properties View。在Eclipse版本的流程设计器中，属性页就采用了Tabbed Properties View。Tabbed Properties View不但布局美观，而且表现丰富，更重要的是可以按需灵活配置。所以萌发了用Flex实现一套Tabbed Properties View的想法。
语言总是枯燥的，我们还是上图吧。
Web流程设计器第二季全景如下图所示。

希望这张能清晰点。


Flex Tabbed Properties View 设计思路
Flex Tabbed Properties View 实现参考了Eclipse Tabbed Properties View 的设计思路。但对其进行了精简，因为Flex Tabbed Properties View 只需要满足流程设计器自己的需求就可以。
Flex Tabbed Properties View 的设计目标是可以灵活的对属性页进行组装。构成属性页最小单元工件为Tab页
看看效果，开始节点属性只有一个Tab页构成。

手动节点属性页由五个Tab页构成。

用一句话来说设计思路---在配置文件中存储属性页配置信息，在运行期用反射进行控件初始化，然后进行属性页组装。

经验总结
在开发中遇到的问题，可能也不都是Flex的缺陷，也有可能是我的用法有问题，和大家交流下。

• Flex的反射存在缺陷，不支持如Java那样根据类名生成实例对象。
• ComboBox控件要慎用，它在初始化data provider时，会触发Selection Change事件。
• RadioGroup控件也存在缺陷，在RadioGroup初始化完成前，无法check其中某个radio。

因为保密协议的存在，我只能能谈谈设计思路，希望对读者有益。

评论

7 楼 zhangchunlailai 2012-09-05  

程序员要打破门户之见，共享源码。[e-mail]

6 楼 liufeng_4466 2012-08-23  

您好，看了您的这篇文章，对我很有启发，能不能发一套源码给我。谢谢
[e-mail]

5 楼 liuhaoyi490 2011-03-22  

效果很不错,以前怎么没发现呢
这是我自己做着玩的，刚写完一个内核，多提宝贵意见
http://liuhaoyi490.iteye.com/admin/blogs/941550

4 楼 edi 2010-01-04  

潜心修炼 写道

引用

Flex的反射存在缺陷，不支持如Java那样根据类名生成实例对象

建议看一下这个文章 http://www.ibm.com/developerworks/cn/web/0908_liuqing_flex_reflect/index.html

当时没有深入研究这个问题，只记得需要先声明。多谢指点。

3 楼 潜心修炼 2009-12-06  

引用

Flex的反射存在缺陷，不支持如Java那样根据类名生成实例对象

建议看一下这个文章 http://www.ibm.com/developerworks/cn/web/0908_liuqing_flex_reflect/index.html

2 楼 zdonking 2009-08-01  

这个，设计器源码能共享吗？

1 楼 iceawake 2009-05-14  

想回复实在是太难了……被“言行拷问”了好多版规
看见楼主新鲜出炉的文章，我终于忍不住潜水多年回帖了
我09年下半年的计划是用FLEX写个工作流编辑器，没想到水这么深，我的初衷只是学习flex，看来想完成这个计划要学的东西多了去了，向楼主致敬
我也是大连的，等我脱离了初级水平，有上点档次的问题时候一定请教你