Flex技术设计(精选8篇)
Flex技术设计 篇1
基于B/S架构的瘦客户端的出现,解决了C/S架构下客户端程序发布与维护的困难和繁琐问题。但由于HTTP协议的无状态特性,传统的WEB页面已经渐渐不能满足网络浏览者的更高的、全方位的体验要求了。用户面临着部署问题、升级困难、维护困难、安全性等一系列问题,而丰富互联网应用程序(RIA)的出现则解决了这一问题。Rich Client是在B/S的框架基础上,更多的加入C/S中的Client技术,让B/S的应用客户端有本地桌面应用系统的体验。
1 RIA初探
1.1 了解RIA
RIA(Rich Internet Applications或Rich Interactive Applications),从字面上可译为“富互联网应用程序”或“富交互式应用程序”。事实上RIA并不是一种专项的技术,也不是一门开发语言,它是互联网应用和软件开发的一种发展趋势。RIA本身只是一个概念,它的中心是“良好的体验”。Adobe官方的解释为:“富互联网应用程序(RIA)提供丰富的、引人入胜的体验,该体验可提高用户满意度并提高用户的生产效率。使用互联网的广泛触及力,可以在各种浏览器、桌面和设备上部署RIA”。
1.2 RIA与AIR
RIA和AIR不了解的人乍看很容易将两者会混淆,其实是完全不同的两个概念,但它们的关系非常密切。AIR是Adobe公司在RIA应用领域的一个重要的解决方案。AIR是一个运行时,它与RIA的关系我们可以联想到.NET的Framework,AIR为RIA应用提供了一个基础的支持平台。AIR是一种概念,也可以这样通俗的理解:AIR是在本地机加载并运行的RIA。
通过图1可以看出AIR可作为WEB和桌面应用的桥梁,它结合了两者各自的优势,从而能够制作出更具表现力和更好体验的桌面程序。
2 RIA应用利器Flex
2.1 初识Flex
Flex是Adobe公司为支持RIA而开发和部署的一系列发展中的技术和产品线的概括,其中包括Flex SDk、Flex Builder、Live Cycle Data Services等。Flex就是使用Action Script脚本语言和MXML标签语言制作SWF类型的应用。
2.2 Flash与Flex
Flash与Flex同为Adobe公司的产品,都是制作SWF应用的,但Flash的历史要比Flex长。Flash最初只是作为对应WEB页面的GIF动画,随着Action Script的引入,Flash拥有了GIF所望尘的交互性。随着AS3.0和Flash CS3的到来,使用Flash制作复杂的应用成为可能。在Flash是做动画的概念深入人心的时候,Macromedia(现属Adobe公司)欲将程序开发人员拉入阵营,但Flash从一开始就像是为设计者准备的,为了面向程序开发者来进行SWF开发Flex变应运而生了。可以这样理解:Flash是面向设计人员的开发工具,它比Flex能创作出更加个性化的UI、动画及过渡效果;Flex是面向开发人员的工具,它比Flash拥有更丰富的组件和更加完善的编码支持。
正因为Flash和Flex之间这种千丝万缕的关系,新版的Flex Builder更名为Flash Builder。这种定义更容易让人理解。
3 Flex的语言
Flex主要采用MXML+Action Script来编写程序、界面,然后通过编译器编译成Flash Player能够执行的SWF文件并发布使用。
3.1 MXML语言标签
MXML语言是专门用于Flex程序中,描述界面表现的一种XML标记语言。MXML是Flex特有的,是区别于Flash的标志。我们可以通过它来描述程序的整体布局,控制组件的样式和外观,也可以构建非可视化的对象,比如XML数据、与服务器端通信的Web Service、组件的数据源等。MXML是XML的扩展,是Adobe的XML。
例1:
1)
2)
3)
4)
5)
以上就是MXML,其中的mx是Adobe默认的Flex框架的命名空间。第1行声明了XML的编码为utf-8,使程序支持大部分的语言编码。第4、5行放置了两个显示控件,一个是按钮Button,id指定为“bt1”,按钮上显示“我是按钮”四个字;另一个是文本输入框Text Input,id指定为”tx1”,该文本框的指定宽度为“100”。
在以上的代码中像mx:Button、mx:Text Input即是MXML的语言标签。众多的语言标签有机结合在一起就构成了一个完整的应用界面。
3.2 Action Script语言
Flex=Action Script+MXML。如果说MXML是描述界面的语言,那么Action Script就是描述逻辑的语言。AS(Action Script)作为Flash/Flex中的编程语言,经历了1.0到3.0版本的转变,从最初的脚本语言演变为面向对象的编程语言。
AS是由Flash Player中的AS虚拟机(AVM)来运行的,通过AS,Flex/Flash中的内容和应用拥有了交互性和数据的处理及其他功能。
4 Pure MVC框架
框架可以提高软件开发的质量,它的好处在于使得程序的结构更加清晰,降低各模块之间的耦合,使软件升级和维护的成本大大降低。Flex可选择的框架很多,官方给出的是Cairngorm框架,但这种框架对于小项目的开发来说显得不够灵活,因此我们选择Pure MVC这一开源框架。
Pure MVC是MVC框架的一种,它把数据处理、程序输入输出控制以及数据表示分离开来,将一个应用分成三层:模型层(Model)、视图层(view)、控制层(Controller)。
在Pure MVC中还有一个管理以上三个模块的工具Facade,由于它并不是实际意义上的模块因此没有列出,但整个系统确是从Facade开始的。
由于Pure MVC的目标并不仅限于Flex,而是开放语言平台的框架,不能采用带语言特色的设计,因此在Pure MVC中,所有的处理都通过通知(Notification)来传递的。
5 Flex的后台数据交互
Flex本身并不能访问服务器端的数据库,需要其他程序处理这些数据后以特定的类型,如数组型、XML型、Object型传递给Flex。
5.1 HTTPService
HTTPService可与所有的后端程序交互(例如,ASP、ASP.Net、JSP、PHP等)。Flex可以通过MXML使用HTTPService,也可以通过Action Script使用HTTPService。由于MXML的主要功能专注于界面的布局和定义,因此建议使用Action Script调用HTTPService。利用Action Script实例化一个HTTPService,通过URL Variables对象将参数传递给HTTPService,并通过send()函数完成调用。
5.2 Web Service
Web Service是一套标准,是一种公开的API接口。使用Web Service类可以访问与SOAP兼容的各种Web服务。正是Web Service所具有的这种通用性,不论用何种语言开发的Web Service服务,调用的结果都是一致的。用户可使用几乎任何语言调用Web Service服务。当客户端获得WSDL(Web Service描述语言)后,就获得了服务端提供的Web Service的所有信息。
5.3 Remote Object
Remote Object可以在不同的应用程序之间进行通信,通过这一技术,Flex应用程序可以远程调用服务器端的服务。Flash Player通过HTTP协议将客户端的请求以AMF(Action Message Format)格式送到Remote Object网关,Remote Object网关接收到请求后将数据数列化后,调用服务器端相应的服务,再将结果反序列化为Action Script对象,返回到Flex应用程序。
6 结束语
当前Internet应用的方向正向着RIA(Rich Internet Applications,富互联网应用)发展,实现的技术也很多,但目前并没有一个统一的标准。Flex作为出色的开发工具之一,在部署上有着跨平台的先天优势。Action Script3.0是一种面向对象的编程语言,在开发过程中容易学习并掌握,而Flex提供了丰富且功能强大的组件使得开发过程更加规范高效。相信今后越来越多的优秀的RIA网站会带给我们更丰富的、引人入胜的体验。
参考文献
[1]李庆,沈钧.我的Flex我精通[M].北京:电子工业出版社,2009.
[2]郭少瑞,张鑫.ADOBEAIR完整入门与开发[M].北京:清华大学出版社,2009.
[3]王峰.基于Flex的Rich InternetApplications技术的研究和应用[D].上海:上海交通大学,2008.
[4]叶建芳.应用FLEX技术构建RIA系统[D].杭州:浙江大学,2006.
Flex技术设计 篇2
TechPer的Java开发者Per Olesen在其博客上发表了一篇博文,谈到了Mate的优缺点。
根据Olesen所述,Mate的优势在于:
Mate是个Flex框架,这意味着它不会隐藏或者抽取对Flex apis的访问。其通信机制基于通常的flex事件,很大程度上要靠Flex apis完成。这是它与Cairngorm相同的地方,但是与PureMVC的区别就很大了。
Mate使用了依赖注入(DI),这是我所喜欢的一种编程模式,在进行Java开发时我就常常应用该模式。通过使用Mate,mxml的视图定义变得非常简单和干净,其中只包含视图代码。这是它与PureMVC相同的地方,但与Cairngorm却又不一样了。
大体来看,Olesen很喜欢Mate并认可其对Flex的继承。但是Mate的有些东西Olesen却并不喜欢,他说:“后台有一些东西太具魔力。Mate有个叫EventMap的东西,用来包装应用,
电脑资料
EventMap都是通过XML实现的。XML编程很快就会令你身处困境。我讨厌它!”
Olesen还发现Mate中有段代码亟需改进。
来自威尼斯Rapture公司的John Blanco在“太多魔力”问题上与Olesen产生了分歧。他说:
Mate是一个框架;因此我们不可能在短短的5分钟内就能掌握好它,这也是不现实的。
还有,如果你不喜欢编写XML的话,你就不必非得使用HTTPServiceInvoker。这是由你的项目决定的。你可以只用MethodInvoker,而且能够轻松模拟Cairngorm的Command以及PureMVC的Command和Mediator。
但是Olesen回应到:
EventMap是Mate的一个非常重要的概念和组成部分。该框架的很多内容都是以EventMap为中心的。大家也都这么认为。这是该框架的意图。如果你打算使用Mate,你就应该了解EventMap的概念。它是Mate的重要内容应该会有助于你。这可能吗,我表示怀疑。
查看英文原文:Flex Framework Mate, the Good and Bad
Flex技术设计 篇3
企业随着互联网技术的普及,网络已成为人们生活中必不可少的一部分。网站作为网络中重要的交互平台,以多媒体为主要形式。多媒体技术基于计算机技术,通过计算机对文字数据、图形图像、动画视频、声音等多种媒体信息进行综合处理和管理[1],并将它们以一定的逻辑关系联系在一起,使用户可以通过多种感官与计算机进行实时信息交互。多媒体技术的发展,丰富了网站的内容,以强烈的感官冲击给浏览者留下印象。
随着网页设计技术的不断成熟与发展,现在国内常见的网页设计有Microsoft FrontPage、DreamWeaver、CSS Design、Flex。Microsoft FrontPage是一款轻量级静态网页设计,目前应用很少;Dreamweaver网页制作软件已成为专业级网页制作程序,支持HTML、CSS、PHP、JSP以及ASP等众多脚本语言,是初学者或者专业网站开发人员必备选择工具;CSS Design是一款适合对CSS进行调试的专业级应用,方便程序调试及效果比对;Flex是美国Adobe公司推出的一系列涵盖了支持富因特网应用程序———RIA(Rich Internet Application)开发和部署的技术和工具组合,是一个高效、免费的开源框架,可用于构建具有表现力的Web应用程序,这些应用程序利用Adobe Flash Player和Adobe AIR,可以实现跨浏览器、桌面和操作系统。ActionScript 3.0应用于Flex应用的开发,实现应用程序交互和控制、数据处理等功能,更好地呈现动画效果并引导用户过渡到体验动画[2]。利用flex进行多媒体网页设计,可以集合多种flash组件,使多媒体网页更加美观。
在此将主要以Flex作为网站开发的前端,集合JavaEE、BlazeDS组件+MySQL作为网站搭建的服务端,以上海海洋大学校广播台———海大之声声乐资料作为素材构建网站,具体探究基于Flex+JavaEE+MySQL的技术实现模式及成果展示。
1.1 网页架构选择
网络设计架构主要分为B/S架构和C/S架构。B/S架构:Browser/Server,即为浏览器/服务器结构,用户工作界面是通过WWW浏览器来实现,极少部分事务逻辑在前端实现,但是主要事务逻辑在服务器端(Server)实现。C/S架构:Client/Server,即为客户端/服务器结构。表1是C/S架构与B/S架构的对比。
多媒体网站设计最大的特色就是具有很强的人机互动特性,满足每个客户对于网站功能不同的需求。又因为Flex网页设计富有大量Flash组件与多媒体特色,因此选择C/S架构模式来搭建网站,C/S架构用于客户端实现与服务器的直接相连,没有中间环节,因此响应速度快。同时操作界面漂亮、形式多样,可以充分满足客户自身的个性化要求。另外C/S结构的管理信息系统具有较强的事务处理能力,能实现复杂的业务流程。
1.2 通信形式的选择
Flex软件以ActionScript3.0为基础主要负责网页设计的前端,连接服务端有很多种形式,Flex+JavaEE模式,Flex+PHP模式,Flex+JavaScript模式,如表2所示。
Flex+Java这一技术组合在2010年就逐渐被业界所接受,现在很多行业的大型企业应用中都运用到了这一技术,如SAP、淘宝、中国移动。主要是因为在网页开发中,可利用Flex开发更好的人界面,其特点有:易用性好、交互性强、外观炫丽。而使用Java则开发稳定且可跨平台部署的业务逻辑。因此,这一组合技术可以快速开发出稳定的、易用的、用户体验良好的应用。
网页后端基于JavaEE,其建立在Java SE的基础上,用来实现企业级的面向服务体系结构(SOA)和Web应用程序。它提供了一个完整、稳定、安全和快速的Java平台,支持Web应用服务器和在Web应用服务器上运行的Web应用的开发。JavaEE提供了一套技术架构,提高了应用的安全性、可移植性和再造性[3]。并且,其在简化开发者视图的同时,最大程度保证了网页的实用性和简洁性。
1.3 后台数据交互方式的选择
Flex程序与服务器端程序进行数据交互有3种通信方式,常见的数据交互形式有以下几种,如表3所示。
3种通信方式特点总结如表4所示。
RemoteObject的AMF协议以一种高效的传输协议代替传统的SOAP、Http协议。通过AMF协议实现RPC通信功能,则称为AMF-RPC。在Java平台可以使用LCDS或BlazeDS实现其功能。
LCDS(LifeCycle Data Service ES)是一个JavaEE服务端组件,用于简化Flex与JavaEE Web应用程序之间的大数据量通信。通过LCDS与服务器端通信,不但可以大大提高通信的效率,而且还能提供传统B/S结构没有的功能。准确地说,LCDS应该是一个代理网关,客户端的Flex应用的程序对服务器端应用程序的请求必须经过该代理网关进行处理,在经过一系列复杂的处理,服务器响应后,再由该代理网关返回给Flex客户端应用程序。
BlazeDS可以看成是LCDS的一个子集,是一个开源产品,因此是人们选择连接服务端的不二选择。在服务器端,BlazeDS以Servlet的方式存在于Java应用服务器上。BlazeDS是一套面向ActionScript的前后台通信框架。它默认提供3种服务,远程调用、访问代理和消息服务。相比LCDS,Blaz DS没有提供数据管理功能,而这个功能对于在RIA客户端展示大型数据,实现客户端和服务器端大容量数据交互处理却有着重要作用。
2 网站功能设计与规划
2.1 多媒体网站———海大之声项目背景
本案例隶属于上海海洋大学广播台“海大之声”,海大之声每天为师生提供两档节目,向师生提供校园资讯,涵盖时事新闻、体育、音乐、情感、娱乐等。然而师生往往因为各种繁忙的事务错过了校园声音资讯,因此,为了解决广播传播稍纵即逝、难以查询和记录的缺陷,设计网站,搭建线上多媒体服务。
2.2 网站设计流程
整个网站的设计如图1所示。
整个网站大体分为注册、应用两大模块,师生可以注册以便更好地体验网站各方面的应用。在应用模块又细分为客户端、管理端两部分,登录时输入管理员用户名和密码便可以登录,管理整个网站的注册会员信息。对于客户端的设计分为3大部分,分别是师生互动留言板、广播台播放器及模拟电子琴小游戏、校园营销图片墙。
播放器完全利用前端软件Flex配合xml文件设计,整个学期的海大之声广播节目都可以通过本网站播放器进行播放收听,基于校园本土化特色与线下广播台的完美结合,不仅提供了每一天节目的收听,同时也连载了本地天气、广播台微博等自媒体频道。
3 基于前端的Flex设计与实现
3.1 技术实现
整个播放器是基于Flex+XML设计的。服务后台中存有XML文件以及相应的音频文件,均按照规定的格式与名字进行命名。整个运行流程为Flex前端调取服务后台XML的数据,对XML中的数据进行筛选与识别,显示在客户端。当用户选中客户端下需要听的广播节目,前端将自动匹配服务端XML文件中相应的音频地址进行读取与播放。
在Flex中有Sound专门的声音类型,可以通过此声音类型控制声音,还有专门的声音通道数据类型SoundChannel便于对声音的大小进行精确地控制。再搭配一个Number和Timer类型记录音频时暂停的时间。
另外在播放音频过程中需要用一个布尔型的变量state记录播放的状态,当音频播放时state=1,表示已经播放,再点击继续播放或者切换其他音频文件时不会重新开启新的一个声道。当音频暂停时,state=0,表示播放暂停,再点击播放时会继续播放。
通过以上几个技术点便可以搭建起一个线上播放器如图2所示。
3.2 模拟电子琴
基于Flex前端的Actionscript3.0语言涉及电子琴主要要考虑如下几个方面:网页响应键盘的应用函数,键盘不同激活状态下的美工(例如按键时网页中的电子琴某一个琴键贴图需要进行切换有所改变,表示键盘按下去了,当松开按键时,网页电子琴的琴键贴图恢复原状),音频素材的对应,Timer计数器的灵活运用。
Flex主要运用响应键盘的函数:
基于addEventListener函数,KEY_DOWN表示键盘按下,KEY_UP表示键盘松开,以KeyboardEvent.KEY_DOWN为例,计算机键盘上的每一个键都有一个模拟的虚拟码,当我们按下某个键时,会触发一个keyboardEvent事件(命名为e),则e.keyCode中便返回了按下键所代表的虚拟码。通过Swtich Case语句便可以控制键盘与电子琴按键的意义对应关系了,核心代码如下:
其中49代表键盘的“1”键,50代表键盘的“2”键…
另外也可以用Timer计时器功能将之前播放的曲子重新播放,首先需要将简谱以“1、2、3”简谱的形式保存在数组中,然后设置计数器,每隔一个时间段触发一次,使得数组中的元素一个一个读取,并播放对应的音频。由此便可以实现电子琴的复播功能。
3.3 海底浮动气泡特效
要实现海底气泡首先需要准备几种不同颜色的气泡作为素材,修改一下其透明度。接下来主要利用Flex中的Time函数设置图片动画刷新频率以及一些数学公式。
首先是创建Timer对象设置一个触发频率即每隔多少毫秒触发一次。接下来可以通过Math.random()确定随机产生气泡的位置以及相对的移动位置:具体代码如下:
创建海底气泡对象:
产生不同大小的气泡:
定义气泡的位置、透明度:
控制气泡的小幅浮动:
4 Flex+JavaEE+MySQL搭建技术实现
4.1 基于Flex+BlazeDS的配置
BlazeDS是一个基于服务器的Java远程控制(remoting)和Web消息传递(messaging)技术,它能够使得后端的Java应用程序和运行在浏览器上的Adobe Flex应用程序相互通信。Flex+BlazeDS的整合搭建大致分为如下几个步骤:(1)安装JDK和Tomcat并且实现成功配置。(2)安装BlazeDS,下载地址(http://sourceforge.net/adobe/blazeds/wiki/Home/)下载的安装包中解压备份blazeds.war文件。(3)利用MyEclipse,建立web项目,解压缩"blazeds.war"文件,将解压后的WEN-INF目录复制到Web工程的WebRoot目录下(覆盖原来的WEB-INF、META-INF目录)。以记事本格式打开"WebRootWEB-INFflex"目录下的"remoting-config.xml"文件,在文件中定义一个远程服务,这样Flex应用程序才能调用这个远程服务。(4)建立Flex工程,整合在MyEclipse中建立的Web工程。
4.2 MySQL的设计与连接
本项目基于Flex+BlazeDS利用RemotingObject通信技术,它直接远程调用Java后台提供的公共接口,连接MySQL,主要技术流程图如图3所示,首先从Flex客户端通过Java向MySQL发送请求,在MySQL中执行SQL语句,返回数据查询的结果,再通过Java返回给Flex前端,在前端对数据查询结果进行判别与分析。
通过Java连接MySQL流程的配置操作具体为:首先将Java连接MySQL的连接方法编写Java代码。然后在WEB-iINF文件夹下Remoting-config.xml文件中添加source,source为实际的建包名路径,并给Destination的id命名。代码如下所示:
4.3 基于Flex+JavaEE设计的网页注册与登录
网页登录实现逻辑:将客户端输入的用户名信息与密码信息两个字符串通过BlazeDS传输到MySQL中,利用SQL语句对数据库进行查询,倘若查询的用户名密码存在,则将信息返回给Flex前端,Flex前端执行登录操作,倘若用户名与密码不匹配,或者用户名不存在则会有相应的提示。
网页注册实现逻辑:将客户端输入的注册信息等多个字符串数值,分别通过BlazeDS传输到MySQL中,利用SQL语句对数据库进行查询,倘若查询的用户名存在,则将信息返回给Flex前端,Flex前端执行“用户名已存在提示”,倘若用户名不存在,则在MySQL数据库中执行insert语句建立新的一行数据。
Flex前端mxml代码如下所示:
同时在Declartions声明中建立RemoteObject:
对于Web服务端一方面需要编写连接MySQL的Java代码,另一方面也需要在remoting-config.xml中相应的destination进行配置source。由此便形成了Flex+JaveEE+MySQL的整合而设计的多媒体网页应用。
5 结语
基于Flex(Flash Builder)+JaveEE+MySQL前后端技术的整合,提出了制作多媒体网页技术的新方法与新应用。分别从基于Flex多媒体网页设计理论技术方法、网页功能设计与规划、Flex前端设计、基于JavaEE的服务端设计等多个方面进行论述分析。该技术对于建立高校多媒体网页设计具有很强的指导意义、功能拓展性强,可以有机地与当今时下流行的O2O模式进行结合,是一种具有创新性的多媒体网页设计模式。
参考文献
[1]孙晓玲.多媒体技术在网站设计中的运用[J].上海艺术家,2011.
[2]汪卫平,袁芳.基于Action Script 3.0的Flash动画设计与制作[J].软件,2014,7:029.
Flex技术设计 篇4
Flex富客户端技术能够创建交互性良好、高效率的自助终端系统, 具有用户界面高度互动、交互性强、响应速度快等智能客户端的优点, 以及平衡计算负载的能力[1]。同时Flex系统实现了自助终端本地页面Flash化, 大大提升用户体验效果, 它也是涵盖了支持RIA (Rich Internet Applications) 的开发和部署的一系列技术组合。目前Flex技术主要与Java技术的结合, 在继续使用原有的应用程序模型 (包括J2EE和NET) , 无需大规模替换现有的WEB应用的情况下, 构建更为直观、更易于使用而且可脱机使用的应用程序, 使需要复杂性的应用得以开发并且减少开发成本。
1 优势
那么Flex的自助终端系统与传统WEB系统相比, 其优势在哪?
(1) 基于Flex系统的实现了运行过程中GUI都在本地Flashplayer虚拟机运行, 只产生少量的数据更新请求, 而不需要服务器端实时动态生成HTML及传送图片的功能负载。
(2) 降低了自助终端系统数据传输量, 就会降低了对带宽的需求, 提升了自助终端系统的稳定性, 也保证并发下用户得到的服务质量。
2架构
应用系统采用RIA技术Flex M-V-C (modle-view-contral) 框架代替原有的WEB2.0的Ajax结合Struts1.2框架, 在保持系统原有业务逻辑和底层接口程序不变的情况下, 在系统应用中涉及到业务逻辑展现部分的全部程序需求重新进行抽取和研究。系统架构如图1。
1) 客户端主要通过智能客户端 (Flash播放器) 和浏览器IE, 为用户提供一个交互性很好的可视化界面, 以便灵活显示各种信息。自助终端Flash展现方式满足了客户业务办理便捷性和自主性的需求, 为客户提供了良好的体验空间。提升自助办理速度、增加自主操作环节等因素也极大提升了客户对自助服务乃至整个营销服务工作的满意度, 促进了自助渠道的快速普及。
2) 表示层实际上代表了用户和应用程序其余部分之间的接口, 以可视化控件的形式向业务层请求不同的服务。
3) 业务层主要为每一个Flex应用创建一个远程的Java对象实例。业务交互不需要下载页面, 只需传递业务数据, 极大的提高的自助终端业务响应速度和降低移动网络带宽。
4) 服务层的任务是可以让各种功能都通过服务端的应用服务器来实现。该层主要是应客户端的请求进行一些业务逻辑处理, 并调用数据层的逻辑实现数据的访问。Flex提供了多种与J2EE组件进行交互的方法, 在此主要采用Remote Object方式。因为Remote Object方法基于AMF的数据交互, 速度以及性能是最好的, 且支持dataset和datatable。Remote Object传输数据类型丰富, 可以支持AMF数据封装, 能够直接传送二进制文件流数据, 且传输效率相对比较高, 能够很好地支持各种后台。
5) 数据层负责存储数据, 为整个系统提供数据源的保障, 数据可能来源于数据库或者其他本地文件。由于系统对数据的安全性、稳定性要求比较高, 所以本架构采用Oracle数据库, 属性数据放在一个数据库中。一些无法存入数据库的数据文件, 比如图片数据、配置文件、视频等则以文件的方式存放, 供服务端调用。
表现层与业务逻辑层的通信中, Flex选择采用Remote Object数据交互模式。由于面向服务架构的中间件平台调用逻辑流提交的数据类型大多为Java类型, 所以采用Remote Object的交互模式, 可以直接让Flex和Java进行通信, 提高了数据传输效率。当调用逻辑流处理完毕, 将逻辑流输出的结果封装成一个大数据对象数组返回给Flex的AS去解析, 这样就得到了Flex需要的数据类型。
在Flex应用中添加Remote Object组件, 设置远程对destination对应于remoting-config.xml中的配置。
由上面程序可以看出destination节点的scope属性值指定了远程对象实例作用域为application。表明服务器为每一个Flex应用创建一个远程的Java对象实例。这样就可以实现用户表现层和业务逻辑层的无缝连接, 略去了通过HTTP进行文本转换的步骤, 数据类型也可以自动转换。
该架构关键技术主要采用基于Web的Flex+J2EE架构模型, B/S模式的体系结构, 通过Flex技术实现B/S应用C/S, 采用的开发平台是Adobe Flash Builder 4.0。
3案例
移动公司作为自助设备的最早应用商, 已经走过了自助终端应用的初期阶段, 正步入成熟期。从早期的功能单一的自助终端已经过渡到了具有丰富应用功能的高扩展性阶段, 对自助终端的实现技术要求也已经从初期的简单化的实现切换到了具有高度统一性和可扩展性的使用阶段。
面对内蒙古移动缴费终端, 若管理不规范, 不能正确的按照流程规范执行, 就会导致账务差错。
例如:**营业厅缴费终端管理员, 没有按照正常的开钞箱流程进行操作, 随意的开启钞箱清点金额或者给用户换零钱, 在这个过程中, 非常容易引发现金账务差错, 结果在当日结账发现现金与账务报表不符的问题。
钞箱监控自助终端是在统一终端控件的基础上, 通过钞箱监控模块, 定时检查钞箱的在位情况, 判断钞箱是否在位, 定时更新集中管理平台终端钞箱状态标识, 记录钞箱位置变化的记录, 为钞箱和账务管理提供数据。
钞箱监控是改造集中管理平台现金缴费功能, 实时的读取终端钞箱状态标识, 发现终端未通过集中管理平台结账, 则提示用户:终端正在结账, 暂时不能办理缴费业务。具体流程如图2。
钞箱监控是强制性要求缴费终端管理员进行对账如下:
现金对帐基本流程如图3:
说明:
营业厅现金管理流程 (钞箱现金和平台缴费总金额比对) :
1. 取出钞箱终端所有钞票, 确保没有遗漏和丢失, 清点钞票, 总钱数。
2.在终端管理界面选择功能“后台费用汇总”, 从服务器上取出当日缴费的费用汇总账务 (可以打印, 作为结账凭据) 。
3. 把取出终端钞箱现金总额跟平台现金缴费总金额进行比对, 看是否一致, 如果在全天营业中不从钞箱拿出钱, 这样是一致。
在自助终端结账操作流程:
1.终端管理界面选择功能“结账”。
2.确认上次结账时间。
3. 确认钞箱钞票数量, 并要求营业厅工作人员输入查询现金清点总额。
通过实现集中管理平台的统一控件实现自助终端实现监控钞箱功能, 实时的跟踪钞箱的状态, 为管理提供依据, 保证账务安全, 非常必要。
钞箱的实时状态一条条的记录在管理平台上, 让帐户“金额准确、状态清晰、管理规范简单化”变成了现实。
这样的自助终端状态监控实现设备运行情况统一展现、状态查询、状态控制等功能, 从而使系统管理人员能够在统一的界面中就可以了解和控制其所负责的终端运行情况。
4 结束语
本系统利用Flex客户端的面向对象编程的能力, 划分了系统功能模块, 加入用户权限管理等功能, 将大部分业务逻辑和数据处理转移至客户端, 减轻了服务器的负担。
该管理模块通过对设备采集数据的分析, 实时更新管理平台中每台终端设备的运行状态数据, 并在前台界面中采用高交互式的方式展现出当前设备的运行状态, 设备的总体运行状态主要分为正常、离线、故障、有告警等。同时针对每台终端设备, 管理模块提供相应的详细信息查询功能, 可以根据相关条件查询出设备运行状态的历史数据, 产生的告警信息数据, 实现对终端设备运行状态的实时查询展现。因此随着Flex应用的深入, 相关企业或组织对开发具有高度交互性、丰富用户体验、与平台通信一致的终端设备的要求也正在不断增长, 那么Flex在企业级应用程序的开发中也就会得到更加广泛的应用。
摘要:随着利用通信网络自助管理方式近年来规模的扩大, 自助终端是否具备良好设计也需不断改进, 而基于Flex富客户端技术就是目前最有优势的设计理念。通过利用Flex的Remote Object方式架构系统, 大大提高客户端的交互性、响应速度, 也丰富了用户体验的GUI。在技术实现案例中, 利用钞箱监控系统介绍了利用Flex的面向对象的编程技术丰富客户端的界面, 同时也将大部分业务逻辑和数据处理转移至客户端, 减轻了服务器的负担。
关键词:Flex,自助终端,RemoteObject方式
参考文献
[1]魏志军.浅析RIA-Flex技术在Web应用开发中的应用[J].信息系统工程, 2011 (3) :52.
[2]郭熙阳.Flex的Web应用系统重构[D].杭州:浙江大学.硕士学位论文, 2007.
[3]钱钰, 陈志云.基于Flex的RIA技术在教学软件中的应用[J].计算机与数字工程, 2009.
Flex技术设计 篇5
●Flex与Flash
刘树明:Flash技术曾经掀起过一阵应用潮流。在网页制作方面, 它大量代替GIF动画、多媒体动画MTV, 教师经常用到的多媒体课件制作也广泛使用Flash技术。作为矢量动画的杰出代表, Flash在同样的甚至是更优的画面效果下能够做到作品的体积更小。
作为网页制作三剑客之一, Flash的知名度远超Flex。我第一次接触Flex应该是在2006年, 一位同事在56网上看到一个比较好的视频, 想要将它下载下来用在自己的课件里面。我下载下来后惊奇地发现, 得到的palyer.swf仅仅是一个播放器, 并不是当时常见的Flash MTV影片。这就是Flex的一个应用。
邱元阳:从最终效果上看, Flex与Flash似乎是异曲同工, 因而容易让人以为它们两者可以互相代替。实际上, 它们在功能和作用上的关系并不是表面上看来这么简单的。
如果简单地说, Flex是面向开发者 (Developers) 的工具, 有很多的组件和框架可以应用, 可以开发企业级的网络应用;而Flash是面向设计者 (Designer) 的工具, 主要做动画和小程序。两者既有交集, 也可以互相配合。
Flash也可以完全使用Action Script脚本语言来写成独立的程序文件, 即脚本文件或类文件;Flxe则常常是以脚本的形式写在.mxml文件中。
从开发者的角度看, Flex是Macromedia发布的Presentation Server (展现服务) , 它是Java Web Container或者.net Server的一个应用, 根据.mxml文件 (纯粹的xml描述文件) 和Action Script产生相应的.swf文件, 传送到客户端, 由客户端的Flash Player或者Shockwave Player解释执行, 给用户以丰富的体验。
Flash适合单兵作战, 对程序员的要求比较低, 在独立程序和小的项目上, 运用Flash是完全可以做到Flex的效果的, 但它的时间轴和写程序的方式与开发人员格格不入。Flex主要面向专业程序员团队开发, 专业性较高, 适合一些大型项目的开发, 如大型无客户端 (网页式) 的Flash网络游戏, 因为这样的项目一般都是多人开发, 而且具有合理的结构性, 便于后续修改。
刘宗凡:Flash适合强交互、强效果、少数据展示、少图文混排、偏展示/工具属性的应用程序。例如, Flash交互广告展示、页游 (Flash Game) 等。而Flex适合较强交互、适当效果、多数据展示、少图文混排、偏工具属性的应用程序。例如, 图片在线修改、企业内部系统、ERP系统、金融系统等。
Flex一般只用于开发程序部分, 需要程序员和美工协同工作。而在Flash的项目中, 这些一般都没有分工。
从表现形式来看, Flash和Flex区别不大, 但是它们的数据来源不相同。Flash需要展示的数据是直接嵌入到作品里面的;Flex的数据来源于后台服务器, 这点有点类似于普通的照相机和一次性照相机的工作方式。
●Flex与RIA
刘树明:Flex作为RIA应用的突出代表, 无需刷新网页便可自动通过后台多次重复连接服务器进行交换数据, 给用户带来良好的使用体验。请两位老师给大家谈谈关于Flex和RIA的各种有关知识。
邱元阳:RIA (Rich Internet Application) 即富互联网应用。RIA首先应该是一个网络应用程序, 其次它还要具有桌面应用程序的特征和功能。RIA应用既能在浏览器上运行, 又能保持程序原来的功能和特征 (富互联网客户端应用) 。
在企业应用由Intranet转向Internet时, 就不再满足于简单的表单和表格界面, 而越来越倡导用户体验, 于是RIA的需求应运而生。
无论是B2B网站中的产品展示, 还是SNS网站上的交友游戏, 无论是娱乐网站上的Web游戏, 还是教育网站上的交互设计, RIA技术都已在散发着炫目的光辉和迷人的魅力, 给我们带来无与伦比的用户体验。
刘宗凡:在RIA的开发应用中, Adobe公司的Flex、微软公司的Silverlight和Java阵营的Java FX三足鼎立。Flash由于Flex SDK的支撑, 很早就从单纯的动画展示转入RIA领域, 而且由于Flash的普及 (Flash播放器是下载次数最多的独立软件) , Flex目前应该是三大技术体系中市场份额最大、应用最广泛的技术;Silverlight是微软推出的跨浏览器和跨平台的插件, 能在微软的.NET上交付炫目的多媒体体验和有丰富交互功能的Web应用, 已经对Flex有了很大的冲击;Java FX是未被收购前的Sun公司在2007年推出的用来对抗Flex和Silverlight的桌面应用。Java FX Script可以让用户利用JRE“一次编写, 处处运行”的优势, 在现有知识的技术上创建跨设备的应用;Flex产品能帮助应用程序开发者利用强大的Flash运行时创建数据驱动的RIA, 而且开发者还可以用Flash和Flex构建器一起为基于Flex的应用增加富交互元素。
目前来看, 这三种技术各有优势, Flex先入为主, 目前已经有了一个很大的市场, 但是Silverlight的先天优势是有Windows平台的支持, 而Java FX作为后起之秀, 尽管目前应用不是很广泛, 但其优势是它的开源策略, 相信前景依然非常广阔。
●Flex与AJAX
刘树明:我们知道, AJAX也是一种免刷新整个页面而获得服务器端更新数据的技术, 它主要是采用Java Script的XMLHttp Request对象来直接与服务器进行通信。通过这个对象, Java Script可在不重载页面的情况与Web服务器交换数据。那么AJAX与Flex各有些什么优缺点呢?
刘宗凡:AJAX (Asynchronous Java Script And XML, 异步Java Script及XML) 是一种用于创建更好、更快以及交互性更强的Web应用程序的技术。与Flex类似, 它也是需要客户端支持的一种技术, 但它不需要一个专门的播放器, 只需要客户端浏览器的Java Script支持。Java Script、XML、HTML、CSS在AJAX中使用的Web标准已被良好定义, 并被所有的主流浏览器支持。AJAX应用程序独立于浏览器和平台, 桌面应用程序有诸多优势, 它们能够涉及广大的用户, 更易安装及维护, 也更易开发。为了正确地浏览AJAX应用, CSS是AJAX开发人员所需要的一种重要武器。CSS提供了从内容中分离应用样式和设计的机制。虽然CSS在AJAX应用中扮演至关重要的角色, 但它也是构建跨浏览器应用的一大阻碍, 因为不同的浏览器厂商支持各种不同的CSS级别。
AJAX的优点是它不需要任何浏览器插件, 而且它的应用范围也不会局限于像Flex这样的播放器窗口, 页面上的所有div元素都可以接受AJAX从服务器上拉取的数据。但是它需要用户允许Java Script在浏览器上执行, 而且需要考虑各种浏览器的兼容性, 就像DHTML应用程序那样, AJAX应用程序必须在众多不同的浏览器和平台上经过严格的测试。
邱元阳:随着AJAX的成熟, 一些简化AJAX使用方法的程序库也相继问世。最为典型的是雅虎的YUI (Yahoo!UI Library) 。YUI是一个开放源代码的Java Script函数库, 为了能建立一个高度互动的网页, 它采用了AJAX、DHTML和DOM等技术, 也包含了许多CSS资源。它使用授权为BSD许可证。通过YUI函数库, 我们可以很轻松地实现动画、连线工具、资料源、元素、DOM、即拖即放、事件响应等类似桌面应用程序的一些操作, 同时它还提供自动完成、按钮、月历、容器、资料表、记录器、表单、滑块、分页视图、树状检视等控件, 并提供七种基本线框外带附加组件, 支援超过1000种不同网页布局。
大量的AJAX应用, 会给客户端的浏览器带来比较大的负荷, 而且因为要考虑到各种浏览器的兼容性要求, Web应用开发商通常需要花好几倍的人力成本来协调浏览器兼容。这就是为什么澳大利亚电子产品经销商Kogan, 对于在他的网站上使用IE7以下版本的浏览器购物者多收取6.8%的款项的重要原因了。
刘树明:相对于Flex来说, AJAX确实是有优点也有缺点。不过现在使用YUI的站点也越来越多了, Moodle从2.0版本起, 就在它的各种组件中大量应用了YUI的技术。Java Script对于牛人来说, 可以写出非常牛的程序。一个法国程序员Fabrice Bellard曾经就用纯Java Script写出了一个在Web上面运行的Linux系统, 不但能模拟PC机的CPU、内存, 连C语言编译器等系统软件都一应俱全。但是对于普通的程序员来说, 也许Flex技术是更好的选择。
●Flex与HTML5
刘树明:尽管Flex功能非常强大, 而且目前暂时应用比较广, 但是它毕竟还是需要相关播放器组件的支持。随着HTML5技术的产生, Flex技术是否会面临淘汰的危险呢?
邱元阳:作为新兴的Web技术, HTML5走上了风口浪尖, 为众人所景仰。
HTML5已经成为一种趋势, 在它的胁迫下, 浏览器的包容性越来越大。也许有一天, 我们的浏览器不需要再安装Activex, 不需要Flash Player支持, 不需要下载Applet、Silverlight等任何插件, 而所有的动画和交互效果都能实现了。这个希望就可能寄托在HTML5和CSS3身上。
尽管HTML5和CSS3来势汹汹, 但是因为Flash有着广泛而根深蒂固的应用基础, Flex仍然大有可为。如果AJAX技术和Flex技术配合形成前端组件体系, 将大大提高开发效率, 改进用户体验。
Flex的核心价值在表现层, 它有着基于组件的表现层快速开发模式。可以说, Flex在表现层的作用暂时无可替代。一个是Web应用, 一个是B/S架构, 两者在功能和作用上并没有可以完全替代的关系。而且, 连Adobe都在积极推动HTML5, 它也未必会造成Flex和Flash的消亡。
刘宗凡:HTML5和CSS3适合较强交互、适当效果、多数据展示、多图文混排、偏应用属性的应用程序。例如, Google系网站、各种传统意义的网站、SNS系网站等, 在手机等移动终端Web网络应用方面也得到了普遍应用。
但是在PC机的RIA应用方面, Flex现在并不过时。首先, Flex所需的Flash播放器在PC机上非常普及, 采用Flex技术的Web应用几乎不存在使用障碍;其次, 在一些比较流行的应用技术上, Flex积累了很多的开源项目, 开发人员在面临架构一个新项目的时候, 如果他们采用Flex技术实现, 可以在现有的开源项目的基础上轻易完成, 节省大量的人力物力。所以在相当的一段时间内, 我觉得Flex技术还是会有很广阔的应用空间。但是HTML5这种新技术走向前台是难以阻挡的, 未来可能是相当一段时间内, 会呈现以Flex为代表的RIA技术和HTML5技术并存的局面。
●开发平台与技术
刘树明:随着人力成本占项目开发总成本的比例越来越大, 开发平台和开发技术的选择对于项目开发和项目管理越来越重要了, 相比其他的RIA技术, Flex在开发方面有什么特点呢?
刘宗凡:Flash主要基于Flex SDK进行开发, 这是一个可视化开发界面, 可以通过拖拽方式开发, 提高开发效率。
Silverlight主要的开发平台是微软的.NET平台。近年来, 微软貌似对这项技术非常重视, 投入很多的人力物力, 使Silverlight不但从Silverlight 1到Silverlight 5更新速度很快, .NET平台也更新换代非常快, 功能越来越先进。Visual Studio 2010中新增了更为强大的Silverlight开发功能, 包括了可完整编辑的设计接口、拖放式数据系结、自动绑定控件、数据源选择、与Expression Blend样式资源整合、Silverlight项目支持和完整的Inteli Sense。
Java FX的集成开发环境类似于J2EE, 使用得比较多的是Netbeans和Eclipse, 在这些集成环境下面, 程序员也可以使用和VB或Delphi非常相像的可视化编辑器。
在过去几年中, Flex/Action Script社区创建了大量开源的开发支持工具:
RIATest是面向Flex的GUI自动化测试工具, 它支持Windows以及Max OS X。
Flexcover是面向Flex、AIR以及Action Script 3的开源代码覆盖率检测工具。
Alcon是轻量级的调试工具, 支持Action Script3、Flex及AIR开发。
Fluint (Flex unit and integration的简称) 是面向Flex 2/3应用的测试框架。
Arthropod是面向Flex和AIR开发的调试工具, 凭借Arthropod, 开发者可以在运行期轻松调试应用。
De Monster Debugger是面向Adobe Flash、Flex及AIR项目的开源、轻量级但功能完善的调试器, 它完全使用Adobe AIR开发。
ASTUce是衰退测试框架, 其灵感来源于x Unit架构, 如JUnit。它支持对Action Script 3的单元测试。
As Unit是面向Action Script 3的开源的单元测试框架。As Unit2.x已经完全集成了Flash IDE。
Flex Monkey是面向Flex应用的测试框架, 它可以对Flex UI功能进行捕获、重放以及确认, 可以记录并回放Flex UI的交互并生成Action Script测试脚本, 这些脚本可以轻松集成到持续集成过程中。
邱元阳:Flex开发过程通常使用已经含有Flex 4 SDK的Adobe Flash Builder, Flash Builder环境下所有的Flex开发都基于Flex SDK框架, 该框架为你提供可重复使用、可扩展的UI组件、数据获取服务和事件处理模块等。它包含对智能编码、调试及可视设计的支持, 提供功能强大的测试工具, 这些工具可以提高开发速度并创建出性能更高的应用程序。
Flex还有一些应用框架可以提高编程生产率及改善产品质量, 2008年推出的一些Flex/Action Script框架对于Flex使用率的提升功不可没。他们是Cairngorm、Pure MVC、Model-Glue:Flex、Foundry、Guasax Flex Framework、ARP、Flest Framework、Easy MVC以及Adobe FAST。从那以后涌现出了越来越多的框架, 这些框架丰富了Flex开发生态圈:
Ruboss这个Flex框架集成了Ruby on Rails和Merb。它还有一个RESTful接口以与Adobe AIR的嵌入式SQLite数据库进行通信。Ruboss框架与Rails和Merb应用的关系就好像是Adobe Live Cycle Data Services ES与J2EE应用的关系一样。
Mate Flex框架发布于2008年, 其目的是简化事件驱动的Flex应用开发。Swiz是面向Flex的Io C框架。它并没有太多的强制要求, 如目录结构或是样板代码等, 这一点与其他框架如JEE大不相同.Prana是又一个面向Action Script的Io C框架, 它基于Spring框架的XML方式进行开发。
Jump Ship是个Action Script MVC框架, 包含了标准的数据模型以进行自动化的数据分类、枚举以及搜索。它反对在框架中使用单例模式, 而单例模式在现代的软件框架中得到了广泛的应用。
GAIA是面向Adobe Flash的前端Action Script框架, 支持Flex Builder.Razor是个Action Script组件框架, 对常用的Flex组件提供了另一种选择.Flight Framework是又一个Action Script框架, 支持MVC及其他设计模式。
Flex技术设计 篇6
关键词:Flex技术,AIR技术,富互联网应用系统
0 引言
随着数字媒体技术的不断发展, 互动类展示平台的交互形式也多种多样。设计一个交互平台并不难, 但要设计出一个能让用户快速掌握浏览规则并能够沉浸其中, 非常轻松自如地掌握信息展示内容的平台, 这并不是一件容易的事[1]。互动展示平台不仅仅要满足其基本的功能性需求, 最关键的一点就是要具备足够的吸引力吸引用户浏览和阅读, 同时操作简单, 方便快速上手。
1 Flex技术
Flex技术是目前最流行的RIA (Rich Internet Application, 富互联网应用系统) 开发技术之一。Flex将基于标准语言和各种可扩展用户界面及数据访问组件结合起来, 使开发人员能够快速构建具有丰富数据演示、强大客户端逻辑和集成多媒体的应用程序[2]。Flex是一个高效、免费的开源框架, 可用于构建具有表现力的Web应用程序。这些应用程序运行在Adobe Flash Player和Adobe AIR上, 运行时跨浏览器、桌面和操作系统, 实现一致的部署。使用Flex可以制作精美的动画效果、丰富的交互式效果, 具有丰富的数据模型和用户交互体验。
1.1 Flex技术框架
Flex技术框架主要包括FlexSDK、MXML、ActionS-cript三部分。
(1) FlexSDK。这是Flex的软件开发工具包, 它包括Flex的基础类库和编译器, 其主要作用是负责将MXML和ActionScript有机结合起来, 生成客户端浏览器就可以识别的SWF文件, 其功能十分强大[3]。
(2) MXML。这种框架是通过基于XML语言来实现的, 通过该语言程序来描述浏览器的应用程序界面, MXML标签与ActionScript类或者类中的属性是相对应的。当编译器编译Flex应用程序时就会生成相应的ActionScript类文件, 然后被编译成SWF字节码存储到SWF文件中。
(3) ActionScript。是一种脚本语言, 用来定义客户所需要的逻辑, 以及对程序进行相应的控制。它把Flash所显示的内容和应用程序有机结合起来, 实现彼此交互、数据处理等功能, 有效地显现了系统的实用价值[5]。
1.2 Flex运行原理
FlexSDK是将Flex代码编译成SWF文件, 然后再部署到相应的浏览器中, 通过FlashPlayer在客户端执行SWF文件, 就能够达到访问的真正目标。而且, 在以Web为主要显示平台的应用中大都使用了Flex的分层结构, 遵循MVC (模型/视图/控制器) 的设计模式, 能够将表现层与业务逻辑层进行有效分离, 之后业务逻辑层主要负责业务逻辑的相应处理工作, 控制层主要负责处理用户的交互, 表现层主要用来负责处理结果的展示[4]。
2 实现过程
2.1 需求分析
本设计需求为展示某大专院校建校以来历年的重要事件。事件的信息来源于该校建校以来历年的图片搜集和文字资料汇总, 设计目标是能够以便捷的操作、唯美的画面、丰富的信息量, 充分展示建校以来的信息内容。
2.2 信息平台总体功能框架设计
在平台总体功能框架设计方面, 笔者从用户的角度出发, 设计了两大模块, 分别为数据录入模块和信息展示模块。数据录入模块的设计目的是方便数据管理员对数据进行高效率录入和信息整理, 主要负责提供图片和对应文字的输入, 后台的操作主要以xml文件形式进行动态创建和图片文件的归纳整理。信息展示模块对所生成的xml文件和相关图片资源文件进行动态载入, 完成展示信息的功能。总体功能框架见图1。
2.3 数据录入模块实现
数据录入界面采用Flex组件进行开发。在新建的Flex项目中将组件面板中相关的组件拖拽到编辑区进行布局即可。这种操作方式简单又便于界面布局。数据录入端主要以图片和对应文字解说为录入内容, 后台会根据用户录入信息进行归纳和整理, 生成xml文件, 主要技术包括文件存储和xml文件的设计与读写操作。传统的Flash库文件开发包无法对本地文件进行读写操作, 笔者采用FlexSDK中的AIR技术, 实现了文件的本地或异地读写操作。xml文件的设计目的是完成输入数据的信息整理工作, 记录展示信息的关键内容。用户每次输入的数据以节点的方式动态追加到xml文件。xml文件节点设计如下:
-
xml文件创建的关键代码如下:
xml文件写入数据的关键代码如下:
saveToXmlFile () 函数的具体实现方法如下:
2.4 信息展示模块实现
信息展示模块的主要作用是动态加载xml文件和图片信息, 对所加载的内容进行分级处理和展示。在界面的设计上, 采用Flex设计模式布局, 共设计三级页面, 一级页面以年代作为分类索引入口, 根据用户选择的年份进入二级页面。二级页面展示所选年份所有文字图片信息, 三级页面展示具体事件的文字图片信息。类结构见图2。
为了增加画面的视觉效果, 笔者选择TweenLite动画引擎为展示平台的一级页面、二级页面和三级页面, 分别设计了不同的动画效果呈现对应内容。一级页面采用以年代为索引的浮动图标, 二级页面和三级页面分为图片浏览模式和文字浏览模式, 针对不同的模式, 设计了不同的的出场动画, 总体运行效果见图3。
参考文献
[1]RUSS UNGER CAROLYN CHANDLER.UX设计之道——以用户体验为中心的Web设计[M].孙亮, 译.北京:人民邮电出版社, 2010.
[2]CHARLES E BROWN.The essential guide to flex 3[M].New York, 2008.
[3]MICHELE E DAVIS, JON A PHILLIPS.Flex3:a beginner’s guide[M].United States of America, 2008.
[4]姜天格.Flex3企业级Web应用系统设计与实现[M].北京:机械工业出版社, 2008.
Flex技术设计 篇7
1 Flex技术特点
Flex是Adobe公司提出的基于组件的开源框架,可用于开发多媒体界面Web应用程序。Flex的开发模型由Action Script 3、MX-ML语言及扩展类库组成,其中MXML可用于设计和配置Flex程序界面、编写表现层数据模型。经由Flex编译器编译成SWF格式,通过Flash Player支持不同系统和平台运行,为用户提供视频、声音、实时通话。由于Flash Player基于异步客户端-服务器通信模型,可将原本在服务器上执行的部分简单计算任务交由它完成,减少客户端与服务器的交互,提高系统运行效率。
2 基于REST的WEBGIS开发框架
传统Web GIS开发采用MVC三层开发框架,以服务端用.net /J2EE,Arc GIS Server为例,其开发框架如图1所示。这种使用RPC风格的架构,其紧密耦合和接口的复杂性使得用此框架开发的Web服务很难达到Web级别的可伸缩性。此外,由于此类服务的资源和调用方法封装于SOAP消息,无法从URL和HTTP上得到有用消息,且每个SOAP应用需要定义自己的接口,不利于地理数据服务服务的互操作。
REST(Representational State Transfer),即表述性状态转移,是一种基于HTTP协议面向资源的架构。每一个URL代表一个资源,而系统则由这些资源构成。REST通过定义Web服务应用程序编程接口,使用HTTP进行资源管理,相比SOAP及XML-RPC更加简洁高效。因此,Flex与REST技术结合是当前较热门的分布式系统解决方案之一。如ESRI公司于2008年底推出的Arc GIServer REST API,提供了REST风格的开发接口。以自行开发的商贸系统为例,其开发框架如图2所示。
从图可以看出,风格的开发框架比结构要简洁,用户通过浏览器在后台用与服务资源进行交互,以访问Web Services的方式调用Arc GIS Server服务资源,不需要SOAP工具包,方便互操作。
3 基于Flex的WEBGIS Rest商贸系统
3.1功能模块
基于Flex的WEBGIS Rest商贸系统采用Arc GIS平台开发,后台数据采用.net实现Web发布与操作。主要用于实现网上数字虚拟社区系统相近地域人员之间的主题式互动交流、社区电子地图的游览与查询、社区各类店铺的商贸往来,打造富媒体可视化状态下的仿三维虚拟社区系统,以营造良好的虚拟社区氛围。系统功能包括商城地图浏览、商铺查询、商铺门户、用户管理、社区论坛留言管理等模块。通过网络平台,用户可以通过地图浏览社区内的商铺、通过商铺浏览其产品说明及产品的展示、可以根据主题进行留言互动交流、可以浏览相近地区的地图。其中基本图形功能包括:地图无级缩放、图形平滑漫游、“鹰眼显示”、动态路名、量度尺、沿路跟踪、空间查询、图形和数据交换等。主要功能模块图如图3所示。
3.2效果实现
系统程序实现分两部分:服务器端运行Remoting Objects,提供Services给Flex客户端;Flex中运行Action Scripts和MXML,实现数据展示与客户交互。数据部分,采用Geo Database空间数据模型:矢量数据部分通过投影变换转换为同一种地图投影;照片、栅格地图等栅格数据以集的形式存在于Geo Database中。各类统计信息、文本信息以数据表的形式存在Geo Database中。REST风格的Web服务发布步骤如下:首先针对涉及到的地图服务、地理处理服务创建所需要的GIS资源;然后利用Arc Catalog将资源发布为Web服务,以便被客户端应用程序远程调用。企业商铺地图操作界面如图4所示。
4 结束语
Flex技术设计 篇8
本文设计出具有独立性的功能完备多媒体智能答疑系统。在这个系统中综合有信息检索等多种技术和工具,使得能够同时开展离线答疑以及在线答疑等形式,系统拥有下列这些优点:(1)在线交流途径的丰富提升答疑的效果;(2)离线交流提升答疑的灵活性;(3)智能答疑库功能有效增强答疑效率。系统总体设计如下:
1 系统功能结构设计
多媒体智能答疑管理系统的功能结构设计是以需求分析的用例模型和参与者模型进行的,将系统划分为系统管理、信息发布管理、教学资源管理、智能答疑管理以及个性化学习管理等模块。功能结构具体如图1 所示。
2 FLEX实现
本系统能够在UML中Use Case Diagram建模组件,并且借助于Flex技术以及Adobe Flex Builder 3 工具来开展软件工程塑膜组件的设计,如果设计人员对Action Script比较熟悉,那么采用Flex技术进行开发工作将会更加高效快捷,而对于那些不熟悉的人员,也能够很快的掌握,下面将对本文所采取的建模组件内容展开论述。
2.1 展示层
展示层主要采用Flex技术进行。对于建模组件中任意对象,均有着相同的原理,主要是在Canvas这个最外层中,将Canvas 、Text 、Label等相关组件进行涵盖,并且将内外层的全部物件封装为独立的整体,Canvas反映了该对象的主体内容,从而也就实现这个系统Use Case Diagram建模组件中基本对象的建立,为后续的研究和实践工作奠定基础。
当前,在系统中Use Case Diagram建模组件,主要包括association、include 、extend 、system 、use case、actor等这些对象。
在用户借助于软件工程建模组件的过程中,能够运用存盘操作,也就是将所有组件相关的信息进行有效保存,然后转换为所需要的格式,以实现在远程服务器中保存。
2.2 业务逻辑层
Actor主要是由Canvas作为主体,并且在内部由线段以及圆来形成小图,同时在textarea内能够进行文字的输入和填写。可以知道的是,Actor的小图也属于非必要的内容,这是由于线段以及圆均无法进行更改,即便没有存储这方面的数据,在进行还原actor图形操作时依然能够保持原有的格式,不会对最终的画面效果产生影响。
此处,能够被我们记录并且调整的内容是Canvas的id以及坐标数据,同时actor中的textarea输入框所存储的数据也将会进行存储操作,textarea的相关属性会按照text的数字增减变化而进行调整,所以textarea的width以及height属性数据也会进行存储。对于单个actor来说,需要执行存储操作的内容主要是「actor Main」、id 、x、y、text 、width以及height等数据,而「actor Main」指的是用例识别actor所需要存储的对应内容和数据。
2.3 数据访问层
数据访问层能够实现封装以及处理相关的系统数据,借助于持久化对象处理以及其他功能,能够完成对物理表的有效关联,为系统数据的后续操作提供帮助。当需要插入或者编辑相关记录时,应当按照业务逻辑层所反映的参数信息作为基础,然后在物理表内开展遍历操作,从而获得需要执行相应操作的记录位置。
3 实现效果
3.1 个性化学习管理实现
学习管理模块的实现主要体现个性化学习的管理和功能,其涉及的功能主要包括课程学习、在线测试、课程学习效果反馈、课程成绩汇总等管理功能。
通过对学习内容以及课件资源等进行排序,同时对排序的内容设置相应的简介内容,使得Web挖掘能够更加高效的进行个性化学习推荐。对于那些推荐指数较高的课件可以将其放置在更加有限的顺序,使得学习者能够更加快捷和方便的获取内容。
借助于分析和研究能力数据和难度数据,从而实现对Web挖掘功能和效果的分析与判断。利用对学习者的学习活动进行实时研究和分析,并且把其学习数据和操作活动进行详细记录,然后对其展开分析和评估,使得系统所推荐的内容和资料能够更加符合学习人员的需要。
借助于模糊项目反应理论的相关内容,使得系统能够更加高效的开展课件推荐活动,并且还能够实现个性化学习的相关功能。借助于模糊项目反应这项方法和工具,使得学习人员的数据和资料能够及时更新,然后按照更新后的内容进行课件推荐,并且课件的难易程度以及内容也有效符合学习者的实际情况,从而提升学习人员的学习效率。
3.2 智能答疑管理实现
智能答疑管理可以实现小组管理、任务管理、小组论坛、智能答疑以及资源共享等管理。
3.3 教学资源管理实现
教学资源管理包括作业资源和考试资源。其中教学资源的作业资源又通过学习资源下载、在线作业提交以及查询个人作业三个子菜单的形式进行体现。
3.4 系统管理实现
系统管理的实现,不仅要实现有关用户登录、用户管理、日志管理等日常管理功能,还要对其中的统计和分析进行支持。
4 系统测试
借助于测试用例能够判断程序能否有效符合用户的功能需要,对于测试用例而言主要包含输入内容、满足要求和测试数据。在进行测试时,需要事先制定对应的测试用例;如果测试用例越多,所获得的测试结果以及测试数据越能够准确和科学;借助于不同的测试用例,能够针对系统和程序开展不同的功能测试;值得注意的是,如果测试用例过多时,也将会使得测试工作量大幅增加;并且测试用例增加的时候,测试将会占用的资源也将会相应上升。因此,设计测试用例的时候需要综合考虑多方面因素,确保其数量是较为科学合理的。当进行测试活动时,测试用例具有十分关键的作用,主要体现在下面这些内容:(1)设计测试用例:当准备测试活动的时候,需要进行测试用例的设计;(2)确定测试目标:通过确定测试活动的具体目标,使得测试能够更加规范开展;(3)确定需求满足:借助于相关数据来确定其满足程度;(4)优化功能:通过优化功能来提升系统以及程序的性能。
对于远程教育学习系统的个性化而言,能够借助于功能、集成、性能以及回归等当面的测试活动来完成测试工作。
集成测试以及功能测试应该由企业的工作者来开展,性能测试以及回归测试需要由用户以及企业工作人员合作开展。
5 总结
本文是针对多媒体智能答疑管理系统研究与实现的归纳与总结,系统的业务管理是在分析远程教育和智能答疑存在缺陷的基础上进行,系统的设计与实现则融合了FLEX技术、Java开发技术、框架技术以及对象模型等手段。通过系统的建立,使得智能答疑管理和个性化学习管理更加智能化、规范化以及标准化,有助于形成远程教育的标准,并推动个性化学习的应用。当前,智能答疑管理系统已经投入试运行,对提高系统的可用性、扩展性以及灵活性具有极其重要的作用。
在研究与实现多媒体智能答疑管理系统过程中,所做主要工作包括:(1)结合智能化学习和远程教育存在的缺陷,对多媒体智能答疑管理的实际需求进行调研,并归纳主要业务需求;(2)结合个性化学习和智能答疑管理的业务需求,进行主要功能模块对象模型和挖掘模型的建立;(3)完成系统主要功能模块的详细设计,并对智能答疑和个性化课程推荐的过程和模型进行设计;(4)将FLEX技术和整合框架技术应用到多媒体智能答疑管理系统中,实现业务功能和数据挖掘功能;(5)进行功能和性能测试用例的构建,验证业务需求的具体要求。
参考文献
[1]刘照然.远程教育中智能答疑系统的研究与实现[D].西安电子科技大学,2015.
[2]闻峥.基于Lucene的搜索引擎优化[D].北京交通大学,2013.
[3]崔龙卫.基于P2P的音视频通讯系统的研究与设计[D].武汉理工大学,2014.
[4]邓丹君.基于Lucene的垂直搜索引擎关键技术研究[D].武汉理工大学,2014.
[5]庞振.基于Flex+Red5的实时语音交流平台的研究与实现[D].北京邮电大学,2013.
[6]刘建强.基于远程教育的网络智能答疑系统的研究与设计[D].西安电子科技大学,2014.
[7]黄晨.软件智能使用辅助引擎[J].福建电脑,2014(4).
[8]傅向.内容过滤技术在反垃圾邮件系统中的应用[J].电脑与电信,2013(7).
[9]鲍光余,朱东海.基于潜在语义分析的农户个性化推荐系统的研究与设计[J].计算机与现代化,2014(1).