纳速健身

标题: 关于FLASH留言板的详细教程 FLASH留言板的详细教程 [打印本页]

作者: awagink    时间: 2008-7-2 08:05
标题: 关于FLASH留言板的详细教程 FLASH留言板的详细教程
基于网页的留言板,我们已经见得很多,一个完整的留言板包括三个部分:
1.  显示留言的页面(显示朋友们给我的留言)
2.  填写留言的页面 (向后台提交信息)
3.  数据库(用于保存后台信息)
关于如何制作基于网页的留言板,不去多作解释,可以参考相关资料。
就目前而言,FLASH是不可以直接操作象ACCESS, SQL, Mysql 等数据库的,他只能依靠ASP ,PHP ,JSP等其他的语言来实现数据的提交和查询。同时,FLASH还可以和XML对接,实现一些数据的操作。

FLASH和ASP的交互
无论是ASP,PHP还是JSP等其他语言,原理大都一样,本人对ASP熟悉一点,所以以下只讲解FLASH与ASP的对联;
查看FLASH的帮助文件,可以找到好几种的交互方法,
本人使用最多的还是:
loadVariablesNum(url:String, level:Number, [method:String]) : Void
loadVariablesNum(参数1,参数2,参数3),
参数1为变量所处位置的绝对或相对 URL,
参数2为一个整数,指定 Flash Player 中接收这些变量的级别
参数3为发送变量的 HTTP 方法,常用的有"get"和"POST",推荐使用"POST"方法。
例1:新建一个flash文件,拖一个可输入的文本框组件,取实例名为name_txt,再拖入一个按钮组件到场景中,取实例名为send_btn,在第一帧上写
  1.       _root.send_btn.onRelease=function()
  2.       {   
  3.          if(_root.name_txt.text!="")
  4.           {  
  5.             myname=_root.name_txt.text;
  6.             loadVariablesNum("write.asp",0,"POST");
  7.                }
  8.             }
复制代码

那么,测试影片后,在文本框中,输入一个不为空的字符后,点击发送按钮后,输入的内容,将被提交到同一个文件夹中的名为"write.asp"中去!
write.asp通过Request.Form("myname")的方法,就可以得到提交过来的数据,这里就简单的实现了 FLASH向ASP提交数据。
接下来看看FLASH如何从ASP读数据:
例2:新建一个flash文件,拖一个动态文本框组件到场景中,取实例名为read_txt,在第一帧上写
  1.      loadVariablesNum("read.asp",0,"POST");
  2.      _root.read_txt.text=myname;
复制代码

     理论上测试后,read_txt文本框会显示read.asp提交过来的myname中的值,但是有时候不能够保持实时性,常常得不到数据,相信也有许多朋友
     会遇到同样的问题,这里讲两个小技巧。

     技巧一:
     首先可以在FLASH初一个变量为 active_old=0; 在ASP中Response.Write("active_new=1")
     那么FLASH里可以写上:   
  1. active_old=0;
  2.      _root.onEnterFrame=function()
  3.      {
  4.      loadVariablesNum("read.asp",0,"POST");
  5.       _root.active_old=active_new;
  6.       _root.read_txt.text=myname;
  7.       if(_root.active_old==1)
  8.       {
  9.          delete _root["onEnterFrame"];
  10.           }  
  11.   
  12.      }
复制代码

    此段代码表示,开始FLASH会不断地访问read.asp,read.asp会把变量active_new传递给FLASH中的_root.active_old,当_root.active_old改变后,
    将停止事件。

    技巧二:
    使用
  1. loadVariablesNum("read.asp?temp="+random(10000),0,"POST");
复制代码
的方式,在每次访问时会得到最新的数据,不会再使用缓存中的信息。
   
关于ASP中的代码如何书写,不再多作解释,重点讲解FLASH如何准确和及时得到数据库里的数据,达到我们期望的功能。

[备注]
     我们常会遇到,中文提交到数据库后,数据显示出来为乱码,主要是由于编码的原因,只要在ASP中写上
  1. codePage=”936”%>
复制代码



FLASH和XML的交互
   
应该来说,用XML和FLASH来交换数据,还是不错的选择,首先,XML可以根据我们的需要,很清晰地定义其结构,FLASH也可以很容易去解释信息。

