Flash中LIST组件使用总结

发布时间：2020-12-15 06:20:32 所属栏目：百科来源：网络整理

导读：?第一节、首先，看看是如何将数据添加进LIST组件中，以及如何显示鼠标点击的对象。 1、静态生成方法： my_list.addItem("labe"l,data); 实例：新建文件，将LIST组件拖至场景中。并将LIST组件的实例名称修改为“my_list”，在第一帧添加如下代码： System.use

?第一节、首先，看看是如何将数据添加进LIST组件中，以及如何显示鼠标点击的对象。
1、静态生成方法：
my_list.addItem("labe"l,data);
实例：新建文件，将LIST组件拖至场景中。并将LIST组件的实例名称修改为“my_list”，在第一帧添加如下代码：

System.useCodepage=true;
var my_list:mx.controls.List;
my_list.addItem({label:"Gordon",data:123});
my_list.addItem({label:"英国",data:456});
my_list.addItem({label:"中国",data:888});

如果想测试效果，可以再在AS代码中多添加几个。。。
实例演示：

http://www.taoshaw.com/flash/list/lesson1.swf

2、动态生成方法（通过加载XML，将数据添加进LIST）：
实例：新建文件，将LIST组件拖至场景中。并将LIST组件的实例名称修改为“my_list”，在第一帧添加如下代码：

//解决乱码的问题...

