flex3读书笔记----flex整合hibernate_flex sessionfactory connection-CSDN博客

本文链接：https://blog.csdn.net/httk526/article/details/6303757

开发环境的搭建

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="dialect">org.hibernate.dialect.MySQLDialect</property>

<property name="current_session_context_class">thread</property>

<property name="cache.provider_class">org.hibernate.cache.NoCacheProvider</property>

</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">

<adapter-definition id="java-object" class="flex.messaging.services.remoting.adapters.JavaAdapter" default="true"/>

</adapters>

<default-channels>

</default-channels>

<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