作业帮 > Access > 教育资讯

Access教程:Flash+ASP+XML+Access开发留言本

来源:学生作业帮助网 编辑:作业帮 时间:2024/11/27 09:48:52 Access
Access教程:Flash+ASP+XML+Access开发留言本
Access教程:Flash+ASP+XML+Access开发留言本Access
【无忧考网-Access教程:Flash+ASP+XML+Access开发留言本】:

开发Flash留言本一直都是Flash后台交互的进阶技术,本例通过ASP和XML简单高速地同数据库交互。


出自:Flash CS4动画设计与制作208例 作者:望月狼


本例思路:
<1> 创建数据库。
<2> 编写ASP程序。
<3> 在Flash中制作留言本皮肤。
<4> 编写AS与ASP程序交互。


实例步骤:
(1)先安装IIS服务器,安装方法请查阅相关资料。
(2)交互流程:


显示:使用ASP读取数据库数据再输出成XML,Flash再去读取这个XML文件。


留言:Flash将用户输入留言内容发送给ASP,ASP接收到数据后再存入数据库。


交互流程如图所示。



 


图14-1 流程图


(3)本范例使用到的三个ASP文件为:


“head/conn.asp”打开数据库。


“listXML.asp”读取ACCESS数据库里的数据并转化为XML格式显示出来。


“post.asp”接收Flash里的值存入数据库。


(4)先创建数据库名为“db.mdb”,新建一个表名为“book”,各字段与作用如图14- 2所示.



 


图14-2 新建表


(5)先编写打到数据库的conn.asp文件。


 


ASP/Visual Basic代码


 

<%    
Db = "head/db.mdb"   
conn = "Provider = Microsoft.Jet.OLEDB.4.0;Data Source = " & Server.MapPath(db)    
%>

 



(6)编写显示留言列表的ASP文件listXML.asp,先打开表“book”。


 


ASP/Visual Basic代码


 

<%@LANGUAGE="VBSCRIPT" %>    
    
<%    
set rs = Server.CreateObject("ADODB.Recordset")    
rs.ActiveConnection = conn    
rs.Source = "SELECT * FROM book ORDER BY id DESC"   
rs.CursorType = 0    
rs.CursorLocation = 3    
rs.LockType = 1    
rs.Open()    
%>

 




 



(7)在Flash中读取数据库数据时,还要考虑分页的问题,我们每次默认读取10条数据可以在调用时设置显示条数,使用变量“itemNum”。并判断当前显示的页码,使用变量“pageNum”。


 


ASP/Visual Basic代码


 

<%    
Dim itemNum,pageNum,recordTotal    
itemNum = Request.QueryString("itemNum")    
If itemNum <> "" Then   
 itemNum = Int(itemNum)     
 else    
itemNum =10    
end if    
recordTotal = rs.RecordCount    
pageNum = Request.QueryString("pageNum")    
If pageNum <> "" Then   
 pageNum = Int(pageNum)    
 rs.move(pageNum*itemNum)    
  end if    
%>

 



(8)将数据打印成XML文件现显出来。


 


ASP/Visual Basic代码


 

    
     
<%     
While ((itemNum <> 0) AND (NOT rs.EOF))     
%>    
<%    
id=rs("id")    
myname=Trim(rs("name"))    
mytitle=Trim(rs("title"))    
msg=Trim(rs("msg"))    
qq=Trim(rs("qq"))    
redate=Trim(rs("date"))    
%>    
     
<%     
  itemNum=itemNum-1    
  if NOT rs.EOF then    
  rs.MoveNext()    
  end if    
Wend    
%>    

 








 


技术看板:代码解释


第27行,标识XML版本与语言类型。


第28行,使用属性total记录数据库所有数据。


第40行,输出XML元素,每条记录着一条用户留言。


(9)使用IE浏览“listXML.asp”,这个XML文件的结构比较简单,每条留言记录都是一个XML节点名为“item”,使用节点属性来存放数据,XML结构可以更为简洁,如图14-4所示。


 



图14-3 listXML.asp


