FLEX操作XMLJSON.doc

/articles/flex-xml-json Flex for XML and JSON （Flex分别与XML和JSON结合使用的例子） Flex与Java的结合就是美貌与智慧的结合。或者反过来说也可以。但是有什么可以作为证明呢？根据我的经验将Flex和Java结合起来用确实能够创建出更出色的RIA应用程序。哪么什么是Flex呢？Flex是一种开源的框架，（除了ActionScript 3.0）利用MXML语言可以用来编写Flash应用程序。 首先你需要从网站(/flex)上下载Flex IDE也就是Flex Builder。Flex Builder是需要付费的软件，但是他的试用期很长。你可以利用这段时间考虑它是否值得花钱购买。这篇文章将要展示怎样将Flex和Java结合起来使用。在服务器端Java。在客户端运行Flex。你可以自由设定这两者之间的协议。然而在这种情况下，我会首先使用XML再使用JSON，因为，这两种语言是Web2.0世界中最常见的标准语言。 在服务器端创建程序片段 列表1是以XML语言为先例创建的见JSP文件。 这段程序输出两个公司（compa 和 compb）的随机的股票数据，为期30天。第一个公司股票的起始价格为$1000，第二个公司为$900，JSP码每天给这两个值添加随机影响因素。 当我在命令行中通过‘curl’客户端访问程序时，获得如下结果： 根标签为days其中包含了一组day标签。每个day标签都由一个num标签表示当天的数字，用compa的值A公司的股票价格，compb标签表示B公司的股票价格。两个公司的股票价格按照要求随机生成。 创建浏览界面 已经有了一个web程序输出股票价格，我还需要一个客户端程序做浏览使用。首先要创建一个网状的界面用来简单显示数据。要创建一个Flex程序，我们首先在Flex Builder IDE的新建目录里选择Flex Project，如图1所示: 在这个页面里，我们所要做的就是给程序命名。我给这个‘XML数据表’，命名为xmldg。这样就创建了一个带有标签的xmldg.mxml文件。下一步就是将列表2中的代码写入这个空白程序，这是关键的一步。 Listing 2. xmldg.mxml?xml version=1.0 encoding=utf-8? mx:Application xmlns:mx=/2006/mxml layout=vertical mx:XML source=http://localhost:8080/jsp-examples/flexds/xml.jsp id=stockData / mx:Panel title=Stock Data width=100% height=100% mx:DataGrid dataProvider={stockData..day} width=100% height=100% mx:columnsmx:DataGridColumn dataField=compa / mx:DataGridColumn dataField=compb / /mx:columns/mx:DataGrid/mx:Panel/mx:Application 这段程序代码中由两个主要组件（components）。第一个是mx:XML标签，它告诉Flex已经存在一个XML数据源并赋予它URL.这将会产生一个局部变量，叫做StockData（由id属性指定）。mx:DataGrid组件以它为数据供应。 其他的代码则只是界面。mx:Panel对象给表格周围贴了一层漂亮的壁纸。mx:DataGrid对象显示数据。在mx:DataGrid内有一组mx:DataGridColumn指定对象指示表格显示数据 如下所示为在Flex Builder中生成文件 我们可以对这个页面实施滚动列表，调整窗口大小，看到数据表的大小变化。 添加过滤功能，我们需要修改代码，添加一个mx:HSlider控件（control）即一个水平的滚动条，指定表格中显示数据的起始日期。 例如，如果给滚动条赋值6，则表格显示的数据从第6天开始。列表3中显示的是相关的代码 Listing 3. xmldg2.mxml?xml version=1.0 encoding=utf-8? mx:Application xmlns:mx=/2006/mxml layout=verticalmx:XML source=http://localhost:8080/jsp-examples/flexds/xml.jsp id=stockData /mx:Panel title=Stock Data width=100% height=100% layout=vertical p