例3:
  1. myxml=new XML();    //创建一个XML新对象
  2. myxml.ignoreWhite=true; //空白忽略
  3. myxml.load(“music.xml”);  //加载同目录下的music.xml文件
  4. myxml.onLoad=function(success)
  5. {
  6.    if(success)
  7.    {  
  8.      ReadXML();
  9.      trace(“加载成功”);
  10. }else
  11. {
  12. trace(“加载失败”);
  13. }
  14. }
复制代码
以上的代码就能够检测xml是不是加载到FLASH中去了。
以下是个简单的XML文件  
        
  1. name=”song1” url=”mp3/01.mp3”  />
  2.           name=”song2” url=”mp3/02.mp3”  />
  3.           name=”song3” url=”mp3/03.mp3”  />
复制代码
XML加载进来后,我们需要做的是去解析和提取数据,为我们所用。
以上ReadXML()函数就用来读数据。
  1.   Function  ReadXML()
  2. {
  3. myArray=myxml.firstChild.childNodes;  //把myxml的第一个子结点所有的数据以数组的方式给myArray
  4. totalNumber= myArray.length;  //
  5. for( i=0; i< totalNumber ; i++ )
  6. {
  7.    arr_1= myArray.attributes.name;
  8.    arr_2=myArray.attributes.url;
  9. }
  10. }
复制代码

现在,我们可以得到的结果是,在数组arr_1中保存了所有歌曲的名字,在数组arr_2中保存了所有歌曲的路径,我们就可以使用loadSound()等方法制作一个自己的播放器了!


XML与ASP

Xml和ASP各有各的优势,xml数据结构很清楚,但是没有ASP灵活,而且还可以查询和修改数据库,所以想一想,如果用ASP来动态生成xml,那么我们就可以两全其美了!
这里需要一点ASP知识!
以下一段实现ASP生成指定的XML。
  1. response.ContentType="text/xml"
  2. if request.QueryString("Page")<>"" then
  3. Page=Cint(request.QueryString("Page"))
  4. else
  5. Page=1
  6. end if
  7. pgsz=5
  8. %>
  9.     DataBaseName="Manage/Message/Message.mdb"
  10.         
  11.        Set Conn = Server.CreateObject("ADODB.Connection")
  12.        Conn.Open "DRIVER={Microsoft Access Driver (*.mdb)};DBQ=" & Server.MapPath(DataBaseName)
  13.        set rs=server.CreateObject("Adodb.recordset")
  14.        rs.open "Select * from Message order by addtime desc",conn,1,1
  15.        if not rs.eof then
  16.        rs.pagesize=pgsz
  17.     Rs.Absolutepage=Page
  18.        %>
  19.        " Pagecount="" PageSize="" Recordcount="">
  20.         
  21.        i=0
  22.        do while not rs.eof and i
  23.        %>   
  24.        " Sex="" Email="" Time="--" Homepage=""  Title="" Content="" Reply=""/>
  25.          
  26.        i=i+1
  27.        rs.movenext
  28.        loop
  29.        %>
  30.         
  31.        end if
  32.        rs.close
  33.        set rs=nothing
  34.        Conn.Close
  35.        set Conn=Nothing
  36. %>
复制代码

[备注]
我们常会遇到,XML中如果有中文,将会成乱码,所以只要在flash中写上
  1. System.useCodePage=true
复制代码
,就OK了!


<转载> http://www2.flash8.net/teach/5178.htm

作者: awagink    时间: 2008-7-2 08:08
以上只是些基础知识,下面具体讲解留言板的制作和关键:

