FLASH加载XML数据方法详细分析

摘要

我这只是分析了如何得到XML中的数据以及如何进行分页,即如何选择性地加载XML中的数据,其实FLASH用到的XML也就这么多(当然,XML文件不一定必须是XML格式的,我们也可以存储为其它的格式,也可以使用动态的语言生成XML数据,或者结合数据库进行存储,这些就要求我们掌握除了AS以外的其它技术了),相信能够对朋友有一点帮助,我这只是将FLASH加载XML的原理向大家解析。所以提供给大家的也是一些做的比较粗糙的源文件,没有进行什么美化,如果你是一位美术功底好的人,相信只要掌握了我所教的,一定能够做出很漂亮的作品出来。
[Read More…]

陈佳裕博客=230">FLASH加载XML数据分析

Xml是个好东西(呵呵,替它打下广告,引用XML教程书上的话,每个学习网络的人都要会用它,每个搞创作的人都要精通它。虽然有点夸张,但是也是优点道理的),他的作用和语法我就不在这里阐述了。
看到论坛上许多人提问,FLASH如何加载,分页效果是怎么实现的。如果你看了这个帖子,相信就会怎么使用FLASH加载XML了
首先你要对XML的语法有一些了解,FLASH加载XML是把XML当作节点来分析。
下面是我对XML的简单分析,

 

 20081125_79bfa428c4b6422e1f1e7uSTHmYRjuwn.jpg (39.44 KB)

2009-1-1 19:14
1.下面我就用一个booklist.xml来做一下详细的分析!
booklist.xml 的内容如下:
<?xml version="1.0"?>
<books>
       <book>
              <name>Thinking in Java</name>
              <author>Bruce Eckel</author>
              <pub src="1.jpg">机械工业</pub>
       </book>
       <book>
              <name>朗文英语词典</name>
              <author>--</author>
              <pub src="1.jpg">商务印书馆</pub>
       </book>
       <book>
              <name>数据结构</name>
              <author>严蔚敏</author>
              <pub src="1.jpg">清华大学</pub>
       </book>
       <book>
              <name>Database Concepts</name>
              <author>Oracle Corporation</author>
              <pub src="1.jpg">Oracle Corporation</pub>
       </book>
</books>

如果我想得到<pub src="1.jpg">机械工业</pub>中的图片地址怎么办呢(即“1.jpg”),如果你对XML有点了解,在理解了上面的图示的原理,这个对你来说就容易了。那么让我们来实验下。
在FLASH中输入代码:
//初始化对象,设定onLoad时调用自己的函数解析
myXML = new XML();
myXML.ignoreWhite = true;
//下面是自定义的用来解析XML文件
myXML.onLoad = function(ok) {
       if (ok) {
              bookTag = myXML.firstChild.firstChild.childNodes[2].attributes.src;              trace(bookTag);
       } else {
              trace("error");
       }
};
myXML.load("booklist.xml");
测试一下。是不是有输出了:1.jpg
如过你想以这个图片地址导入图片,只要在其中加入_root.loadMovie(bookTag);
是否体验到了XML的魅力了?
2.能够实现上面的功能也许有的人就想,是不是可以利用这个功能做一个展示某产品的页面,并利用循环来均匀排列这些影片,当然能够拉,我们就来看看这样的效果是怎么实现的(具体的过程见附件,这只是讲了基本的过程和主要的代码)。
新建一个FLASH文档。
建立一个影片剪辑,如图: 右键选择链接,设置标记符为main;
回到主场景,在第一桢输入代码:
//代码开始
//初始化对象,设定onLoad时调用自己的函数解析
myXML = new XML();
myXML.ignoreWhite = true;
myXML.onLoad = function(ok) {
       if (ok) {
              item = myXML.firstChild.childNodes;
              for (i=0; i<item.length; i++) {
                     name = item.firstChild.firstChild.nodeValue;
                     trace(name);
                     author = item.childNodes[1].firstChild.nodeValue;
                     trace(author);
                     pub = item.childNodes[2].firstChild.nodeValue;
                     trace(pub);
                     img = item.childNodes[2].attributes.src;
                     trace(img);
                     _root.attachMovie("main", "main"+i, i);
                     _root["main"+i]._x = 165*i;
                     _root["main"+i].name = name;
                     _root["main"+i].author = author;
                     _root["main"+i].pub = pub;
                     _root["main"+i].loader.loadMovie(img);
              }
       } else {
              trace("error");
       }
};
myXML.load("booklist.xml");//代码结束
哈哈,舞台上有了你XML中设置
附件:
有些很有想法的朋友就不满足了,他们会提出这样的问题,是否能够对我们加载的信息进行分页显示呢?
可以的,进行分页显示通常有两种方法(也许有许多种,但是我就掌握了两种,如果有朋友知道其它的方法,还请指教呀,大家相互学习)。
第一中是加载进全部信息,设置遮罩来显示一个指定区域的信息,使用按钮或者鼠标直接拖动另一区域到遮罩下显示。
代码如下:
flash xml动态分页
// copyright by webstudio.com.cn.author by egoldy.2006.1.14
//初始化起始位置.
Stage.scaleMode="noScale"
System.useCodepage=true;
var x = 3;
var y = 3;