(10)打开Flash先制作一个用于显示留言列表的“显示条”,画个矩形背景再创建两个文本框名为“title”和“date”用来显示标题和日期,如图14-5所示。


 



图14-4 制作“显示条”


(11)将“显示条”转化为影片剪辑名为“item”,类路径为“com.GB4.Item”,如图1- 所示。



 


图14-5 转化为影片剪辑


(12)编写显示条的AS类文件“Item.as”。


 


AS3代码


 

package com.GB4{    
    import flash.display.*;    
    import flash.events.*;    
    import flash.events.IOErrorEvent;    
    import flash.system.System;    
    import flash.text.TextField;    
    public class Item extends MovieClip {    
        var id:Number;    
        public function Item() {    
            stop();    
            this.addEventListener(MouseEvent.MOUSE_OVER,overFun);    
            this.addEventListener(MouseEvent.MOUSE_OUT,outFun);    
            this.addEventListener(MouseEvent.CLICK,clickFun);    
        }    
        private function overFun(event:MouseEvent):void {    
            gotoAndStop(2);    
            date.textColor=0x000000;    
            title.textColor=0x000000;    
        }    
        private function outFun(event:MouseEvent):void {    
            gotoAndStop(1);    
            date.textColor=0xffffff;    
            title.textColor=0xffffff;    
        }    
        private function clickFun(event:MouseEvent):void {    
            main.showMsg(id)    
        }    
    }    
}

 


(13)好了,再编写main文档类,我们先把数据读进去。


 


AS3代码


 