其他与List组件相关原创教程查看：
[url=http://www.taoshaw.com/taoshaw/article.asp?id=1376]使用LIST组件打造QQ好友聊天器>>>[/url]
[url=http://www.taoshaw.com/taoshaw/article.asp?id=1375]使用MenuBar加载XML构建仿WINDOWS菜单>>>[/url]
[url=http://www.taoshaw.com/taoshaw/article.asp?id=1356]自由修改组件动画效果（OpenDuration、OpenEasing）>>>[/url]
[url=http://www.taoshaw.com/taoshaw/article.asp?id=1355]在FLASH中设置文本的字体（利用TextField.getFontList();）>>>[/url]
[url=http://www.taoshaw.com/taoshaw/article.asp?id=1299]LIST组件使用总结>>>[/url]

System.useCodepage = true;
//定义doc_xml为XML类；
var doc_xml:XML = new XML();
//忽略空格.
doc_xml.ignoreWhite = true;
doc_xml.onLoad = _root.xmlload;
//初次加载文件为"renming.xml"...
_root.doc_xml.load("renming.xml");
function xmlload() {
??var childnodes = this.firstChild.childNodes;
//防止垒加，这句话的含义就是让my_list每次加载的XML不一样。
??_root.my_list.removeAll();
??for (var i:Number = 0; i<childnodes.length; i++) {
????_root.my_list.addItem(childnodes[i].attributes.label,childnodes[i].attributes.data);
??}
}

3、通过按钮点击，分别加载不同的XML文件。

//定义地名按钮被激发时，加载地名。。。
diming.onRelease = function() {
??_root.doc_xml.load("diming.xml");
};
renming.onRelease = function() {
??_root.doc_xml.load("renming.xml");
};
shijian.onRelease = function() {
??_root.doc_xml.load("shijian.xml");
};

4、调用被鼠标点击后的对象，以及调用该对象的数据：

_root.onEnterFrame = function() {
??show_txt_label = _root.my_list.selectedItem.label;
??show_txt_data = _root.my_list.selectedItem.data;
};

my_list.selectedItem.label;my_list.selectedItem.data;
第一节中2-4步的所有例子如下：
http://www.taoshaw.com/flash/list/lesson2.html

第二节、关于LIST组件的相关操作。

1、删除LIST组件列表中的所有项：

_root.my_list.removeAll();

方法；删除列表中的所有项。
调用此方法会修改 List 组件的数据提供程序。如果与其它组件共享数据提供程序，则那些组件也会更新。
当按下按钮时，以下代码将会清除 List 组件中的所有项。

2、删除当前所选项目：
List.removeItemAt()

??var n:Number=_root.my_list.selectedIndex;
??_root.my_list.removeItemAt(n)

3、上一个、下一个选择方法：

selIndex = _root.my_list.selectedIndex;
??_root.my_list.selectedIndex = ((selIndex == 0) || (selIndex == undefined) ? _root.my_list.length-1 : selIndex-1);
????//让滚动条跟随
??_root.my_list.vPosition = selIndex-2;
??//每次减一，如果项目为第一项或undefined，则从倒数最后一项开始，Flash的算法中，0 是第一项，length-1 则为最后一项
??if (selIndex == 0 || selIndex == undefined) {
????_root.my_list.vPosition = _root.my_list.length-1;

第二节中1---3的实例：
演示：
http://www.taoshaw.com/flash/list/removeAll.html

//本文件中加载的XML文件在上一步骤中有。下同。。。

4、将一个LIST中的数据添加进另一个LIST数据：

//以下是将左侧数据添加进右侧LIST列表中。。。
var newobj = new Object();
_root.my_list.addEventListener("change",newobj);

j = 0;
arr_3 = new Array();
arr_4 = new Array();

//以下判断是否重复选择============
var label_arr:Array = new Array();
//检测是否有重复的Label值
function checkRepeat(v) {
??var isRepeat:Boolean = false;
??var len:Number = label_arr.length;
??for (var i = 0; i<len; i++) {
????if (v == label_arr[i]) {
??????isRepeat = true;
??????break;
????}
??}
??return isRepeat;
}
//========================

//点击选择单项
newobj.change = function(num) {
??var newobject = num.target.selectedItem;
??arr_3[j] = newobject.label;
??arr_4[j] = newobject.data;
??if (checkRepeat(arr_4[j]) == false) {
??_root.my_listother.addItem({data:arr_4[j],label:arr_3[j]});
????label_arr.push(arr_4[j]);
??} else {
????already_select.gotoAndPlay(2);
??}
??j++;
};

5、点击按钮，将一个LIST中所有项目添加进另一个LIST中。

show_db_menu = function () {
??if (_root.my_list.selectedIndex>=0) {
????_root.my_list.selectedIndex = undefined;
??}
??//这里是关键，如果当前已有选项，则取消选择，以便下面for循环发挥作用。
??for (i=0; i<(_root.my_list.length); i++) {
????var selIndex = _root.my_list.selectedIndex;
????_root.my_list.selectedIndex = ((selIndex == undefined) ? 0 : selIndex+1);
????//如果当前没有选项则从第一项开始，flash递增算法中，0就是1，每次加一直到末尾com_box.length
????var newobject_menu = _root.my_list.selectedItem;
????arr_3[j] = newobject_menu.label;
????arr_4[j] = newobject_menu.data;
????if (checkRepeat(arr_4[j]) == false) {
??????_root.my_listother.addItem({label:arr_3[j],data:arr_4[j]});
??????label_arr.push(arr_4[j]);
????}
????j++;
??}
};

第二节中4----5步骤。
实例：http://www.taoshaw.com/flash/list/onetoother.html

6、在Flash 的 List 组件每行列表文字前加图标：

var labelname = ["淘沙网","沙子","taoshaw","大浪淘沙"];
var ico_mc:Array = new Array();
list.iconField = "icon";//设置对象数组中作为图标的标识符，非链接属性
for (var i = 0; i<4; i++) {
??ico_mc.addItem({label:labelname[i],icon:"ico" + i});//如需统一图标，这里写成 icon:"ico0"，相应更改库中影片的链接属性
}
list.dataProvider = ico_mc;

实例：http://www.taoshaw.com/flash/list/listico.html

7、LIST组件的美化。
关于LIST组件样式的美化（包含修改滚动条样式等）：
实例：

?点击播放/隐藏媒体

http://www.taoshaw.com/flash/listmeihua.swf

代码如下：（LIST实例名为：“clList”）

import mx.controls.List;
import mx.controls.scrollClasses.ScrollBar;
ScrollBar.prototype.scrollTrackName="mc1";
ScrollBar.prototype.thumbMiddleName="mc2";
ScrollBar.prototype.thumbBottomName="mc2";
ScrollBar.prototype.thumbTopName="mc2";
ScrollBar.prototype.thumbGripName="mc3";
ScrollBar.prototype.upArrowUpName="mc4";
ScrollBar.prototype.upArrowOverName="mc4";
ScrollBar.prototype.upArrowDownName="mc4";
ScrollBar.prototype.downArrowUpName="mc5";
ScrollBar.prototype.downArrowOverName="mc5";
ScrollBar.prototype.downArrowDownName="mc5";
var clList:List;
clList.setStyle("borderStyle","none");

//upArrowUpName 向上和向左按钮的弹起（正常）状态。默认值为 ScrollUpArrowUp。
?
upArrowOverName 向上和向左按钮的滑过状态。默认值为 ScrollUpArrowOver。
?
upArrowDownName 向上和向左按钮的按下状态。默认值为 ScrollUpArrowDown。
?
downArrowUpName 向下和向右按钮的弹起（正常）状态。默认值为 ScrollDownArrowUp。
?
downArrowOverName 向下和向右按钮的滑过状态。默认值为 ScrollDownArrowOver。
?
downArrowDownName 向下和向右按钮的按下状态。默认值为 ScrollDownArrowDown。
?
scrollTrackName 用于滚动条的轨道（背景）的元件。默认值为 ScrollTrack。
?
scrollTrackOverName 用于滑过滚动轨道时的轨道（背景）的元件。默认值为 undefined。
?
scrollTrackDownName 用于按下滚动轨道时的轨道（背景）的元件。默认值为 undefined。
?
thumbTopName 滚动框（滑块）的顶端和左端。默认值为 ScrollThumbTopUp。
?
thumbMiddleName 滑块的中间（可扩展）部分。默认值为 ScrollThumbMiddleUp。
?
thumbBottomName 滑块的底端和右端。默认值为 ScrollThumbBottomUp。
?
thumbGripName 显示在滑块之上的抓手。默认值为 ScrollThumbGripUp。

8、关于LIST组件样式的设置参考：
http://doc.51windows.net/FlashHelpSC/?url=/FlashHelpSC/sc/UsingComponents/04_components91.html
http://doc.51windows.net/FlashHelpSC/?url=/FlashHelpSC/sc/UsingComponents/04_components98.html
http://www.5460.net/gy5460/jsp/article/dispArt.jsp?dNum=535270
List组件样式属性

?backgroundColor 背景色

?backgroundAlpha 背景色透明度数值从0.00~1.00

?useRollOver 是否使用鼠标经过List每一项时产生效果 true false

?rollOverColor 鼠标经过每一项时的背景色 useRollOver为

true时有效

?textRollOverColor 鼠标经过每一项时的文字颜色 useRollOver为

true时有效

?alternatingItemColors List中间隔背景色这个属性要设置2个色

彩，某一项的背景色和下一项的背景色

?color 选项文本颜色

?selectionColor 被选中项的背景色

?textSelectedColor 被选中项的文字颜色

?

?textIndent 选项文本缩进距离

?selectionDuration 被选中项渐变速度被选中项背景色变为

selectionColor中的值的速度，设置可实现渐变效果数值从0~5000 值越大，渐变速度越慢

?borderStyle 边框样式 none solid inset

outset

?borderColor 边框颜色

?borderThickness 边框粗细数值从0~20

?dropShadowEnabled 是否显示投影 true和false 2个属性

?shadowDistance 投影大小 dropShadowEnabled为true时有效数

值从0~20

?shadowDirection 投影方向 3个属性 left right center

?dropShadowColor 投影的颜色

9、怎么能把list组件的边去了？
//my_list为LIST组件在场景中的实例名称。
_root.my_list.setStyle("borderStyle","none");

10、为LIST组件指定交替模式中行的颜色：
//直接粘贴此行。。。是固定模式。。。
_global.styles.ScrollSelectList.setStyle("alternatingRowColors",[0xFF00AA,16777215])

11、让list组件支持html标签：
http://www.stonemx.com/blog/archives/2006/200681803148.html

12、通过dataProvider给LIST组件添加数据源，数据源来自来数组；
var my_List:mx.controls.List;
var myArray:Array=new Array();
myArray.push({label:"涪陵",data:1});
myArray.push({label:"丰都",data:2})
myArray.push({label:"重庆",data:3})
my_List.dataProvider=myArray;
//备注：通过dataProvider给组件添加数据时，第二次使用本命令，将会替换掉第一次的全部数据。而使用addItem则不会。

13、使用事件调度返回LIST的值：
var my_List:mx.controls.List;
var my_Array:Array=new Array();
my_Array.push({label:"涪陵",data:1})
my_Array.push({label:"丰都",data:2])
my_List.dataProvider=my_Array;
var LO:Object=new Object();
LO.change=function(eventObj:Object):Void{
trace(eventObj.target.selectedItem.data)
}
my_List.addEventListener("change",LO)

具体链接请看：http://www.taoshaw.com/taoshaw/article.asp?id=1299

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!