flash.rar
效果地址:http://www.u-lee.com/bbs.htm(已失效)
是我的第一个版本的留言板
留言板主要包括以下功能:游戏,留言(提交留言),播放音乐(mp3),管理功能(删除留言)
使用到的技术:AS,ASP,XML, database
需要解决的技术问题:
1.留言内容的分页显示,
2,使用List组件显示歌曲列表,列表使用XML动态更新,
3,使用ScrollPan组件存放留言内容,当有新的留言内容产生时,自动调整位置,最新留言置顶,
4,加载声音文件,如何实现播放完一首歌曲后,自动换到下一首,
5,删除留言自动调整页面。
原理是把所有的数据用ASP提取出来,然后由FLASH来判断,使用split方法,把数据存到数组里去,需要时,再去取,这样有一个弱点,就是使用起来,分页时,会把不需要的数据也调用了进来,不是很科学!
接下来讲的是改进后的版本。原理是用ASP动态生成XML,当分页时,点下一页时,继续访问ASP,从新生成第二页的XML,都由FLASH访问XML,来加载数据,由ASP访问数据库,读和写数据。
V2.0 版本中FLASH原文件共有3个,leave.swf 只是个容器,把write.swf和leave.swf 加载到里面去。
write.swf为提交数据,read.swf 为读数据.
leave.swf :
两个按钮 , 一个 查看留言 btn1   一个我要留言.btn2  
  1. btn1:   _parent.mess.loadMovie("read.swf");  
  2. btn2:   _parent.mess.loadMovie("write.swf");
复制代码

其中还有, 上一页 和下一页  以及一个下拉条
主要代码:
  1. xiala.onEnterFrame = function() {                //下拉的位置,控制着留言内容mess的位置  
  2.        if (ggg == 1) {  
  3.               mess._y = 28;  
  4.        } else {  
  5.               y = xiala.btn._y;  
  6.               yy = y/dist1;  
  7.               mess._y = b_2*yy+30;  
  8.        }  
  9. };               
复制代码
write.swf
(图片见word文档)

主要代码:
  1. System.useCodepage = true;    //支持中文编码  
  2. this_mc._visible = false;      //  this_mc 为一个填写错误提示的影片剪辑  
  3. this_sex = "先生";           //默认sex为先生  
  4. function clean() {             // 点取消按钮时,清空所有数据  
  5.        this_name.text = "";  
  6.        this_homepage.text = "";  
  7.        this_email.text = "";  
  8.        this_title.text = "";  
  9.        this_content.text = "";  
  10. }  
  11. function emailcheck(str) {         //检测email填写是否正确,判断是否有@ 和 点  
  12.        at = false;  
  13.        dot = false;  
  14.        for (i=0; i  
  15.               if (str.charAt(i) == ’@’) {  
  16.                      at = true;  
  17.               }  
  18.               if (str.charAt(i) == ’.’) {  
  19.                      dot = true;  
  20.               }  
  21.        }  
  22.        return (at && dot);  
  23. }  
  24. clean_btn.onRelease = function() {  
  25.        clean();  
  26. };  
  27. send_btn.onRelease = function() {           //提交按狃代码  
  28.        if (this_name.text == "") {  
  29.               this_mc._visible = true;  
  30.               this_mc.tishi.text = "姓名不能为空!";  
  31.        } else if (emailcheck(this_email.text) == false) {  
  32.               this_mc._visible = true;  
  33.               this_mc.tishi.text = "请正确填写邮件!";  
  34.        } else if (this_title.text == "") {  
  35.               this_mc._visible = true;  
  36.               this_mc.tishi.text = "主题不能为空!";  
  37.        } else if (this_content.text == "") {  
  38.               this_mc._visible = true;  
  39.               this_mc.tishi.text = "内容不能为空!";  
  40.        } else {  
  41.               myName = this_name.text;  
  42.               myHomepage = this_homepage.text;  
  43.               if (myHomepage == "") {  
  44.                      myHomepage = "http://www.u-lee.com";  
  45.               }  
  46.               myEmail = this_email.text;  
  47.               myTitle = this_title.text;  
  48.               myContent = this_content.text;  
  49.               mySex = this_sex;  
  50.               trace(myName);  
  51.               trace(myHomepage);  
  52.               trace(myEmail);  
  53.               trace(myTitle);  
  54.               trace(myContent);  
  55.               trace(mySex);  
  56.               loadVariablesNum("write.asp", 0, "POST");   // 如果填写的数据全部合格,将提交数据到write.asp  
  57.               _parent.page_num = 1;  
  58.               _parent.prev_btn._visible = false;  
  59.               _parent.txt._visible = true;  
  60.               _parent.xiala._visible = true;  
  61.               _parent.next_btn._visible = true;  
  62.               _parent.btn2.gotoAndStop(1);  
  63.               _parent.btn1.gotoAndStop(2);  
  64.               _parent.ggg = 0;  
  65.               _parent.mess.unloadMovie();  
  66.               _parent.mess.loadMovie("read.swf");     //提交后,自动转入显示留言的页面  
  67.        }  
  68. };  
  69. listenerObject_1 = new Object();                   // 侦听事件,如果选择了"先生"则this_sex = "先生";  
  70. listenerObject_1.click = function(eventObject) {  
  71.        this_sex = "先生";  
  72. };  
  73. listenerObject_2 = new Object();  
  74. listenerObject_2.click = function(eventObject) {    // 侦听事件,如果选择了"先生"则this_sex = "女士";  
  75.        this_sex = "女士";  
  76. };  
  77. sex_1.addEventListener("click", listenerObject_1);  
  78. sex_2.addEventListener("click", listenerObject_2);  
  79. stop();  
