การใช้ List ใน Flex by dekunderkover

เราจะมาพูดถึงส่วนประกอบของ 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 แล้ว จะออกมาเป็นลักษณะแบบนี้

พอใช้ข้อมูลทุกตัว ก็จะออกมาเป็นแบบนี้