FLASH加载XML数据分析
文章类别:
Flash | 发表日期:2010-1-31 14:22:20
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[i].firstChild.firstChild.nodeValue;
trace(name);
author = item[i].childNodes[1].firstChild.nodeValue;
trace(author);
pub = item[i].childNodes[2].firstChild.nodeValue;
trace(pub);
img = item[i].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[i].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[i].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[i].nodeName.toLowerCase() == "class") {
class = descList[i].firstChild.nodeValue;
}
if (descList[i].nodeName.toLowerCase() == "name") {
name = descList[i].firstChild.nodeValue;
}
if (descList[i].nodeName.toLowerCase() == "author") {
author = descList[i].firstChild.nodeValue;
}
if (descList[i].nodeName.toLowerCase() == "pub") {
pub = descList[i].firstChild.nodeValue;
}
if (descList[i].nodeName.toLowerCase() == "pub") {
img = descList[i].attributes.src;
trace(img);
_root.loader.loadMovie(img);
}
}
//显示当前纪录的编号
no = num+1;
}
其中readChild(num)就是一个用来接受按钮参数的函数