หลังจากเขียน FeedReader แล้วพบความพิเศษของมันอย่างนึงใน Tree component คือจะทำให้มันยากก็ยากได้ หรือจะทำให้มันใช้ง่ายก็ง่ายสุดๆ เหมือนกัน แต่ก่อนเวลาผมจะใช้ component นี้ข้อมูลที่จะใช้ก็จะทำเป็น xml ให้มีโครงสร้างตามที่ต้องการก่อน เช่น ถ้าข้อมูลมีลักษณะเป็น root -> directory -> file ก็จะสร้าง xml เป็น

<root>
  <directory name="directory1">
    <file name="file1" />
    <file name="file2" />
  </directory>
  <directory name="directory2">
    <file name="file3" />
  </directory>
</root>

ซึ่งมันลำบากสิ้นดี แต่หลังจากทำ FeedReader แล้วค้นพบอะไรบางอย่างนั่นคือ มันมี TreeDataDescriptor ด้วยที่ไว้อธิบายข้อมูลว่าจะให้แสดงเป็น Tree ได้ยังไงแล้วมันก็มีค่าพื้นฐานให้อยู่แล้วด้วยคือ ถ้า object ที่ใส่เข้ามาในตัวแปร dataProvider มี property ที่ชื่อว่า name แล้ว children มันจะเอา name มาแสดงส่วนอันไหนที่มี children ก็จะทำให้มีลูกสามารถขยายออกมาได้ เช่น

class Folder {
  public var name:String
  public var children:ArrayCollection
 
  pubilc function Folder(name:String):void { this.name = name }
}
 
class File {
  public var name:String
 
  public function File(name:String):void { this.name = name }
}
 
private var data:ArrayCollection = new ArrayCollection()
var folder1:Folder = new Folder("folder1")
folder1.children = new ArrayCollection([
  new File("file1"),
  new File("file2"),
  new File("file3")
])
 
var folder2:Folder = new Folder("folder2")
folder2.children = new ArrayCollection([
  new File("file4"),
  new File("file5")
])
 
data.addItem(folder1)
data.addItem(folder2)
 
<mx:Tree dataProvider="{data}" />

แค่นี้ Tree ด้านบนก็จะมีข้อมูลเหมือนกับ xml ที่ใส่มาในตอนแรกเลย แต่ จริงๆแล้วมันสามารถทำได้มากกว่านั้นอีกคือสามารถใช้ Array ในการแสดงข้อมูลออกมาเป็น Tree ได้เหมือนกันเพียงกำหนดชื่อใน object ที่อยู่ใน array ให้เป็น name กับ children เหมือนกับที่ทำ object แยก
จริงๆ ใครอยากดูตัวอย่างละเอียดๆ ก็ลองเอาโค้ด FeedReader มาดูได้แหละ มีใช้อยู่ ^^! ยังเหลืออีกเรื่องที่เจอในงานนี้เหมือนกันคือ xml แต่ไว้เขียนแยกเป็นอีกหัวข้อนึงดีกว่า

เขียนเมื่อ: August 20th, 2008 | หมวด: ภาษาเครื่องกล | แถก: ,, | อ้างอิง |

ทิ้งคำบ่น

XHTML: สามารถใช้แถกเหล่านี้ในการบ่น: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="">