// 设定图像的水平和竖向间距位置.图像的宽为100*75.间隔为5
var hspace = 105;
var vspace = 80;
// 列和行数,以列为主.
var num_columnas = 3;
var num_rows=3;
//定义分页变量
var pages;
// 初始xml
myXML = new XML();
myXML.ignoreWhite = true;
myXML.onLoad = function(success) {
if (success) {
//创建一个空影片用于装载所有内容.
_root.createEmptyMovieClip("mycont",0);
//设定遮罩.及它的宽高.
mycont.setMask(mask_mc);
mask_mc._width=hspace*num_columnas;
mask_mc._height=vspace*num_rows;
// xml结点轮徇
for (var i = 0; i < this.firstChild.childNodes.length; i++) {
//计算出页数多少
pages=Math.ceil(i/(num_columnas*num_rows));
trace(pages);
//xml节点付值
var thumb = this.firstChild.childNodes.attributes.id;
var holder_mc = mycont.createEmptyMovieClip("holder_mc" + i, i + 100);
var item = holder_mc.createEmptyMovieClip("butx" + i, i + 100);
item.loadMovie(thumb);
// 初始化holder_mc的位置
holder_mc._x = x;
holder_mc._y = y;
// 可以分配变量给holder_mc,如果有的话
holder_mc.url = this.firstChild.childNodes.attributes.url;

holder_mc.onRelease = function() {
       getURL(this.url);
};
// holder_mc的x方向排列
x += hspace;
// 定义临时列数.
var columna;
columna += 1;
// 控制列数,如果临时列数与我们初定义的相同,每排完3个后向左移(hspace*num_columnas),
//y方向直接向下增加即可.
if (columna == num_columnas) {
       columna = 0;
       x -= (hspace * num_columnas);
       y += vspace;
}
//显示页号
if(pages>0){
       for(var j=0;j<pages;j++){
        var pag=_root.attachMovie("page_btn","pag"+j,j+100);
        trace(pag);
        trace(pages);
        pag._x = 5+j*30;
pag._y = 260;
//指定一个id.是为了后面移动holder_mc准备
pag.id = j;
//按钮文字
pag.info.text = j+1;
pag.onPress = function() {
       //设定按钮状态
       setButtons(pages, this.id)
       //移动mycont,实现翻页.
       mycont._y=-(this.id*(num_rows*vspace));
}
       }
}

}
}
};
myXML.load("http://www.webstudio.com.cn/wsswf/f...ge/imagenes.xml");
//设定按钮状态函数
function setButtons(tot, q) {
       for (var i = 0; i<=tot; i++) {
              var but = this["pag"+i];
              if (i != q) {
                     but.gotoAndStop(1);
                     but.enabled = 1;
              } else {
                     but.gotoAndStop(2);
                     but.enabled = 0;
              }
       }
}
                                       
上面代码我们一次全部加载了信息,并设置按钮,根据按钮传入的值来确定要浏览的区域位置,并将该区域移动到遮罩下进行显示。
使用上面的方法可以实现分页的效果,但是你可能会想,如果我有几百张,甚至上份的信息,如果一次加载进来岂不是要很久,而且也没有什么必要,这样既浪费了资源,也没有这么大了空间让你显示全部的内容,如果看完一个,只要单击下一个或者上一个,就能够观看遍所有的,那不更加好吗?
very good,我为有这样的想法的朋友而高兴,这确实是个好想法,那么何不来看看是怎么做出来的呢?
这就关系到在FLASH中传递参数进行选择加载进行分页显示了。
    下面就告诉大家是第二种分页效果怎么做出来的(当然,实现的方法很多,我这只是其中的一种方法):
其实实现也比较简单。
原理是这样的:设置一个带参的函数,根据单击的按钮传回的参数来加载选择的那一条或者几条信息。
只要在上面该该就行了
//初始化对象,设定onLoad时调用自己的函数解析
myXML = new XML();
myXML.ignoreWhite = true;
myXML.onLoad = myParseXML;
bookTag = new XML();
bookList = new Array();
descList = new Array();
count = 0;
//下面是自定义的用来解析储存书目信息的XML文件的函数
function myParseXML() {
       bookTag = myXML.firstChild;
       bookList = bookTag.childNodes;
       //读入第一本书的信息
       readChild(0);
}
function readChild(num) {
       //读入一个book节点的所有信息
       descList = bookList[num].childNodes;
       //分解book节点中的各子节点
       for (i=0; i<descList.length; i++) {
              if (descList.nodeName.toLowerCase() == "class") {
                     class = descList.firstChild.nodeValue;
              }
              if (descList.nodeName.toLowerCase() == "name") {
                     name = descList.firstChild.nodeValue;
              }
              if (descList.nodeName.toLowerCase() == "author") {
                     author = descList.firstChild.nodeValue;
              }
              if (descList.nodeName.toLowerCase() == "pub") {
                     pub = descList.firstChild.nodeValue;
              }
              if (descList.nodeName.toLowerCase() == "pub") {
                     img = descList.attributes.src;
                     trace(img);
                     _root.loader.loadMovie(img);
              }
       }
       //显示当前纪录的编号
       no = num+1;
}
其中readChild(num)就是一个用来接受按钮参数的函数
附件:

我这只是分析了如何得到XML中的数据以及如何进行分页,即如何选择性地加载XML中的数据,其实FLASH用到的XML也就这么多(当然,XML文件不一定必须是XML格式的,我们也可以存储为其它的格式,也可以使用动态的语言生成XML数据,或者结合数据库进行存储,这些就要求我们掌握除了AS以外的其它技术了),相信能够对朋友有一点帮助,我这只是将FLASH加载XML的原理向大家解析。所以提供给大家的也是一些做的比较粗糙的源文件,没有进行什么美化,如果你是一位美术功底好的人,相信只要掌握了我所教的,一定能够做出很漂亮的作品出来。

发表评论

您必须 登录 才能发表留言!