http://www.cnblogs.com/xiaogangqq123/archive/2011/06/03/2070673.html
birdeye概述
BirdEye是一个开源的Adobe Flex图表制作组件。用于创建多维数据分析可视化界面。
birdeye 可以绘制 拓扑图,关系图,流程图,星空图,地图,饼图 等等..
birdeye 项目地址:http://code.google.com/p/birdeye/
birdeye 源码下载:http://code.google.com/p/birdeye/source/checkout 需要用SVN.
birdeye Demo:http://birdeye.googlecode.com/svn/branches/ng/examples/demo/BirdEyeExplorer.html
birdeye svn源码地址:
svn checkout http://birdeye.googlecode.com/svn/trunk/ birdeye-read-only
checkout 大约几分钟的时间 下载下来的源码如下
每个文件夹里面对应了一类图形. 导入的项目可能会报错,注意查看每个文件夹下的lib目录下的swc文件 引入即可。
ravis 下是拓扑图
导入工程后,运行Level4.mxml
birdeyeravis 传递数据的方式也是通过xml
xml结构如下:
节点
<Node id="1" name="0" desc="This is a description" nodeColor="0x333333" nodeSize="32" nodeClass="earth" nodeIcon="center" x="10" y="10" />
name-就是显示名, desc-是描述,可以不显示. nodeColot -是节点颜色. nodeSize-节点大小. nodeClass-节点样式, nodeIcon-不清楚属性,
连接的关系xml
<Edge fromID="1" toID="2" edgeLabel="No Change" flow="50" color="0x556b2f" edgeClass="sun" edgeIcon="NoChange" />
fromID toID就不用说了,edgeLabel-线上的显示名 color -线的颜色, edgeClass-线的样式
xml和SpringGraph绘制拓扑图的xml结构有点相似吧…
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:ravis="org.un.cava.birdeye.ravis.graphLayout.visual.*"
xmlns:lc="org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.*"
xmlns:vc="org.un.cava.birdeye.ravis.components.ui.controls.vgraphControls.*"
xmlns:flexlib="http://code.google.com/p/flexlib/"
creationComplete="init();" width="100%" height="100%" >
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.LayoutSelector;
import org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.PhiDial;
import org.un.cava.birdeye.ravis.components.ui.controls.vgraphControls.EdgeRendererSelector;
import org.un.cava.birdeye.ravis.graphLayout.data.Graph;
import org.un.cava.birdeye.ravis.graphLayout.data.IGraph;
import org.un.cava.birdeye.ravis.graphLayout.layout.ConcentricRadialLayouter;
import org.un.cava.birdeye.ravis.graphLayout.layout.IAngularLayouter;
import org.un.cava.birdeye.ravis.graphLayout.layout.ILayoutAlgorithm;
import org.un.cava.birdeye.ravis.graphLayout.layout.ParentCenteredRadialLayouter;
import org.un.cava.birdeye.ravis.graphLayout.visual.IEdgeRenderer;
import org.un.cava.birdeye.ravis.graphLayout.visual.IVisualNode;
import org.un.cava.birdeye.ravis.graphLayout.visual.VisualGraph;
import org.un.cava.birdeye.ravis.graphLayout.visual.edgeRenderers.DirectedBalloonEdgeRenderer;
import renderers.edgelabels.mxml.basicEdgeLabelRenderer;
private var graph:IGraph;
private var layouter:IAngularLayouter;
private var selectedEdgeRenderer:IEdgeRenderer;
private var startRoot:IVisualNode;
private var itemCount:int = 0;
private var initDone:Boolean = false;
private function init():void{
var strXML:String =
"<graph>" +
"<Node id=\"1\" name=\"\" nodeColor=\"0xaf3a99\" nodeSize=\"0\" nodeIcon=\"center\" />" +
"<Node id=\"2\" name=\"B60R\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />" +
"<Node id=\"3\" name=\"H01L\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />" +
"<Node id=\"4\" name=\"B24B\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />" +
"<Node id=\"5\" name=\"H01M\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"6\" name=\"B25J\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"7\" name=\"G05B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"8\" name=\"H04L\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"9\" name=\"H01R\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"10\" name=\"G05G\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"11\" name=\"H05K\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"12\" name=\"H01H\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"13\" name=\"H03H\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"14\" name=\"G06F\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"15\" name=\"H04Q\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />" +
"<Node id=\"16\" name=\"A63B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"17\" name=\"G06T\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"18\" name=\"E05B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"19\" name=\"G01N\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"20\" name=\"F02B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"21\" name=\"F04C\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"22\" name=\"B23C\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"23\" name=\"H04B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"24\" name=\"B62D\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Node id=\"25\" name=\"H02K\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />" +
"<Edge fromID=\"1\" toID=\"2\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"2\" toID=\"3\" edgeLabel=\"1228\" color=\"0x556b2f\" />" +
"<Edge fromID=\"4\" toID=\"3\" edgeLabel=\"589\" color=\"0x556b2f\" />" +
"<Edge fromID=\"4\" toID=\"5\" edgeLabel=\"233\" color=\"0x556b2f\" />" +
"<Edge fromID=\"4\" toID=\"6\" edgeLabel=\"216\" color=\"0x556b2f\" />" +
"<Edge fromID=\"6\" toID=\"7\" edgeLabel=\"294\" color=\"0x556b2f\" />" +
"<Edge fromID=\"6\" toID=\"8\" edgeLabel=\"211\" color=\"0x556b2f\" />" +
"<Edge fromID=\"2\" toID=\"8\" edgeLabel=\"553\" color=\"0x556b2f\" />" +
"<Edge fromID=\"3\" toID=\"9\" edgeLabel=\"244\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"10\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"10\" toID=\"11\" edgeLabel=\"701\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"12\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"12\" toID=\"13\" edgeLabel=\"523\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"14\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"14\" toID=\"15\" edgeLabel=\"522\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"16\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"16\" toID=\"17\" edgeLabel=\"402\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"18\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"18\" toID=\"19\" edgeLabel=\"350\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"20\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"20\" toID=\"21\" edgeLabel=\"304\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"22\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"22\" toID=\"23\" edgeLabel=\"300\" color=\"0x556b2f\" />" +
"<Edge fromID=\"1\" toID=\"24\" edgeLabel=\"\" color=\"0xFFFFFF\" />" +
"<Edge fromID=\"24\" toID=\"25\" edgeLabel=\"298\" color=\"0x556b2f\" />" +
"</graph>"
initData(strXML);
// //nodeSize 球的大小, nodeColor 节点的颜色 edgeLabel=线上的描述
ExternalInterface.addCallback("GetXMLFunction",initData);
}
private function initData(strXML:String):void {
var xmldata:XML = new XML(strXML);
graph = new org.un.cava.birdeye.ravis.graphLayout.data.Graph("XMLAsDocsGraph",false,xmldata);
vgraph.graph = graph;
layouter = new ParentCenteredRadialLayouter(vgraph);
vgraph.layouter = layouter;
layouter.autoFitEnabled = false;
//layouter.linkLength = 300;
//layouter.phi = 300;
//layouter.layoutChanged = true;
vgraph.edgeRendererFactory = new ClassFactory(DirectedBalloonEdgeRenderer);
vgraph.maxVisibleDistance = 5;
//指定根节点
startRoot = graph.nodeByStringId("1").vnode;
vgraph.displayEdgeLabels = true;
vgraph.currentRootVNode = startRoot;
initDone = true;
//线条样式
var myEdgeRender:EdgeRendererSelector = new EdgeRendererSelector();
myEdgeRender.selectedItem = "Default";
myEdgeRender.vgraph = vgraph;
myEdgeRender.changeEdgeRenderer();
var selector:LayoutSelector = new LayoutSelector();
selector.vgraph = vgraph;
selector.selectedItem = "ConcentricRadial";
selector.changeLayouter();
vgraph.draw();
}
]]>
</mx:Script>
<mx:Style source="styles/main.css" />
<mx:Canvas id="graphCnvs" width="100%" height="100%" >
<ravis:VisualGraph id="vgraph" width="100%" height="100%"
left="0" right="0" top="0" bottom="5"
backgroundColor="#FFFFFF" alpha="1"
itemRenderer="renderers.nodes.mxml.sizeColorNodeRenderer"
edgeLabelRenderer="renderers.edgelabels.mxml.basicEdgeLabelRenderer"
resize="vgraph.draw(VisualGraph.DF_RESET_LL)"
visibilityLimitActive="true"
>
</ravis:VisualGraph>
<flexlib:WindowShade
id="layoutContainer"
styleName="linkButtonWindowShade"
label="设置"
width="400"
opened="false"
horizontalAlign="center"
paddingBottom="5"
visible="false">
<lc:PhiDial id="myPhiDial" vgraph="{vgraph}" />
<lc:ToggleDamping id="myDamping" vgraph="{vgraph}" />
<lc:CommonLayoutControls id="myCommonLC" vgraph="{vgraph}" />
</flexlib:WindowShade>
</mx:Canvas>
</mx:Application>
效果如下:
线的长度只有通过控件才能设置,我是通过修改源码来达到固定的。
birdeye 与SpringGraph的一点区别在于 不会随意飘动,并且效果还不错。如果不想看到他的双击事件也可以通过修改源码实现.
flex URLLoader和URLRequest浅析
URLLoader,其实也是flex和后台交互的三大方法之一,其他方法我就不赘述了。
URLLoader需要URLRequest来发送请求。
URLRequest可捕获单个 HTTP 请求中的所有信息。将URLRequest 对象传递给URLStream或URLLoader 类以及其他加载操作的load()
方法以启动URL数据加载。
var request:URLRequest = new URLRequest(http://localhost:1146/Data/Book.xml)
同样可以使用URLRequest来请求一个本地项目/应用里的文件,如下代码示例:
var request:URLRequest = new URLRequest("Data/Book.xml")
URLLoader 类以文本、二进制数据或 URL 编码变量的形式从 URL 下载数据。在下载文本文件、XML 或其他用于动态数据驱动应用程序的信息时,它很有用。
这里有个加载本地文件的例子:
private function getTreefromLayerControl():void { var lcurl:String=this.configXML.groupurl; var urlloader:URLLoader=new URLLoader(new URLRequest(lcurl)); urlloader.addEventListener(Event.COMPLETE, completehandler); } //layercontrol加载后解析 private function completehandler(event:Event):void { var x:XML=new XML(event.target.data); layerxml=x.groupconfig.layeritem; for each(var xm:XML in layerxml) { if(xm.hasOwnProperty("@label")) { xmlhandler(xm); } else { BLLayerItem(xm); } }
这里有个访问服务器后台的例子:
private function getText():void { var v:URLVariables = new URLVariables("name=jacky&age=35&address=HongKong China"); var r:URLRequest = new URLRequest(); r.url = "http://localhost:2222/FlexService/TextFrm.aspx"; r.method = URLRequestMethod.GET; r.data = v; var l:URLLoader = new URLLoader(); l.load(r); l.addEventListener(Event.COMPLETE,txtCompleteHandler); //注册请求完成后 响应获取数据事件方法 labMsg.alpha = 1; } private function txtCompleteHandler(e:Event):void { var l:URLLoader = URLLoader(e.target); var o:Object = URLUtil.stringToObject(String(l.data)); //使用URLUtil对将数据进行反序列化以方便使用 txtName.text = o.name; txtAge.text = o.age; txtAddress.text = o.address; labMsg.alpha = 0; }
后台:
protected void Page_Load(object sender, EventArgs e) { //获取URLResuest请求回的参数 返回数据用;分隔以方便Flex对数据进行序列化 string rs = String.Format("name={0};age={1};address={2}",Request.QueryString["name"], Request.QueryString["age"], Request.QueryString["address"]); Response.ClearContent(); Response.ContentType = "text/plain"; Response.Write(rs); //以文本形式返回数据 Response.End(); }
Flex控件工具大全
http://developer.51cto.com/art/201007/215173.htm本文和大家重点讨论一下Flex控件的用法,Flex控件分为2种,一种是布局控件,另外一种是元素控件。比如Canvas控件,Canvas容器绘置一个长方形的区域用来放置子组件(其他容器或者控件)。
Flex控件详解
Flex控件分为2种,一种是布局控件,另外一种是元素控件。
Canvas
Canvas容器绘置一个长方形的区域用来放置子组件(其他容器或者控件),与其他容器不同,Canvas子组件的位置必须指定绝对坐标或使用约束条件布局。
Box,HBox,andVBox
Box容器用来横向或者纵向的放置子组件,使用direction属性来决定是横向布局还是纵向布局。HBox,VBox就是指定了direction属性的Box。
ControlBar
Flex控件中ControlBar容器一般与Panel容器或者TitleWindow容器配合使用,比如在Panel容器的底部放置一个ControlBar作为Footer。
ApplicationControlBar
ApplicationControlBar容器一般起到导航的作用,作用于整个应用程序的运行期间,比如我们使用的Word,Excel顶部用来放置工具栏和菜单栏的区域。
ApplicationControlBar容器有2种模式,分别是Docked模式和Normal模式。Docked模式将ApplicationControlBar容器一直显示的停靠在应用程序的顶部,并且自动将宽度调整为应用程序的宽度。Normal模式可以将ApplicationControlBar容器以任意的大小放置在应用程序的任何位置。
DividedBox,HDividedBox,andVDividedBox
DividedBox容器类似与Box容器,用来横向或者纵向的放置子组件,不同的是DividedBox用显示的间隔物将自组件分割开,你可以拖动间隔物来扩大或缩小每个子组件所占的空间,HDividedBox和VDividedBox相与DivideBox的区别与HBox和VBox相对与Box的区别一样。
Form,FormHeading,andFormItem
Form是Web应用最为常见的容器了,常见的有用户注册,帐单信息等。FormHeading用来区分每一组Form信息,如用户注册的过程中,可以指定2个FormHeading分别是必添项目和选添项目。FormItem是Form中具体的某一个项目,包含一个Label和若干个控件。
Grid
Grid容器用来以表格的形式放置组件,好比Html中没有Border的Table。Grid容器的每一个单元格(cell)都可以放置0个或1个子组件,如果想要在一个单元格中放置多个控件,那么就在这个单元格中再多加一个容器。Grid中使用GridRow来创建行,用GridItem来创建单元格。类似与Html的table,你也可以使用rowSpan,colSpan来合并单元格。
Panel
Panel容器是Flex控件中一个比较常用的容器,包含标题(title)区域,放置子组件的容器(content)区域,以及边框(border)。content区域有3种形式,分别是横向布局(horizontal),纵向布局(vertical),绝对坐标布局(absolute)。Panel会很普遍的与Form结合起来使用,当然还有前面提到的ControlBar组件也是Panel容器中很常用的一个子容器。
Tile
Tile容器将子组件按照表格的形式放置,与Grid容器的区别是,Tile容器每个单元格的大小都是一样的。Tile容器子组件具体的放置位置由Flex来安排,而Tile容器的宗旨是将所有的子组件都能以横竖排列最佳的位置摆放。比如Tile容器有16个子组件,就将16个子组件以4行4列的位置摆放,如果是15个子组件,也是4行4列摆放,只不过最后一行的最后一列是空着的。
TitleWindow
TitleWindow容器继承与Panel容器,所以TitleWindow拥有Panel的所有特性,而不同的是TitleWindow容器是用来做弹出(popup)面板的。
flex mx:application加载顺序
http://blog.csdn.net/lihua2915/article/details/5950672
Flex应 用程序共由两帧组成,第1帧为preloader部分,第2帧为主应用程序部分,此两部分由Flex应用程序的根SystemManager统管,SystemManager是flash.display.MovieClip的子类,影片剪辑(movie clip)支持帧。由于swf属于一种渐进式(progressive)下载的格式,正是由于swf格式这个特性,Flash Player并不需要等待整个程序下载完成便可直接访问已载入帧的内容,因此第一帧通常用来作为应用程序载入时的loading画面显示,一般来说,第一帧包含的内容应该尽可能的少(在第一帧中尽量不要含有Flex框架的组件),以便能很快的下载并立即显示;第二帧才是主应用程序真正的内容,一旦 SystemManager实例进入到第二帧后,即开始内部主应用程序运行的生命周期(life cycle),也就是进入我们最为熟悉的<mx:Application>运行的部分(SystemManger实例有一 application的属性,在第1帧时,此属性为null,当进入到第2帧时,该属性才指向真正的主程序application实例)记住我们开始所说的,Flex应用程序总的来说是以事件驱动的程序。
在程序进入第2帧,主程序application开始运行后,便会相应的触发相应的一系列事件,按事件发生的先后顺序依次来介绍:
preinitialize
应用程序application已实例化,但此时还未创建任何相关的孩子组件(child component)
initialize
此时,创建了相应的孩子组件,但还未对这些子组件进行布局
creationComplete
应用程序application完成全部实例化,并完成所有子组件的布局
apllicationComplete
上面三处事件的完成,表明application内部启动的整个进程完成,接下来便会通知SystemManager派发applicationComplete事件。此时,启动程序启动完成并准备运行。
Flash包含的是一个时间线上的多个帧, 而Flex的SWF只包含2个帧. SystemManager, Preloader, DownloadProgressBar和少量工具类都在第一帧, 剩下的包括应用代码/ 内嵌资源全都在第二帧中. 当Flash Player下载下载SWF时, 只要接收到第一帧内足够的数据, 就会实例化SystemManager, 由它来创建Preloader, 然后创建DownloadProgressBar, 这两个对象会察看剩余字节的传输过程. 当第一帧的所有字节传输完毕后, SystemManager发送enterFrame到第二帧, 然后是其他事件. 最后Application对象派发applicationComplete事件.
SystemManager是Flex应用的主控者, 它控制着应用窗口, Application实例, 弹出窗口, cursors, 并管理着ApplicationDomain中的类. SystemManager是FlashPlayer实例化的第一个类, 它存储了主应用窗口的大小和位置信息, 保存其子组件比如:浮动弹出窗口和模态窗口的痕迹. 通过SystemManager可以获得内嵌字体,样式和document对象.
自定义的可视化组件(UIComponent的子类)只有在调用过addChild()后, 才会有一个SystemManager赋给他们, 之前是Null. 所以在自定义可视化组件的构造函数中不要使用SystemManager.
通常, Application对象创建时, 发生如下事件:
2. 初始化Application.systemManager
3. Application在初始化过程之前, 派发预初始化事件.
4. 调用createChild(). 此时, 所有应用组件被创建, 所有组件的createChild()被调用.
5. Application派发初始化事件, 表明所有的组件初始化完毕.
6. 派发creationComplete事件
7. Application对象添加到显示列表中
8. 派发applicationComplete事件
Flex 是一个事件驱动的编程模型, 任何事情的发生, 其背后必然存在一个事件. 而开发者第一次看到MXML时, 很难体会到一个Xml标记的应用的事件流和实例化的生命周期. 这个对于HTML和Flash的开发者尤其会感到困惑, 因为其熟悉的方式与Flex的一点也不相似. HTML的实例化是从上到下的, Flash的执行是从Frame0开始一帧帧运行的. 而Flex则又有不同.
在Flex4中使用mx:HTTPService与Java通讯
http://www.cnblogs.com/modou/articles/1902492.html
mx:HTTPService的使用非常简单,我写了一个简单的例子,代码如下:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="application1_creationCompleteHandler(event)">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.FlexEvent;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.utils.UIDUtil;
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
service.url = "http://localhost:8080/demo/Test1.action?rnd=" + new Date().toString();
service.send();
}
protected function service_resultHandler(event:ResultEvent):void
{
Alert.show(String(event.result));
}
protected function service_faultHandler(event:FaultEvent):void
{
Alert.show("请求异常");
}
]]>
</fx:Script>
<fx:Declarations>
<mx:HTTPService id="service" <strong>resultFormat="text"</strong> result="service_resultHandler(event)" fault="service_faultHandler(event)" />
</fx:Declarations>
</s:Application>
通过service.url指定一个请求的地址,我添加了一个动态的参数,可以保证每次请求的都是最新的页面,防止页面被缓存
service.send();方法开始调用这个请求.
result事件是在调用成功后执行,fault事件是在调用失败后执行
resultFormat属性为text的时候,在result事件,可以通过String(event.result)得到请求页面的输出结果
Flex编程注意之直接获取某个组件的对象(this[]用法)通过id获取控件
http://www.cnblogs.com/exmyth/archive/2013/08/09/3248031.html
<page:UserInfo userVar="{user}"/>例如有个id为name的Object,在mxml的组件中,{name}便可以直接拿到值
如果在方法内,可以通过name.visible name.txt name.source直接获得或者改变值
轻松打造J2EE的 SSH 与flash builder整合(由Spring类管理)
http://www.cnblogs.com/jonneydong/archive/2012/03/26/2418749.html在此将我所配置方法,,告知大家..让大家少走弯路
下面将由我来 手把手教大家 如果 配置SSH 以及将flash builder整合到一起
并由Spring类来管理,,使flash builder直接通过AMF访问java后台类方
环境:
My Eclipse 8.5
Struts 1.2
Spring 2
hibernate 3.1
flash builder 4 / 或插件版
1.前期环境
新建项目名为: MyWeb
建包:
com.sshf.study.entity (实体包)
com.sshf.study.dao(数据访问包)
com.sshf.study.biz(业务逻辑)
并在 com.sshf.study.biz 包下
新建接口 IHelloWord.java
并再建包 impl, HellWordImpl.java 类(全速路径 com.sshf.study.biz.impl.HellWordImpl). 并实现IHelloWord接口
代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<span data-mce-=
""
>
package
com.sshf.study.biz;
import
com.sshf.study.biz.IHelloWord;
public
class
HelloWordImpl
implements
IHelloWord{
/**
* 测试方法
* @param name
* @return
*/
public
String sayHello(String name){
return
"HelloHello! "
+ name;
}
}
</span>
|
稍后我们会 测试调用这个方法!
2.开始SSH搭建.
a.首先加入Spring框架
自己加入DataSource sessionFactory 实体bean DAOBean 以及事务..养成好习惯
以下是我的初期配置(稍后会添加):
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
<span data-mce-=
""
><?xml version=
"1.0"
encoding=
"UTF-8"
?>
<!-- 导入命名空间-->
<beans xmlns=
"http://www.springframework.org/schema/beans"
xsi:schemaLocation="http:
//www.springframework.org/schema/beans
http:
//www.springframework.org/schema/beans/spring-beans-2.0.xsd
http:
//www.springframework.org/schema/tx
http:
//www.springframework.org/schema/tx/spring-tx-2.0.xsd
http:
//www.springframework.org/schema/aop
http:
//www.springframework.org/schema/aop/spring-aop-2.0.xsd">
<!-- 配置事务管理 -->
<bean id=
"myHibTxManager"
class
=
"org.springframework.orm.hibernate3.HibernateTransactionManager"
>
<property name=
"sessionFactory"
ref=
"sessionFactory"
/>
</bean>
<!--配置事务管理策略-->
<tx:advice id=
"txAdvice"
transaction-manager=
"myHibTxManager"
>
<tx:attributes>
<tx:method name=
"to*"
propagation=
"SUPPORTS"
read-only=
"true"
/>
<tx:method name=
"add*"
propagation=
"REQUIRED"
/>
<tx:method name=
"find*"
propagation=
"REQUIRED"
/>
</tx:attributes>
</tx:advice>
<aop:config>
<!--指定用于那些地方-->
<aop:pointcut id=
"bizMethods"
expression=
"execution(* com.sshf.study.*.impl.*.*(..))"
/>
<!-- 织入 -->
<aop:advisor advice-ref=
"txAdvice"
pointcut-ref=
"bizMethods"
/>
</aop:config>
<!-- dataSource -->
<bean id=
"dataSource"
class
=
"org.apache.commons.dbcp.BasicDataSource"
>
<property name=
"driverClassName"
value=
"com.microsoft.sqlserver.jdbc.SQLServerDriver"
>
</property>
<property name=
"username"
value=
"sa"
></property>
<property name=
"password"
value=
"dongqiao"
></property>
</bean>
<bean id=
"sessionFactory"
class
=
"org.springframework.orm.hibernate3.LocalSessionFactoryBean"
>
<property name=
"dataSource"
>
<ref bean=
"dataSource"
/>
</property>
<property name=
"hibernateProperties"
>
<props>
<prop key=
"hibernate.dialect"
>
org.hibernate.dialect.SQLServerDialect
</prop>
</props>
</property>
<property name=
"mappingResources"
>
<list>
<value>entity/ConfigQuestionSecondKind.hbm.xml</value>
<value>entity/EngageSubjects.hbm.xml</value>
<value>entity/ConfigQuestionFirstKind.hbm.xml</value></list>
</property>
</bean>
<!-- DAO -->
<!-- biz -->
<bean id=
"HW"
class
=
"com.sshf.study.biz.impl.HellWordImpl"
>
</bean>
<!-- action -->
</beans>
</span>
|
b.添加Struts支持
如用到Action 一定不要忘了改 代理类 org.springframework.web.struts.DelegatingActionProxy
c.添加hibernate支持.
以上二步省略.. 相信大家都会配..
3.开始将flash builder整合到SSH中
a.下载blazeDS包 将WEB-INF 文件夹下的所有文件夹和文件 拷贝到/WebRoot/WEB-INF/目录下
注意:包括web.xml 全覆盖
b.打开Web.xml 进行配置spring
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<span data-mce-=
""
><!--在web.xml中引入Spring的代码-->
<context-param>
<!-- 参数名为contextConfigLocation -->
<param-name>contextConfigLocation</param-name>
<!-- 配置多个文件之间,以
","
隔开 -->
<param-value>/WEB-INF/classes/app.xml</param-value>
</context-param>
<listener>
<listener-
class
>
org.springframework.web.context.ContextLoaderListener
</listener-
class
>
</listener>
</span>
|
(此处app.xml为spring配置文件名 默认为applicationContext.xml)
到此为止..SSH配置完毕..部署运行一下..看是否有错误..
如有错误 自己 改正. 在确保SSH集成后无错 方可 继续.!!
以下步骤很重要
b.新建包com.sshf.study.flash
在该包下新建二个类 SpringFactoryInstance.java FlexFactoryImpl.java
SpringFactoryInstance.java代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
<span data-mce-=
""
>
package
com.sshf.study.flash;
import
org.apache.commons.logging.Log;
import
org.apache.commons.logging.LogFactory;
import
org.springframework.beans.BeansException;
import
org.springframework.beans.factory.NoSuchBeanDefinitionException;
import
org.springframework.context.ApplicationContext;
import
org.springframework.web.context.support.WebApplicationContextUtils;
import
flex.messaging.FactoryInstance;
import
flex.messaging.FlexContext;
import
flex.messaging.FlexFactory;
import
flex.messaging.config.ConfigMap;
import
flex.messaging.services.ServiceException;
public
class
SpringFactoryInstance
extends
FactoryInstance {
private
Log log = LogFactory.getLog(getClass());
SpringFactoryInstance(FlexFactory factory, String id, ConfigMap properties) {
super
(factory, id, properties);
}
public
Object lookup() {
System.out.println(
"3---spring工厂类的方法lookup"
);
ApplicationContext appContext = WebApplicationContextUtils.getRequiredWebApplicationContext(FlexContext.getServletConfig().getServletContext());
String beanName = getSource();
try
{
log.info(
"Lookup bean from Spring ApplicationContext: "
+ beanName);
return
appContext.getBean(beanName);
}
catch
(NoSuchBeanDefinitionException nex) {
ServiceException e =
new
ServiceException();
String msg =
"Spring service named '"
+ beanName +
"' does not exist."
;
e.setMessage(msg);
e.setRootCause(nex);
e.setDetails(msg);
e.setCode(
"Server.Processing"
);
throw
e;
}
catch
(BeansException bex) {
ServiceException e =
new
ServiceException();
String msg =
"Unable to create Spring service named '"
+ beanName +
"'."
;
e.setMessage(msg);
e.setRootCause(bex);
e.setDetails(msg);
e.setCode(
"Server.Processing"
);
throw
e;
}
catch
(Exception ex) {
ServiceException e =
new
ServiceException();
String msg =
"Unexpected exception when trying to create Spring service named '"
+ beanName +
"'."
;
e.setMessage(msg);
e.setRootCause(ex);
e.setDetails(msg);
e.setCode(
"Server.Processing"
);
throw
e;
}
}
}
</span>
|
FlexFactoryImpl.java代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
<span data-mce-=
""
>
package
com.sshf.study.flash;
import
org.apache.commons.logging.Log;
import
org.apache.commons.logging.LogFactory;
import
flex.messaging.FactoryInstance;
import
flex.messaging.FlexFactory;
import
flex.messaging.config.ConfigMap;
public
class
FlexFactoryImpl
implements
FlexFactory {
private
Log log = LogFactory.getLog(getClass());
/*override interface method*/
public
void
initialize(String id, ConfigMap configMap) {
System.out.println(
"1---flex工厂实现类重写的方法initialize"
);
}
/*override interface method*/
public
FactoryInstance createFactoryInstance(String id, ConfigMap properties) {
System.out.println(
"2---flex工厂实现类重写的方法createFactoryInstance"
);
log.info(
"Create FactoryInstance."
);
SpringFactoryInstance instance =
new
SpringFactoryInstance(
this
, id, properties);
instance.setSource(properties.getPropertyAsString(SOURCE, instance.getId()));
return
instance;
}
/*override interface method*/
public
Object lookup(FactoryInstance instanceInfo) {
System.out.println(
"4---flex工厂实现类重写的方法lookup"
);
log.info(
"Lookup service object."
);
return
instanceInfo.lookup();
}
}
</span>
|
打开/WEB-INF/flex/services-config.xml 配置文件
加入FlexFactory实现类
<factories>
<factory id="flexFactoryImpl" class="com.sshf.study.flash.FlexFactoryImpl"/>
</factories>
打开/WEB-INF/flex/remoting-config.xml 配置文件
然后将 services中的factory的实现类所调用的类配置关联
<destination id="flash">
<properties>
<!-- flexFactory实现类 -->
<factory>flexFactoryImpl</factory>
<!-- 对外的访问类 为spring配置中的bean id -->
<source>HW</source>
<scope>application</scope>
</properties>
</destination>
到此为止 配置完毕
部署运行..有错误改之
4.新建一个flex 项目
并新建一个mxml
不一一做介绍了..添加一个 文本框 和一个 按钮..
点击 按钮 将 文本框中 字符串 传入到 HelloWordImpl 的 sayHello中.并取返回值 输出
代码如下:
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <fx:Script> <!--[CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; protected function button1_clickHandler(event:MouseEvent):void { var remote:RemoteObject = new RemoteObject(); remote.destination = "flash";//remoting-config中destination ID //访问地址可改 在web.xml中修改 这里默认 remote.endpoint = "http://localhost:8080/myWeb/messagebroker/amf"; remote.addEventListener(ResultEvent.RESULT, myResult);//添加访问成功后回调函数 remote.addEventListener(FaultEvent.FAULT,fault);//添加访问失败后回调函数 remote.sayHello(u.text);//执行 服务器类的 sayHell方法, } private function myResult(evt:ResultEvent):void{ Alert.show(evt.result.toString()); } private function fault(evt:FaultEvent):void{ Alert.show(evt.fault.message); } ]]--> </fx:Script> <fx:Declarations> <!-- 将非可视元素(例如服务、值对象)放在此处 --> <mx:RemoteObject id="say" destination="Test"> </mx:RemoteObject> </fx:Declarations> <s:Button x="451" y="251" label="按钮" click="button1_clickHandler(event)"/> <s:TextInput x="290" y="250" id="u"/> </s:Application>
比较简单的方法是,拷贝FlashBuilder中bin-debug下的相关HTML以及需要的js css swf文件,粘贴到eclipse中ssh工程的webcontent目录中,运行webservice,浏览器直接打开相关的HTML,flex调用ssh中的api。