现在的位置: 首页 > 综合 > 正文

终于把自己的flex环境搭起来了,

2013年08月08日 ⁄ 综合 ⁄ 共 3444字 ⁄ 字号 评论关闭

抽空写一下总结,其实很忙的,搞了二天了,第三天的中午终于成功了,写了第一个hellowold,费话少说,开始正题

1.开发工具,在这里搞了二天,下载的AdobeFlexBuilder3.0.1ProfessionalEclipsePlug-in.exe就去找eclipse,下了好多版本的都不行,在官网上下的最新的也不行,老是提示要3.2,3.3,3.4的版本,找了大半天后,在一个博客里找到了3.2的版本,下载好慢哦,我试过了MyEclipse6.0.1GAE3.3.1Full.exe不行,换了easyeclipse-server-java-1.2.2.2.exe也不行,不知道是我机器本身的原因还是flexbuilder升级了,按网站上的说法就是装不上插件,最后下了MyEclipse5.5.1GAE3.2.2.exe是可以的,但没有tomcat插件后来就没有用,最后搞的eclipse3.2不记得是在哪里下载了,没有找到,就不写了,最主要的是配上tomcat插件

JDK1.5的安装,不说了

Tomcat5.5也不说了

 

LCDS可以到下载地址(官方):https://www.adobe.com/cfusion/tdrc/index.cfm?product=livecycle%5Fdataservices

 安装好AdobeFlexBuilder3.0.1ProfessionalEclipsePlug-in.exe就可以在eclipse的菜单window下preferences弹出的对信息框上就可以看到flex这个选项,要是没有,就没有安装成功,在安装的过程中,如果eclipse的版本不适合会有提示的,

再就安装lcds这东西随便安装好就行了,主要是看里面的lcds.war,其它的都是用来参考的

接下来按下面提示的做就行了

1.首先创建一个Web项目,如图所示:

2.然后把这个项目部署到Tomcat服务器上的,我用的是Tomcat5.5.

3.接下来,如果你已把LCDS安装好了的话,那么你就到LCDS文件夹下面把lcds下的WEB-INF里的lib,flex两个文件夹考到你的FlexDemo项目里的WEB-INF下。

4.接下来就是向现有的项目中添加FLEX特性了。回到你的Eclipse中在你的项目上右击->Flex Project Nature->add Flex Project Nature ,如图所示:

 

 

 

 

Next

 

 

 

注意了!!!!!

这里的Root folder要指向你Tomcat下的Webapps里的项目下面,

Root URL是你用来调试用的,localhost后面的FlexDemo名子要和上面Root folder里的FlexDemo要相同,

Context root 这里也是的,

output folder这里要指向你Eclipse项目里的WebRoot下面,这样就好了,如图所示:

 

 

 

 

这里点一下Validate Configuration进行校验一下,就可以了!!然后点Finish完成!

 

接下来就是配置环境了,对于初学者来说,这很麻烦也很乱,不过不要紧,你一点点理清了,也不是件难事!呵呵,俺就是这样过来的!

 

现在部署一下你的项目吧,如果没有开启,那再开启WEB服务器,开启完成后,你会发现在可以选中,右击,选中“recreate HTML Templates.你再刷新一下项目,你会看到项目里新增了一个“html-templates”文件夹,现时在WebRoot下面也会出现你FlexDemo.mxml编译后生成的FlexDemo.html文件了,哈哈

 

接下来要写代码了

先在index.jsp里面随便写点吧

<body>

    This is my JSP page. <br>

    <hr>

    Hello World!!

    <hr>

    <a href="./FlexDemo.html">goto FlexDemo</a>

  </body>

 

然后在FlexDemo.mxml也随便写点吧:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

    <mx:Button x="178" y="150" label="Button"/>

    <mx:Button x="277" y="150" label="Button"/>

    <mx:Button x="221" y="180" label="Button"/>

    <mx:TextArea x="182" y="98"/>

   

</mx:Application>

 

好,我们先来看看能不能实现这个链接!

最后确认一下你的WEB服务器有没有开启,如果开启了,那请你找开IE,在地址栏里写上

http://localhost/FlexDemo

如果你设置的端口号是8080,那要加上了,我用了80端口啦,所以不用写了,呵呵…………

 

 

 

修改FlexDemo.mxml代码,进行数据交互:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

   

     <mx:RemoteObject id="RO" destination="QueryData">

        <mx:method name="getData" result="queryResultHandler_1(event)" fault="faultEvent(event)"/>

        <mx:method name="getDataByName" result="queryResultHandler_2(event)" fault="faultEvent(event)"/>  

    </mx:RemoteObject>

   

    <mx:Script>

       <![CDATA[

           import mx.events.*;

            import mx.rpc.events.ResultEvent;

           [Bindable]

              private var CData:String;

          

           private function faultEvent(e:Event):void{

               ta.text = "通讯失败,请稍后重试.";

            }

          

           private function change_1(e:Event):void{

                        RO.getData();

            }

           

            private function change_2(e:Event):void{

                        RO.getDataByName(taname.text.toString());

            }

           

           

           public function queryResultHandler_1(event:ResultEvent):void{

                        var result:String=String(event.result);

                        CData=result;

           }

          

          

           public function queryResultHandler_2(event:ResultEvent):void{

                        var result:String=String(event.result);

                        CData=result;

           }  

          

           public function clearText():void{

               ta.text="";

     

抱歉!评论已关闭.