复制代码
read.swf
以上是一个空影片剪接,用于放置留言信息, 想想假如我想每页显示5个,那么 我需要复制5个这样的影片,放到场景中, 再把从xml中的提取出来的数据注入到每个影片中的 1-5个 动态文本框中去.  
如何读数据,上面已经讲过了, 现在 只要把数据赋给动态文本框中就可以了. 需要注意的是,我们选用的是自定义的文本框,首先确保他是多行的并且是自动换行的,所以我们考虑的是,文本框的高度必须根据内容的多少来显示。以下代码就可以实现:

  1. scroll_1 = this.message_load_mc["message_mc"+i].content_txt.maxscroll;  //取得内容的最大滚动量  
  2. this.message_load_mc["message_mc"+i].content_txt._height = scroll_1*18;   
  3. //一行文本,如果是12号字大约是18px,那么*18后,就可以得到content_txt._height 了  
  4. 回复同样也是这样另外,低色的高度也要根据上面内容来确定。  
  5. this.message_load_mc["message_mc"+i].back_2._y= this.message_load_mc["message_mc"+i].back_1._y+this.message_load_mc["message_mc"+i].back_1._height+2  
  6. //得到back_2._y 坐标。
复制代码

完整的代码:


  1. stop();  
  2. System.useCodepage = true;  
  3. //现在是第几页,由_root里的this_nowpage来传给它,在场景中定义  
  4. this_nowpage = _parent.page_num;  
  5. temp = 0;  
  6. read_xml = new XML();  
  7. read_xml.ignoreWhite = true;  
  8. read_xml.load("DataSource.asp?Page="+this_nowpage+"&"+Math.random(10000));   
  9. // 刷新DataSource.asp,保证不使用缓存里的数据  
  10. read_xml.onLoad = function(success) {  
  11.        if (success) {  
  12.               trace("OK");  
  13.               parseXML();  
  14.        } else {  
  15.               trace("加载失败");  
  16.        }  
  17. };  
  18. function parseXML() {  
  19.        name_arr = new Array();  
  20.        sex_arr = new Array();  
  21.        email_arr = new Array();  
  22.        time_arr = new Array();  
  23.        homepage_arr = new Array();  
  24.        title_arr = new Array();  
  25.        content_arr = new Array();  
  26.        reply_arr = new Array();  
  27.        total_arr = new Array();  
  28.        total_arr = read_xml.firstChild.firstChild.childNodes;  
  29.        //---------总记录数-------  
  30.        totalRecord = read_xml.firstChild.firstChild.attributes.Recordcount;  
  31.        //---------总页数---------  
  32.        totalPage = read_xml.firstChild.firstChild.attributes.Pagecount;  
  33.        _parent.total_1 = totalPage;  
  34.        //---------当前页数--------  
  35.        now_Page = read_xml.firstChild.firstChild.attributes.CurPage;  
  36.        //---------每页显示记录数-------  
  37.        page_size = read_xml.firstChild.firstChild.attributes.PageSize;  
  38.        trace(totalRecord);  
  39.        trace(totalPage);  
  40.        trace(now_Page);  
  41.        for (i=0; i  
  42.               name_arr[i] = total_arr[i].attributes.Name;  
  43.               sex_arr[i] = total_arr[i].attributes.Sex;  
  44.               email_arr[i] = total_arr[i].attributes.Email;  
  45.               time_arr[i] = total_arr[i].attributes.Time;  
  46.               homepage_arr[i] = total_arr[i].attributes.Homepage;  
  47.               title_arr[i] = total_arr[i].attributes.Title;  
  48.               content_arr[i] = total_arr[i].attributes.Content;  
  49.               reply_arr[i] = total_arr[i].attributes.Reply;  
  50.        }  
  51.        showmessage();  
  52. }  
  53. function showmessage() {  
  54.        _parent.txt._visible = true;  
  55.        _parent.txt.total_txt.text = "一共有"+totalRecord+"记录";  
  56.        _parent.txt.nowpage_txt.text = this_nowpage+"/"+totalPage;  
  57.        for (i=0; i  
  58.               this.message_load_mc.attachMovie("message_mc", "message_mc"+i, i);  
  59.               this.message_load_mc["message_mc"+i].name_txt.text = name_arr[i]+"("+sex_arr[i]+")";  
  60.               this.message_load_mc["message_mc"+i].title_txt.text = title_arr[i];  
  61.               this.message_load_mc["message_mc"+i].content_txt.text = content_arr[i];  
  62.               this.message_load_mc["message_mc"+i].reply_txt.text = reply_arr[i];  
  63.               trace(this.message_load_mc["message_mc"+i].reply_txt.text);  
  64.               this.message_load_mc["message_mc"+i].time_txt.text = time_arr[0];  
  65.               this.message_load_mc["message_mc"+i].back_2._y = this.message_load_mc["message_mc"+i].back_1._y+this.message_load_mc["message_mc"+i].back_1._height+2;  
  66.               scroll_1 = this.message_load_mc["message_mc"+i].content_txt.maxscroll;  
  67.               this.message_load_mc["message_mc"+i].content_txt._height = scroll_1*18;  
  68.               this.message_load_mc["message_mc"+i].back_2._height = this.message_load_mc["message_mc"+i].content_txt._height+15;  
  69.               scroll_2 = this.message_load_mc["message_mc"+i].reply_txt.maxscroll;  
  70.               this.message_load_mc["message_mc"+i].reply_txt._height = scroll_2*18;  
  71.               if (this.message_load_mc["message_mc"+i].reply_txt.text == "") {  
  72.                      this.message_load_mc["message_mc"+i].back_3._height = 30;  
  73.               } else {  
  74.                      this.message_load_mc["message_mc"+i].back_3._height= this.message_load_mc["message_mc"+i].reply_txt._height+10;  
  75.               }  
  76.               this.message_load_mc["message_mc"+i].back_3._y= this.message_load_mc["message_mc"+i].back_2._y+this.message_load_mc["message_mc"+i].back_2._height+2;  
  77.               this.message_load_mc["message_mc"+i].txt_1._y= this.message_load_mc["message_mc"+i].back_3._y+5;  
  78.               this.message_load_mc["message_mc"+i].reply_txt._y= this.message_load_mc["message_mc"+i].txt_1._y;  
  79.               this.message_load_mc["message_mc"+i]._x = 0;  
  80.               this.message_load_mc["message_mc"+i]._y = temp;  
  81.               temp = temp+this.message_load_mc["message_mc"+i]._height+15;  
  82.               this.message_load_mc["message_mc"+i].btn1.onRelease = function() {  
  83.                      homepage_num = Number(this._parent._name.slice(10));  
  84.                      str_1 = homepage_arr[homepage_num];  
  85.                      getURL(str_1, "_blank");  
  86.               };  
  87.               this.message_load_mc["message_mc"+i].btn2.onRelease = function() {  
  88.                      email_num = Number(this._parent._name.slice(10));  
  89.                      str_2 = email_arr[email_num];  
  90.                      getURL("mailto:"+str_2);  
  91.                      trace(str_2);  
  92.               };  
  93.        }  
  94.        trace("++++++++++++++++"+this._height);  
  95.        _parent.b_2 = -1*this._height+250;  
  96. }
复制代码

以上的所有的操作,测试时需要在ASP环境下。
以上如果有不确当的术语,请谅解!
感谢您阅读我的心得!谢谢!
可以把“FLASH留言板原文件” 中的内容全拷到ASP环境下
http://127.0.0.1/web/index.html 就可以了
文件夹中提供了后台管理系统供大家学习和测试




欢迎光临 纳速健身 (https://nasue.com/) Powered by Discuz! X3.4