การใช้ List ใน Flex by dekunderkover
Nov0
เราจะมาพูดถึงส่วนประกอบของ List ใน Flex
สิ่งที่พูดถึงนี้อยู่ใน spark.components.list
แท็ก list เวลาเรียกใช้คือ <s> </s> แบบโค้ดตัวอย่างนี้
<s:List x="295" y="207" width="412" height="112" id="prtList1" dataProvider="{usedArr1}" itemRenderer="components.partCustomComponent" />
</s:List>
x, y : จุด x y ที่เราจะวาง list ลงไป
width, height : ความกว้าง ความสูง ของ list ที่เราสร้าง
dataProvider : ข้อมูลที่จะใส่ลงใน list
itemRenderer : component แต่ละตัวใน list
ลงรายละเอียดกันอีกนิด
ข้อมูลที่จะใส่ใน dataProvider จะเป็นข้อมูลแบบ array เช่น
var usedArr:Array =[{"friend_id":1234,"nick":"Paiboon","level":10,"exp":2},
{"friend_id":5678,"nick":"Ziah","level":99,"exp":999999}];
จะมีข้อมูลคือ friend_id เป็น 1234, nick เป็น Paiboon, level เป็น 10, exp เป็น 2
itemRenderer จะเป็นคลาสที่สร้าง component แต่ละตัวออกมา โดยใช้ข้อมูลจาก dataProvider ทีละตัว
public function init():void {
str = data.nick;
exp = data.exp;
level = data.level;
id = "id: "+data.friend_id;
}
data คือข้อมูลจากในอาร์เรย์ . ด้วยชื่อของข้อมูลที่ต้องการ
แล้วจึงนำไปใส่
<s:Label text="name: {str}" y="60" />
<s:Label text="exp: {exp}" y="70" />
<s:Label text="level: {level}" y="80" />
มาดูให้เห็นภาพ (ไม่ตรงตามโค้ดนะจ๊ะ)
หลังจากข้อมูลหนึ่งตัวเข้า itemRenderer แล้ว จะออกมาเป็นลักษณะแบบนี้
พอใช้ข้อมูลทุกตัว ก็จะออกมาเป็นแบบนี้
Enjoy this article?
Consider subscribing to our RSS feed!
ไม่มีความเห็น
ยังไม่มีความเห็น