flex3读书笔记----flex整合hibernate
开发环境的搭建IDE的版本： FlexBuilder3+mysql-5.0.20-win32（绿化版）+apache-tomcat-6.0.20（绿化版）+MyEclipse Blue Edition6.5.0 在myeclipse中新建一个web项目 File--àNew--àWeb Project-à输入项目名称（Fei）--à版本选最高的Java EE 5.0-à点击Finish ? ? ? ? 完成后的web 项目的目录结构
? ? 从网上下载blazeds.war文件----à改后缀（改为blazeds.rar）-à解压当前blazeds.rar文件，会出现两个文件夹 ? ? 选中这两个文件夹--à复制--à回到myeclipse中--à鼠标点击项目的WebRoot文件夹-à 按组合键CTRL+V--à会有一个探出框 ? ? 选择Yes To All ? 覆盖之后的两个文件夹的目录结构
? ? ? 把项目部署到Tomcat去
点击Finish之后，myeclipse端的操作就暂告一段落了（这时的tomcat还没run） ? 接下来打开FlexBuilder3 新建flex项目 FileàNew Flex Projectà输入项目名称（FeiFlex）--à后台类型选择J2EE- ? ? ? ? 点击Next--àRoot Folder这一栏选择tomcat安装路径下的webapps文件夹下的刚才myeclipse刚部署上去的web项目（Fei） ? ? 确定之后的截图 ? 点击Validate Configuration验证服务器是否启动，如果没启动就会出现如下警告信息 ? ? 这时，回到myeclipse启动tomcat（Fei项目之前已经部署上去的了） Tomcat启动之后的截图 ? ? 回到FlexBuilder3再次点击验证服务器，这时得到的验证信息结果是： ? ? 点击Finish，完成了myeclipse+ FlexBuilder3的环境搭建 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 环境搭建好之后，自然的就会想到小试一下牛刀后台采用的是hibernate实现持久化 ? 打开mysql管理工具，新建数据库名（jike），新建表（supermanager） ? ? ? ? ? ? ? ? ? ? ? ? ? 有了数据库和表之后就可以在myeclipse中建包了 项目包结构截图
? ? ? ? ? ? lib包是放mysql驱动包和hibernate的jar包 从网上下载mysql的驱动jar包和hibernate的jar包 Jar文件截图
? ? CTRL+A把下载来的jar全选---àCTRL+C（复制）---à去到myeclipse编辑器中，点击lib包-àCTRL+V(黏贴)--à这样全部jar就已经加入了工程中（还没导入,这些jar还不能用）- --à用鼠标点击项目名，选最后一项（Properties）--à会弹出一个对话框 ? ? ? ? 点击Java Build Path ---à选择Libraries--àAdd JARs---à把你src文件夹下的lib包里面的jar全部导入工程中去 ? ? ? 这时lib包这样显示的代表导入成功 ? 看似是空文件夹一样的效果 ? ? ? 导入必要的jar后，就可以写实体类了 Pojo包就是放实体类的文件夹（这里以supermanager类为列） ? ? package pojo; ? public class SuperManager { ? ??? private int id;//对应数据库supermanager表的id ??? private String userName;// 对应数据库supermanager表的name ??? private String password;// 对应数据库supermanager表的password ??? public int getId() { ?????? return id; ??? } ??? public void setId(int id) { ?????? this.id = id; ??? } ??? public String getUserName() { ?????? return userName; ??? } ??? public void setUserName(String userName) { ?????? this.userName = userName; ??? } ??? public String getPassword() { ?????? return password; ??? } ??? public void setPassword(String password) { ?????? this.password = password; ??? } } ? ? ? hbm文件夹是放实体类与数据库表的映射文件 ? ? ? ? ? ? ? ? SuperManager.hbm.xml的文件内容如下 ? ? ? ? ? ? ? cfg文件夹是放hibernate的主配置文件Hibernate.cfg.xml ? 文件内容如下 <?xml version='1.0' encoding='utf-8'?> <!DOCTYPE hibernate-configuration PUBLIC?? "-//Hibernate/Hibernate Configuration DTD 3.0//EN"? "http://hibernate.sourceforge.net/hibernate-configuration-3.0.dtd"> <hibernate-configuration> ??? <session-factory> ?????? <!-- 数据库连接配置--> ?????? <property name="connection.driver_class">com.mysql.jdbc.Driver</property> ?????? <property name="connection.url">jdbc:mysql://localhost:3306/jike</property> ?????? <property name="connection.username">root</property> ?????? <property name="connection.password"></property> ? ?????? <!--? 连接池配置 --> ?????? <property name="connection.pool_size">1</property> ? ?????? <!-- 不同数据库使用的SQL选择:方言 --> ?????? <property name="dialect">org.hibernate.dialect.MySQLDialect</property> ? ?????? <!--决定是采用thread或jta或自定义的方式来产生session? --> ?????? <property name="current_session_context_class">thread</property> ? ?????? <!--二级缓存策略?? --> ?????? <property name="cache.provider_class">org.hibernate.cache.NoCacheProvider</property> ? ?????? <!-- 是否在控制台上打印SQL --> ?????? <property name="show_sql">true</property> ? ?????? <!-- 是否根据配置自动创建库表 --> ?????? <!--<property name="hbm2ddl.auto">create</property>--> ?????? <mapping resource="hbm/SuperManager.hbm.xml"/> ??? </session-factory> </hibernate-configuration> ? ? ? 接下来就剩下最后一个包了connFlex，这个包是放与flex建立连接映射的类 package connFlex; ? import java.util.List; ? import org.hibernate.Query; import org.hibernate.Session; import org.hibernate.SessionFactory; import org.hibernate.Transaction; import org.hibernate.cfg.Configuration; ? import pojo.SuperManager; ? ? ? public class QuerySuperManager { ? ? ??? ///验证登陆 ??? public List<SuperManager> LoginSuperManagerConn(SuperManager s){ ?????? System.out.println("xxxxx"); ?????? List<SuperManager> list=null; ?????? Configuration config= new Configuration(); ?????? //通过Configuration去加载主配置文件 ?????? config.configure("cfg/Hibernate.cfg.xml"); ?????? //建立SessionFactory会话工厂 ?????? SessionFactory sf= config.buildSessionFactory(); ?????? //建立Session会话 ?????? Session session=sf.openSession(); ?????? //如果要进行增删改的动作，那么要开启事务 ?????? Transaction t= session.beginTransaction(); ?????? try{ ?????????? //插入的操作,通过Session对象去操作 ?????????? //如果hbm映射配置文件中有指明主键生成的策略方式， ?????????? Query q = session.createQuery("select sm from SuperManager sm where "+"sm.userName='"+s.getUserName()+"'"); ?????????? list=q.list(); ?????? //执行插入的操作 ?????? //session.save(fa); ?????? //如果成功操作，那么提交 ?????? t.commit(); ?????? }catch(Exception e){ ?????????? //否则操作不成功，那么回滚数据 ?????????? t.rollback(); ?????????? e.printStackTrace(); ?????? }finally{ ?????????? ?????? ??? session.close(); ?????????? sf.close(); ?????? } ?????? ?????? return list; ??? } ??? } ? 以上就是java后台的全部代码类 ? 下面一步是关键步骤 在myeclipse中找到项目webRoot文件夹下的flex文件夹的remoting-config.xml ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 打开这个文件remoting-config.xml 文件内容如下 <?xml version="1.0" encoding="UTF-8"?> <service id="remoting-service" ??? class="flex.messaging.services.RemotingService"> ??? <adapters> ??????? <adapter-definition id="java-object" class="flex.messaging.services.remoting.adapters.JavaAdapter" default="true"/> ??? </adapters> ??? <default-channels> ??????? <channel ref="my-amf"/> ??? </default-channels> ??? <destination id="querySuperManagerConn"> ????? <properties> ??????? <source>connFlex.QuerySuperManager</source> ????? </properties> ?? </destination> </service> ? 这样写之后connFlex下的QuerySuperManager这个类我们在flex的页面中就可以用了 ? ? 通过以上的配置之后，myeclipse的步骤操作完毕 ? ? ? 既然后台代码已经全部搞定，接下来自然而然的，就是写flex前台代码了 我用的是最简单的方式跟后台交互，如果要开发商业代码的话， 听说一般是用的是Cairngorm.swc这个框架结合spring+hibernate，当然这个网上资料很多，我相信只要是小小入门的人都能掌握，只是前端又多了一个flex的mvc。 ? ? 废话不多说，马上进入前端代码的编写 要实现的是登陆功能 ? 前台项目包结构 ? ? ? 先在flex项目中新建一个entity包（用来放flex的实体类） ? ? ? ? 实体类代码如下： package entity { ???? //这句是让前台的实体类与台???????????????????????????????????????????????????????????????????????????????????????????? //的实体类对应 ???? [RemoteClass(alias="pojo.SuperManager")] ??? public class SuperManager ??? { ?????? public function SuperManager() ?????? { ?????? } ??????? ?public var id:int;//对应后台实体类的id ?????? public var userName:String;//对应后台实体类的userName ?????? public var password:String;//对应后台的password ? ??? } } 首先是写登陆框的代码 Fileànew 一个新的mxml文件，命名为LoginWindow.mxml 全部页面代码如下： <?xml version="1.0" encoding="utf-8"?> <mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="300" ??? ??? ?title="登录" fontSize="18" ??? ?close="this.close()" xmlns:mapping="mapping.*" creationComplete="{}"> ??? <mx:Script> ?????? <![CDATA[ ?????????? import mx.rpc.events.ResultEvent; ?????????? import flash.net.navigateToURL; ?????????? import mx.managers.PopUpManager; ?????????? import mx.controls.Alert; ?????????? ? import mx.events.MenuEvent; ??????????? import mx.collections.*; ??????????? import mx.rpc.events.FaultEvent; ?????????? ?import mx.rpc.events.ResultEvent; ???????????? import entity.*; ????????? ?????????? [Bindable] ??????????? public var userNameInPop:TextInput; ??????????? [Bindable] ??????????? public var userEmailInPop:TextInput; ????????????????????? [Bindable]??? ??? private var linkData30:ArrayCollection = new ArrayCollection();//验证登陆的数据 ?????????? public function close():void { ?????????? //Alert.show("关闭登录窗口"); ????????????? PopUpManager.removePopUp(this); ?????????? } ????????????? public function queryStudent():void{ ????????????????? ????????????????? //navigateToURL(new URLRequest('http://localhost:8080/StudentMangerSystem/bin-debug/Fei.html'),'_blank'), ?????????? } ?????????? public function Login():void{ ?????????? ?????????? var tempSm:SuperManager=new SuperManager(); ?????????? tempSm.userName=UserName.text; ?????????? tempSm.password=userPassword.text; ???????????? //下面这句代码是调用后台的LoginSuperManagerConn函数，同时把前台的//一个SuperManager实体类对象传到后台 ?????????? remoteObject30.LoginSuperManagerConn(tempSm) ?????????? } ?????????? ??????????????????????????????? ?? //登陆 ?????????? ?//这个是执行了Login函数的回调函数 ??? private function resultHandler30(event:ResultEvent):void{ ?????????? ?????? ?? var ac: ArrayCollection = event.result as ArrayCollection; ?????? ? // ?????? ?? if(ac.length>0){ ?????? ?? ??? ?????? ??????? Alert.show("验证成功"); ?????? ??????? this.close(); ?????? ?? }else{ ?????? ?? ?????? ?? Alert.show("验证失败，请重新输入"); ?????? ?? ?????? ?? } ?????? ?? ?????? ?? } ?????????? //这个是执行了Login函数后台出现异常或者错误的回调函数 ?????????? private function faultHandler30(event:FaultEvent):void{ ????????????? ????????????? ?Alert.show(event.fault.toString(),"提示"); ????????????? ?????????? } ?????? ]]> ??? </mx:Script> ??? <mx:VBox paddingLeft="37" paddingTop="80"> ??? <mx:HBox paddingLeft="37" paddingTop="5"> ??? <mx:Label text="用户名："/> ???? <mx:TextInput? paddingLeft="7" color="#991010" id="UserName" text="{}"/> ??? </mx:HBox> ??? <mx:HBox paddingLeft="37" paddingTop="5"> ??? <mx:Label text=" 密 码 ："/> ??? <mx:TextInput? paddingLeft="7" color="#991010" id="userPassword" text="{}" displayAsPassword="true"/> ?? </mx:HBox> ?? </mx:VBox> ?? ?<mx:ControlBar height="60" width="300"> ????????????? <mx:ComboBox? prompt="身 份 " width="100%"> ????????????????? <mx:dataProvider> ???????????????????? <mx:Array> ???????????????????????? <mx:Object label="超级管理员"/> ???????????????????????? <mx:Object label="普通管理员"/> ?????? ????????????????? <mx:Object label="学生"/> ???????????????????????? <mx:Object label="老师"/> ???????????????????? </mx:Array> ????????????????? </mx:dataProvider> ????????????? </mx:ComboBox> ?????????? <mx:Button label="确认" paddingLeft="85" click="{this.Login()}"/> ?????????? <mx:Spacer width="250"/> ?????? </mx:ControlBar> ?????? <mx:RemoteObject id="remoteObject30" ?????????? ?? destination="querySuperManagerConn"//这个destination是在//???????????????????? remoting-config.xml的destination的id ?????? ?? source="connFlex.QuerySuperManager" ?????? result="resultHandler30(event)"//正常回调函数 ?????? fault="faultHandler30(event)"/>//出现异常回调函数 ??? </mx:TitleWindow> ? ? ? ? 再就是新建一个index.mxml文件 代码内容如下： <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" themeColor="0x000000" ??? initialize="{}" xmlns:local="*" creationComplete="{this.showTitleWin()}"> ??? ??? ??? <mx:Script> ??????? <![CDATA[ ??????????? import mx.events.MenuEvent; ??????????? import mx.controls.Alert; ??????????? import mx.collections.*; ??????????? import mx.managers.PopUpManager; ??????????? import mx.rpc.events.FaultEvent; ?????????? ?import mx.rpc.events.ResultEvent; ???????????? import mx.collections.ArrayCollection;? ???????????? import entity.*; ???????????? import flash.display.Sprite; ????????? ????? // 登陆窗口 ????????????? public function showTitleWin():void { ?? ??????? var twin:LoginWindow=LoginWindow(PopUpManager.createPopUp(this,LoginWindow,true)); ?? ??????? twin.userNameInPop=userName; ?? ??????? twin.userEmailInPop=email; ?? ??????? ?? ??????? ?? ??????? PopUpManager.centerPopUp(twin); ?? ??????? ?? ???? } ??? ? ?????? ?????????? ???????? ]]> </mx:Script> </mx:Application> ? K.O,这样一个简单的登陆功能就实现了，要是有过小小开发经验的人，都会知道，调用后台对应的方法，同时把一个对象作为参数，那就相当于把后台的增、删、改操作都完成了。 无图无真相，下面是我的登陆功能的结果截图 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 登陆失败的截图 ? ? 登陆成功后的截图 ? ? 点击ok后，就会进入index页面 ? ? ? Flex页面展示数据一般用的是Datagrid控件 // this.linkData30这个是跟前面的一样 //private var linkData30:ArrayCollection = new ArrayCollection(); RemoteObject对象每执行一次都会有一个回调函数，接受后台返回的list。你只要在回调函数中这样写， This.linkData30=event.result as ArrayCollection; 因为flex都是异步的，当返回有数据时，datagrid就会显示数据了，只要绑定好数据源就ok ? <mx:DataGrid id="myDG" dataProvider="{this.linkData30}" ???????????????????? creationComplete="{}" width="507" ???????????????????? height="300" fontSize="20" itemClick="{this.DataGridItemClick(event)}"> ???????????????????? <mx:columns> ?????????? ??????????????? <mx:DataGridColumn dataField="id" headerText="id" width="57"/> ?????????? ??????????????? <mx:DataGridColumn dataField="userName" headerText="userName" width="350"/> ?????????? ??????????????? <mx:DataGridColumn dataField="password" headerText="password" width="100"/> ?????????? ??????????? </mx:columns> ????????????????? </mx:DataGrid> ? ? ? ? DataGrid选中一行点击事件 ??????????? ???? ????????public function DataGridItemClick(evt:ListEvent):void{ ???????????? ??????????????? Alert.show(myDG.selectedItem.id+"--"+myDG.selectedItem.userName+"--"+myDG.selectedItem.password); ? } ? 注意：DataGrid对应的的intemClick是ListEvent， 所以要引入import mx.events.ListEvent; ? ? ? Datagrid头部样式 .dataGridHeader { ??? color: #FFFFFF; ??? fontWeight: bold; ??? textAlign: center; } flex的DataGrid中，如果有一列是大文本，当文本很大的时候，行的高度会被撑开，如何将行高度固定，多出来的文本变为省略 ? ???????????? 去掉wordwarp属性,给列添加itemrenderer <mx:itemRenderer> <mx:Component> <mx:Label?text="{data.***}"truncateToFit"true"/> </mx:Component> </mx:itemRenderer> ? ? 目前还没找到解决方案的问题： 问题1： Datagrid添加发光特效后，里面的单元格就不能选中。鼠标点击无效 效果如下 ? ? 问题2： MenuBar控件子项的样式无效，就是不能给子项写样式 ? ? 要测试页面，直接在IE输入地址或者在FlexBuilder3中直接运行那个mxml文件即可 六月临近了，希望这篇日志能给即将毕业的师兄师姐们带来一点点的帮助，祝早日找到好的工作。 word版下载地址 http://download.csdn.net/source/3163113 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |