K-Director.com
Experience Web 2.0, Make Money Online, SEO, Blogging, Technology, Tips

One of the great thing of Adobe Director is user can apply flash components in a director movie. Unfortunately, the Director documentation is not really describe all the flash components’ properties and methods that are to be used in details.

Tree Component
The Tree component allows a user to view hierarchical data. The tree appears within a box like the List component, but each item in a tree is called a node and can be either a leaf or a branch.
By default, a leaf is represented by a text label beside a file icon and a branch is represented by a text label beside a folder icon with a disclosure triangle that a user can open to expose children. The children of a branch can either be leaves or branches themselves.
The data of a tree component must be provided from an XML data source.

Step 1: Where do we get the tree component in Director?
Go to “Library palette” -> “Component”, drag a tree component and drop it in your cast.

Step 2: Prepare script for tree component event.
If you are using Director MX 2004 10.1.1, right click your tree component in your stage, select “Script…”, then insert these script
on beginSprite me
fsButton = sprite(me.spriteNum)
fsButtonEvent = fsButton.newObject(”Object”)
fsButton.setCallback(fsButtonEvent, “change”, 0, 0)
MainMenuLessonSelected = void
end

Step 3: Prepare Your XML Data and Set the Tree Component’s Data Provider.
We have our XML data we need to provide it to our tree component in order for it to be rendered on stage, and that is done is by setting the tree component’s dataProvider property.
You can insert these script after on beginsprite me.
on buildtree
pSprite = sprite(me.spriteNum)
tDataSource = pSprite.newObject(”XML”)
tDataSource.ignoreWhite = true
pSprite.dataProvider = tDataSource

Step 4: Add/Remove Branches and Leaves as Needed.
–add branches
tNewNode1 = pSprite.addTreeNode(”Malaysia”,”East Asia,tNewNode1″) –note that the 1st parameter is the label to display, the 2nd parameter is the attribute(s) of this label.
pSprite.setIsBranch(tNewNode,TRUE) — to set it as a branch(folder)tNewNode2 = pSprite.addTreeNode(”China”,”West Asia,tNewNode2″)
pSprite.setIsBranch(tNewNode,TRUE)–add leaves
tNewLeaf1 = tNewNode1.addTreeNode(”Kuala Lumpur”,”Prime city”)
tNewLeaf2 = tNewNode1.addTreeNode(”Pulau Redang”,”Island”)
tNewLeaf3 = tNewNode2.addTreeNode(”Beijing”,”Beautiful city”)
tNewLeaf4 = tNewNode2.addTreeNode(”Shanghai”,”Advance city”) Step 5:Component event.
on change me
–To get a label’s data when you click on it.
gSelectedLabel = sprite(me.spriteNum).selectedNode.attributes.label
gSelecteddata = sprite(me.spriteNum).selectedNode.attributes.data–To close/open by clicking the label but not the arrow beside the label.
if pSprite.getIsOpen(tNewNode1)= 1 then
pSprite.setIsopen(tNewNode1,false)
else
pSprite.setIsopen(tNewNode1,true)
end if
end– To show hand cursor when rollover

on itemrollover me
cursor 280
end– To show hand cursor when rollout
on itemrollout me
cursor 0
end

*If you know how to edit the icon of a tree component in Adobe Director, please share it with me.

Download file: Tree Component.dir
(Right click and select save target as)

想在director里加入Tree Component却因为director说明书里没有详细记载其使用方法而一筹莫展？
没关系。然我在这里和你分享我对Tree Component的认识。

步骤一：加入Tree Component
打开”Library palette” -> “Component”，选择tree component然后加入cast里。

步骤二：加入Tree Component活动程式
如果你使用着Director MX 2004 10.1.1版本，那你应该在你的tree component里，加入此程式
on beginSprite me
fsButton = sprite(me.spriteNum)
fsButtonEvent = fsButton.newObject(”Object”)
fsButton.setCallback(fsButtonEvent, “change”, 0, 0)
MainMenuLessonSelected = void
end

步骤三：加入XML资料库及成立Tree Component的资料提供体
XML资料库将提供tree component所要的资料，然后才能建立起一个tree component。
你可在tree component里，加入此程式
on buildtree
pSprite = sprite(me.spriteNum)
tDataSource = pSprite.newObject(”XML”)
tDataSource.ignoreWhite = true
pSprite.dataProvider = tDataSource

步骤四：加入或删除母档夹与子档案
–加入母档夹
tNewNode1 = pSprite.addTreeNode(”Malaysia”,”East Asia,tNewNode1″) –括弧里的第一个资料是母档夹的名字，括弧里的第二个资料是其母档夹的属性。
pSprite.setIsBranch(tNewNode,TRUE)tNewNode2 = pSprite.addTreeNode(”China”,”West Asia,tNewNode2″)
pSprite.setIsBranch(tNewNode,TRUE)–加入子档案
tNewLeaf1 = tNewNode1.addTreeNode(”Kuala Lumpur”,”Prime city”)
tNewLeaf2 = tNewNode1.addTreeNode(”Pulau Redang”,”Island”)
tNewLeaf3 = tNewNode2.addTreeNode(”Beijing”,”Beautiful city”)
tNewLeaf4 = tNewNode2.addTreeNode(”Shanghai”,”Advance city”) 步骤五：Component event.
on change me
–获取其档夹/档案的属性（资料）
gSelectedLabel = sprite(me.spriteNum).selectedNode.attributes.label
gSelecteddata = sprite(me.spriteNum).selectedNode.attributes.data–关闭或打开其档夹当用户按下其名
if pSprite.getIsOpen(tNewNode1)= 1 then
pSprite.setIsopen(tNewNode1,false)
else
pSprite.setIsopen(tNewNode1,true)
end if
end–滑鼠标签的变动

on itemrollover me
cursor 280
endon itemrollout me
cursor 0
end

Lingo

 If you like this post then please subscribe to my full feed RSS.