package com.GB4{    
    import flash.display.*;    
    import flash.events.*;    
    import flash.URLLoader;    
    import flash.URLRequest;    
    import flash.events.IOErrorEvent;    
    import flash.system.System;    
    import flash.utils.*;//使用MC时引入    
    import flash.text.TextField;    
    import fl.transitions.Tween;    
    import fl.transitions.easing.*;    
    public class main extends Sprite {    
        private var pageNum:Number = 0;    
        private var item:Item;    
        private var itemBox:Sprite;    
        private var controlBar:ControlBar;    
        public static  var showMsg:Function;    
        private var getXML:XML;    
        private var msgBox:MsgBox = new MsgBox;    
        private var writeBox:WriteBox = new WriteBox;    
        private var thenPage:Number=1;    
        private var allPage:Number=0;    
        public function main() {    
            showMsg=showMsgFun;    
            controlBar=new ControlBar;    
            controlBar.x=50;    
            controlBar.y=300;    
            addChild(controlBar);    
            loadPage(1);    
            addChild(msgBox);    
            msgBox.visible=false;    
            msgBox.x=120   
            msgBox.y = 50   
            writeBox.visible=false;    
            writeBox.x=120   
            writeBox.y = 50   
            addChild(writeBox);    
            writeBox.closeBt.addEventListener(MouseEvent.CLICK, hideWriteBox);    
            msgBox.closeBt.addEventListener(MouseEvent.CLICK, hideMsgBox);    
            controlBar.prevPage.addEventListener(MouseEvent.CLICK, prevPageFun);    
            controlBar.nextPage.addEventListener(MouseEvent.CLICK, nextPageFun)    
            controlBar.writeBt.addEventListener(MouseEvent.CLICK,writeFun)    
        }    
        /*加载数据库转化的XML文件*/   
        private function loadPage(_pageNum:Number):void {    
            var myLoader:URLLoader = new URLLoader();    
            System.useCodePage=true;    
            myLoader.addEventListener(Event.COMPLETE,loadComplete);    
            myLoader.addEventListener(IOErrorEvent.IO_ERROR,loadError);    
            myLoader.load(new URLRequest("http://localhost/GB4/listXML.asp?pageNum=" + (_pageNum-1) + "&tag=" + Math.random() * 50));    
            thenPage=_pageNum    
        }    
        /*XML文件获取转化*/   
        private function loadComplete(event:Event):void {    
            XML.ignoreWhitespace = true;    
            var str:String=event.target.data;    
            str=str.slice(0,str.lastIndexOf(">")+1);    
            getXML = new XML(str);    
            allPage =Number(getXML.@total)    
            if (allPage % 10==0) {    
                allPage=int(allPage/10)    
                }else {    
                    allPage=int(allPage/10)+1   
                    }    
            controlBar.showTxt.text="当前第"+thenPage+"页 总共"+allPage+"页"   
            printItem();    
        }

 


 


技术看板:AS代码解释


第20行,初始化时先读取第1页。


第23行,私有函数loadPage()带有一个参数“_pageNum”控制要加载的页数,加载listXML留言列表文件。


第24行,文件的加载路径,读者可以跟据自己在IIS中设置的路径来修改,最后一个“&tag=”的作用防止读取缓存中的数据,所以多设了个变量“tag”并使用随机值保证每次都从数据库从新加载资料。


第30行,将所加载的页面赋给变量“thenPage”将当前页存放起来在翻动页面时使用。


第37行,加载成功后转化为XML对象“getXML”。


第38~43行,读取数据库所有留言数计算出总共页数,每页为10条记录,如果能被整除则取整为总页数否则取整加一为总页数。


(14)解析完XML文件,将其打印出来。


 


AS3代码


 


 

/*XML文件获取转化*/   
        private function loadComplete(event:Event):void {    
            XML.ignoreWhitespace = true;    
            var str:String=event.target.data;    
            str=str.slice(0,str.lastIndexOf(">")+1);    
            getXML = new XML(str);    
            allPage =Number(getXML.@total)    
            if (allPage % 10==0) {    
                allPage=int(allPage/10)    
                }else {    
                    allPage=int(allPage/10)+1   
                    }    
            controlBar.showTxt.text="当前第"+thenPage+"页 总共"+allPage+"页"   
            printItem();    
        }    
/*打印留言列表*/   
        private function printItem():void {    
            msgBox.visible = false;    
            writeBox.visible = false;    
            writeBox.inputBox.visible=true;    
            writeBox.sendDia.visible=false;    
            var setY=0;    
            if (itemBox!=null) {    
                removeChild(itemBox);    
            }    
            itemBox=new Sprite;    
            itemBox.x=50;    
            itemBox.y=50;    
            addChild(itemBox);    
            for (var i:uint; i 
                item=new Item();    
                item.y=setY;    
                setY+=23;    
                item.title.text=getXML.child(i).@title;    
                item.date.text=getXML.child(i).@date;    
                item.id=i;    
                itemBox.addChild(item);    
            }    
        }

 


技术看板:AS代码解释


第49~51行,如果itemBox已经有了,先移除。


第52行,itemBox用来放置所有item显示条。


第60行,读取XML中的“title”属性即留言标题。


第61行,读取XML中的“date”属性即留言日期。


(15)先测试下如图14-6 所示。



 


图14-6 XML列表转化测试


(16)接着往下做,制作控制框“ControlBar”,绘制翻页用的按钮和显示页数信息的框,各命名如图14-7 所示。



 


图14-7 代码


(17)翻页代码。


AS3代码


 

/*XML文件获取转化*/   
private function loadComplete(event:Event):void {    
    XML.ignoreWhitespace = true;    
    var str:String=event.target.data;    
    str=str.slice(0,str.lastIndexOf(">")+1);    
    getXML = new XML(str);    
    allPage =Number(getXML.@total)    
    if (allPage % 10==0) {    
        allPage=int(allPage/10)    
        }else {    
            allPage=int(allPage/10)+1   
            }    
    controlBar.showTxt.text="当前第"+thenPage+"页 总共"+allPage+"页"   
    printItem();    
}    
private function prevPageFun(event:MouseEvent):void {    
    if (thenPage > 1) {    
        loadPage(thenPage-1)    
        }    
    }    
private function nextPageFun(event:MouseEvent):void {    
    if (thenPage < allPage) {    
        loadPage(thenPage+1)    
        }    
    }

 


 


技术看板:AS代码解释


第65行,显示当前页和总页数信息。


第68~71行,上翻一页。


第73~77行,下翻一页。


(18)点击留言列表后,显示详细信息,制作信息显示框“msgBox”如图14- 8 所示。



 


图14- 8 信息显示框


(19)显示详细数据。


AS3代码


 


 

/*显视留言内容*/   
private function showMsgFun(id:Number):void {    
    removeChild(itemBox);    
    itemBox=null;    
    msgBox.visible = true;    
    msgBox.showName.text = getXML.child(id).@name;    
    msgBox.qq.text = getXML.child(id).@qq;    
    msgBox.title.text = getXML.child(id).@title;    
    msgBox.msg.htmlText = getXML.child(id).@msg;    
}

 


(20)测试下如图14-9 所示。



 


图14- 9测试


(21)显示数据制作完成,再编写留言发送和程序,提交留言数据的ASP程序“post.asp”。


ASP/Visual Basic代码


 

<%@LANGUAGE="VBSCRIPT"%> 
 
<% 
postName=trim(request.form("in_name")) 
qq=trim(request.form("in_qq")) 
title=trim(request.form("in_title")) 
msg=trim(request.form("in_content")) 
set add = Server.CreateObject("ADODB.Recordset") 
add.ActiveConnection = conn 
add.Source = "SELECT * FROM book" 
add.CursorType = 0 
add.CursorLocation = 2 
add.LockType = 2 
add.Open() 
add_numRows = 0 
add.addnew 
if qq<>"" then 
add("qq")=int(qq) 
else 
add("qq")=0 
end if 
add("name")=postName 
add("title")=title 
add("msg")=msg 
add.update 
add.Close() 
set add=nothing 
%>

 


技术看板:ASP代码解释


第4~7行,接收Flash上传来的值。


第17~21行,因为“qq”字段是整型的,所以要先判断用户留言时是否有填写QQ号,默认为0。


第22~25行,写入数据库。


(22)在Flash中制作留言框“WriteBox”,如图14- 10 所示。



 


图14-10 留言发送框


(23)发送成功以后,会有一个提示框,制作提示框命名为“sendDia”如图14- 11 所示。



 


图14-11 提示框


(24)编写“WriteBox.as”代码。


AS3代码


 

package com.GB4{    
    import flash.display.*;    
    import flash.URLRequest;    
    import flash.URLLoader;    
    import flash.URLVariables;    
    import flash.URLRequestMethod;    
    import flash.text.TextField;    
    import flash.events.MouseEvent;    
    import flash.events.*;    
    public class WriteBox extends MovieClip {    
        public function WriteBox() {    
            stop();    
            inputBox.sendBt.addEventListener(MouseEvent.CLICK, sendData);    
            sendDia.visible=true;    
        }    
        private function sendData(event:MouseEvent):void {    
            if (inputBox.showName.text==""||inputBox.msg.text=="") {    
                return;    
            }    
            var myLoader:URLLoader = new URLLoader();    
            var loadUrl:URLRequest=new URLRequest("http://localhost/GB4/post.asp");    
            var variables:URLVariables = new URLVariables();    
   
        &nbs, p;  , ; variable, , s.in_name=inputBox.showName.text;    
            variables.in_qq=inputBox.qq.text;    
            variables.in_title=inputBox.title.text;    
            variables.in_content = inputBox.msg.text    
            ;    
            loadUrl.data=variables;    
            loadUrl.method=URLRequestMethod.POST;    
   
            myLoader.addEventListener(Event.COMPLETE,loadComplete);    
            myLoader.addEventListener(IOErrorEvent.IO_ERROR,loadError);    
            myLoader.load(loadUrl);    
        }    
        private function loadComplete(event:Event):void {    
            sendDia.visible=true;    
            inputBox.visible=false;    
            inputBox.showName.text=inputBox.qq.text=inputBox.title.text=inputBox.msg.text="";    
            //留言成功以后,清空所有输入框    
        }    
        private function loadError(event:IOErrorEvent):void {    
            trace("加载出错");    
        }    
    }    
}

 

技术看板:ASP代码解释


第14行,先隐藏提示框。


第17行,如果用户没有输入文字则不发送。


第20~23行,发送Flash上传来的值。


第32行,发送成功,。


第22~25行,写入数据库。


(25)制作完成测试程序。

Access