Myeclipse10 + Flex4.6 集成开发 配置

原创 2013年12月05日 15:14:48

第一篇 博客,记录 Arcgis Server 开发之路

最近,要研究生毕业了,找了份工作,是做Arcgis二次开发的,之前没怎么做过,从今天开发学习。

由于在公司实习用过Flex,这几天在网上荡来荡去,发现Arcgis有Flex Api,用Flex做二次开发的前端,好处有一大堆,我就不说了。

现在Web企业系统基本上都是基于j2ee的,因此Arcgis二次开发也大多数是基于j2ee的,也由于我javaweb比较熟悉吧。

搭配环境是开发的第一步。

下面是我搭Myeclipse + Flex + Blazeds开发的步骤,可以完美实现。

第一步:

建立WEB项目:

点击finish;

 

 

第二步:

右键WebRoot

点击import:

点金FileSystem:

点击Browse:

选择blazeds的解压缩文件夹:在blazeds文件夹下有两个子文件夹,分别是:

META-INF,WEB-INF,导入之后,如下图所示:

点击finish,在弹出的对话框选择yes  to  all

这时候项目结构如下:

 

第三步:

把项目部署到tomcat中

第四步:

右键项目名称:选择 添加/更改项目类型,选择添加FLEX项目类型,如下图所示:

配置如下:

点 next:

配置如下:

 

一开始会提示你先点击验证配置,这个不用管,先把配置弄好,再点击验证配置,

根文件夹:前面你部署项目到tomcat,直接去tomcat下的webapps找到项目

根url:http://localhost:tomcat端口号,我的是8080/项目名称(flexDemo)

上下文根目录:和项目名称一致(flexDemo)

输出文件夹:我是手动填写的,没用默认的,这里是WebRoot

完成之后点击验证配置,

点击finish:项目结构如下:

项目有错误,去找

点击右键:

错误就消失了。

第四步:

往flexDemo文件里面拖放一个DataGrid控件,代码如下:

<?xmlversion="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:Declarations>

        <!-- 将非可视元素(例如服务、值对象)放在此处 -->

    </fx:Declarations>

    <mx:DataGrid x="138" y="67">

        <mx:columns>

            <mx:DataGridColumn headerText="列 1" dataField="col1"/>

            <mx:DataGridColumn headerText="列 2" dataField="col2"/>

            <mx:DataGridColumn headerText="列 3" dataField="col3"/>

        </mx:columns>

    </mx:DataGrid>

   

</s:Application>

 

部署到tomcat下,启动tomcat

在浏览器输入:http://localhost:8080/flexDemo/flexDemo.html

出现如下所示画面就说明成功了:

第五步:建立java与Flex的通信:

 

首先在src下创建两个类:P和PS

package test;

 

public class P {

   

String name;

    public String getName() {

        return name;

    }

    public void setName(String name) {

        this.name = name;

    }

    public P(String n){

        this.name=n;     

    }

}

 

package test;

 

import java.util.ArrayList;

import java.util.List;

 

public class PS {

 

    public List getList(){

        List l=new ArrayList();

        for(int i=0;i<10;i++){

            l.add(new P("第"+i+"个"));

           

        }

        return l;         

    }

}

 

第六步:

WEB-INF文件夹下的flex中在remoting-config.xml文件中定义 PS对应的 destination

<destination id="test">

    <properties>

        <source>test.PS</source>

    </properties>

</destination>

 

flexDemo.mxml代码如下:

<?xmlversion="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="init()">

    <fx:Script>

        <![CDATA[

            import mx.controls.Alert;

            import mx.rpc.events.ResultEvent;

            import mx.rpc.events.FaultEvent;

           

            [Bindable]

            private varemployeeList:Object;

           

            private function init():void {

                employeeServiceRO.getList();

            }

           

            private function resultHandler(event:ResultEvent):void {

                employeeList =event.result;

            }

           

            private function faultHandler(event:FaultEvent):void {

                //Alert.show(event.fault.faultString, 'Error');

                Alert.show(event.toString(),'Error');

            }

        ]]>

    </fx:Script>

    <fx:Declarations>

        <mx:RemoteObject id="employeeServiceRO" destination="test"

                         result="resultHandler(event);"

                         fault="faultHandler(event);"/>

    </fx:Declarations>

    <mx:DataGrid x="32" y="25" width="400" dataProvider="{employeeList}">

        <mx:columns>

            <mx:DataGridColumn headerText="Name" dataField="name"/>

        </mx:columns>

    </mx:DataGrid>   

</s:Application>

注意:<mx:RemoteObject> 中的destination必须与remoting-config.xml中的destination中的id名称一样,这里都是test

第七步:修改隐藏文件夹的配置信息:

可以去项目所在的目录中找,也可以在myeclipse直接修改,如下所示:

点击之后如下所示:

点一下 把前面的勾去掉,点击OK,就可以显示隐藏文件了,项目结构如下所示:

打开flexProperties文件:

修改配置信息:

serverContextRoot="flexDemo"

将serverContextRoot改为你项目的名称,如果本来就是项目名称就不用改了,然后刷新一下项目,右键项目名称,点击refresh;

重新部署,启动tomcat,打开浏览器输入:http://localhost:8080/flexDemo/flexDemo.html

出现如下界面,说明项目成功:


相关文章推荐

MyEclipse10配置PyDev进行Python开发

MyEclipse10配置PyDev进行Python开发   1、下载PyDev 2.7.1  链接如下:    http://jaist.dl.sourceforge.net/project/...

MyEclipse10中配置开发Python所需要的PyDev

在NLP(自然语言处理)这个领域中,Python具有良好的声誉,于是也想学习一下。首先第一步就是需要在计算机上配置Python环境。由于Python自带的编辑器太简单,使用起来不顺手,于是就考虑在相对...

MyEclipse10配置Python开发环境

Pydev 是eclipse的一个插件,当然也适合myeclipse。 首先是准备工作,你必须安装了myeclipse与 python,这里我分别安装是myeclipse10和python2.7,安...

MyEclipse10 开发 Android 环境配置

RT... 最近趁我还有点时间,打算在搞下Android.. 现在来记录一下我在MyEclipse10 搭建Android环境. 首先就是你要装MyEclipse10 ..破解之类这么和谐的事情我是不...
  • hwb1992
  • hwb1992
  • 2014年05月12日 18:23
  • 685

MyEclipse10安装Flex插件后变成中文的解决办法

MyEclipse10安装Flex插件后变成中文的解决办法         最近在学习Flex框架,用了官方的Flash Builder4.5,但是感觉功能不是太怎么强大,于是又想和MyEclips...

myeclipse10 集成jbpm4.3

1.首先下载jbpm 地址http://sourceforge.net/projects/jbpm/files/jBPM%204/ 并解压得到jbpm-4.3文件夹 2.打开myeclipse1...

struts2集成tiles2.myeclipse10教程

  • 2013年01月18日 14:58
  • 4.68MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Myeclipse10 + Flex4.6 集成开发 配置
举报原因:
原因补充:

(最多只允许输入30个字)