Liệt kê dữ liệu từ XML dưới dạng danh sách (list) trong AS3

Để liệt kê dữ liệu từ XML dưới dạng 1 danh sách là việc rất thường phải làm của người làm Flash. Chẳng hạn khi chúng ta phải tạo ra 1 dãy các buttons động mà không biết trước được số lượng, các thông tin đều được lấy từ XML thì bài thực hành dưới đây chắc chắn sẽ rất hữu ích.

Click vào hình dưới đây để xem kết quả.

Cụ thể chúng ta được giao 1 XML tên là “myButtons.xml” có cấu trúc như sau:

<?xml version="1.0" encoding="utf-8"?>
<buttons>
<myButton>
<btnTitle>Title1</btnTitle>
<btnLink>Link1</btnLink>
</myButton>
<myButton>
<btnTitle>Title2</btnTitle>
<btnLink>Link2</btnLink>
</myButton>
<myButton>
<btnTitle>Title3</btnTitle>
<btnLink>Link3</btnLink>
</myButton>

</buttons>

Trong đó “btnTitle” sẽ là tiêu đề (hoặc tên) của button, “btnLink” sẽ là đường link khi click chẳng hạn. Nhiệm vụ bây giờ sẽ là thể hiện các buttons lên stage (hoặc gắn vào trong 1 MovieClip nào đó) dưới dạng danh sách từ trên xuống. Trên đó mỗi button có 1 title riêng và khi click sẽ thực hiện link.

– Bước 1: Tạo 1 MovieClip (sẽ là button) trong Library. Trong MovieClip này là 1 dynamic Text có Instance Name là “btnName_txt” (là nơi hiện title của button). Cuối cùng của bước này rất quan trọng là đặt tên Class của button: chuột phải lên button – Properties – Export for ActionScript – đặt tên Class là “btns“.

– Bước 2: Code

var myXML:XML;
var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("myButtons.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(e:Event):void
{
myXML = new XML(e.target.data);
listBtn();
}

function listBtn()
{
for (var i:Number = 0; i < myXML.myButton.length(); i++)
{
var myListBtn:btns = new btns();

//gắn title cho button.

myListBtn.btnName_txt.text = myXML.myButton[i].btnTitle;

//gắn vị trí cho buttons
myListBtn.x = 100; //Vị trí X của button là 100px
myListBtn.y = i * 50; //khoảng cách giữa 2 button là 50px

stage.addChild(myListBtn); //gắn buttons lên stage

if (myListBtn)
{
myListBtn.index = i;
myListBtn.addEventListener(MouseEvent.CLICK, onClickHandle);
}
}
}

function onClickHandle(evt:MouseEvent):void
{
var i:uint = evt.currentTarget.index;
trace("links: "+ myXML.myButton[i].btnLink); //kết quả khi click lên button có tên "Title1" sẽ là: "links: Link1".
}

Hy vọng bài hướng dẫn này sẽ giúp ích cho công việc của các bạn.