`
hbhgjiangkun
  • 浏览: 100690 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

写了一个Flex的web流程设计器原型系统 .

 
阅读更多
花了三周时间,给公司写了一个基于Flex的web流程设计器原型系统。既然是原型系统,肯定有很多细微之处不完善的,但作为未来产品组件一部分,其预研和构架部分,还是拿得出手的。

Flex本身在图形化方面提供了很良好的支持,但是要想实现Model与视图的分离、Command的处理等基础事情,这个就无法与Eclipse GEF比了。

于是首先不得不模拟GEF,在底层提供一套Model-EditPart的MVC构架,以及Command Framework框架。这两个基本框架一搭建,就可以很好的解决“Model”、“View”、“Action”之间的响应和处理,以及图形的显示和渲染。

改天有时间,把这套构架的思路和实现,与大家分享一下,先show一下图片吧:



拖拽本身其实并不复杂,主要如何解决Model与View之间的映射和响应,这个是最主要关键。同时,在Pallete中的Activity图标和类型是要能够很容易扩展的。



所有的Model都需要实现toXML和fromXML接口,这样就可以很容易实现对象与xml的映射。当然,Model本身也需要引入一些Listener机制,让视图和其他编辑组件,可以在Model更改后响应变化。



对于属性Panel,原本是设计成“动态配置化加载”的,没想到,Flex本身对动态加载Class竟然支持的不理想,造成这一块没法良好的实现,寒。

分享到:
评论

相关推荐

    Flex3.Style.Explorer.V3.0.Beta

    总的来说,Flex3.Style.Explorer.V3.0.Beta为Flex开发者提供了一个宝贵的资源,帮助他们更好地掌握Flex 3的样式系统,提升富互联网应用程序的设计质量和用户体验。通过实践和实验,开发者能够熟练运用这些技巧,创造...

    采用flash开发的工作流设计器及其源代码

    而"flex流程设计器代码.rar"可能是另一个不同版本或更复杂实现的设计器。这些源代码可以帮助学习者深入理解如何使用Flex的MXML和ActionScript编写工作流逻辑,以及如何与后端服务进行通信,实现流程的保存和执行。 ...

    总后台原型图html.zip

    【总后台原型图html.zip】是一个包含HTML文件的压缩包,通常用于展示和测试Web应用程序的后台管理系统的设计和布局。这种原型图是开发者、设计师和产品经理之间交流的重要工具,它预览了用户界面(UI)和用户体验...

    RIA Flex and J2EE - DLowe.pdf

    为了进一步研究Flex与J2EE的整合效果,作者设计了一个原型系统,并对其进行了详细的分析。 - **Requirements**:根据业务需求定义了原型系统的需求规范。 - **Design Details**:详细阐述了系统的架构设计、组件...

    几大原型软件开发对比

    Axure之类多是基于页面的原型设计,对于web网站尽管很实用,但是对于软件界面的流程设计却略显繁琐。而GUI Design Studio却另辟蹊径,直接以建立元素与元素之间的关联的方式来自动化的创建动作流程,从视频演示来看...

    Flex3 developer guide

    - **版本历史**:作为Flex系列的一部分,Flex3是其发展过程中的一个重要版本,相较于之前的版本,在性能优化、用户界面设计等方面进行了显著提升。 #### 二、Flex3许可与版权 - **许可协议**:根据提供的部分内容,...

    基于FPGA和Flex技术的远程虚拟扫频仪的研究.pdf

    FPGA(现场可编程门阵列)是一种可以通过编程来配置的半导体器件,其内部逻辑功能可以根据需要进行定制,被广泛应用于复杂电子系统的原型设计和生产制造。利用FPGA进行直接数字频率合成(Direct Digital Frequency ...

    Flex4AS3的Fireworks源文件

    Flex4 AS3是Adobe Flex框架的一个版本,它主要基于ActionScript 3编程语言,用于创建富互联网应用程序(RIA)。在本资源中,我们拥有的是使用Adobe Fireworks创作的源文件,专门针对Flex4 AS3中的弹出窗口(popwin)...

    web专题-网页版登录注册系统

    在本项目中,我们主要探讨的是“Web专题-网页版登录注册系统”,这是一个基础的前端...这样的系统对于任何想要进入Web开发领域的初学者都是一个很好的起点,同时对有经验的开发者来说也是一个快速搭建原型的好工具。

    flex4 spring3 hibernate3 示例下载

    标题中的“flex4 spring3 hibernate3 示例下载”表明这是一个关于使用Adobe Flex 4、Spring 3和Hibernate 3这三种技术的...对于有经验的开发者来说,这个示例也是一个很好的参考,可以快速搭建一个功能完善的原型系统。

    Flex 3 CookBook 简体中文

    例如,一个 `<mx:Button>` 标签在MXML中定义了一个按钮,而相应的ActionScript代码可以创建按钮实例,设置其属性和响应事件。 MXML文件可以通过`<mx:Script>`标签嵌入ActionScript代码,但ActionScript文件不能包含...

    移动端的携程网静态首页制作,采用flex布局

    在移动端的网页设计中,携程网的静态首页制作是一个典型的示例,它涉及到现代Web开发中的许多关键技术和最佳实践。本项目主要采用Flex布局来实现响应式设计,以确保页面在不同尺寸的移动设备上都能呈现出良好的用户...

    最新Element-Components-v2.1.0.rplib

    Element-Components-v2.1.0.rplib 是一个专为Axure设计的组件库,它包含了一系列基于Element UI框架的交互元素,适用于快速构建原型设计。这个组件库的版本为v2.1.0,意味着它可能包含了最新的更新和改进,以提供更...

    HTML+CSS+JS网页设计期末课程大作业 DW个人博客网站制作 web前端开发技术 web课程设计 网页规划与设计

    `用于定义一个网格容器。 - **响应式设计**: 使用媒体查询(Media Queries)来适应不同屏幕尺寸和设备,通过设置不同的CSS规则,让网页在手机、平板和桌面电脑上都有良好的显示效果。 #### 3. **JavaScript增强功能...

    源码免费课程下载

    结合Flex客户端,可以实现一个完整的聊天室系统: 1. **服务器端配置**:安装配置Red5服务器,设置必要的权限和安全措施。 2. **客户端开发**:使用Flex进行前端开发,包括用户界面设计、连接服务器逻辑实现等。 3....

    2011二月百度web前端笔试面试题目(一面二面).pdf

    Web前端开发是构建互联网应用程序和网站的关键组成部分,它涉及到用户界面的设计、交互、性能优化等多个...总的来说,Web前端开发是一个涵盖广泛领域且不断进化的专业,需要持续学习和实践,才能跟上行业发展的步伐。

    前端技术学习路线图.pdf

    前端技术学习路线涵盖了前端开发的多个核心领域,以下是详细的知识点梳理: 1. HTML/CSS基础:学习HTML标记语言的结构,包括各种标签的使用方法和语义化,以及CSS的基础知识,如选择器、盒模型、布局和样式设计。 ...

Global site tag (gtag.js) - Google Analytics