通過(guò)一次小小的實(shí)踐,終于了解如何使用tomahawk中的tree2這個(gè)組件了,并且寫了小段程序,從xml中讀取樹(shù)的結(jié)構(gòu),生成一個(gè)tree,不過(guò)tree2不能直接和xml綁定是一個(gè)遺憾,那樣就會(huì)省不少事情了。記下一點(diǎn)心得,以供后來(lái)參考了。
對(duì)tree2的操作分為兩部分,一部分是在頁(yè)面中通過(guò)tag定義樣式相關(guān)的東西,一部分就是通過(guò)編程添加樹(shù)的節(jié)點(diǎn),起初看了sample以后總是以為這東西有多么的復(fù)雜,其實(shí)邏輯是很簡(jiǎn)單的,只是sample中定義了多種不同的樣式的節(jié)點(diǎn),看上去很復(fù)雜而已。
下面附上我對(duì)sample簡(jiǎn)化過(guò)的這段tag來(lái)說(shuō)明一下。
<t:tree2 value="#{catalog.node}" var="node" id="clientside" varNodeToggler="t" >
<f:facet name="folder">
<h:panelGroup>
<f:facet name="expand">
<t:graphicImage value="images/yellow-folder-open.png" rendered="#{t.nodeExpanded}" border="0"/>
</f:facet>
<f:facet name="collapse">
<t:graphicImage value="images/yellow-folder-closed.png" rendered="#{!t.nodeExpanded}" border="0"/>
</f:facet>
<h:outputText value="#{node.description}"/>
</h:panelGroup>
</f:facet>
</t:tree2>
tree2的主tag定義了tree的根節(jié)點(diǎn)和一些相關(guān)的參數(shù)。嵌套的那個(gè)facet定義了一種節(jié)點(diǎn)的樣式,包括展開(kāi)與關(guān)閉時(shí)的圖片,以及顯示的文字內(nèi)容。
在程序里面,我們root TreeNodeBase = new TreeNodeBase(…)來(lái)創(chuàng)建一個(gè)root節(jié)點(diǎn),然后通過(guò)root.getChildren().add(new TreeNodeBase(…))為其添加子節(jié)點(diǎn),任何一個(gè)節(jié)點(diǎn)都可以添加任意多的子節(jié)點(diǎn),通過(guò)這樣的操作,我們可以很容易的生成一個(gè)tree的結(jié)構(gòu)了,實(shí)際上,這個(gè)tree的結(jié)構(gòu)是通過(guò)遞歸從xml中讀取出來(lái),生成一個(gè)和xml tree完全相同的結(jié)構(gòu)。
除了明白如何去用這個(gè)tree2之外的收獲就是,終于明白了如何去通過(guò)遞歸方法遍歷一個(gè)樹(shù)形結(jié)構(gòu),雖然在學(xué)校里學(xué)過(guò)遍歷的算法,也抄過(guò)例程,但從來(lái)沒(méi)有理解過(guò)是怎么一回事,終于在實(shí)踐中理解了,實(shí)踐才是軟件的根本之道。
程序的其它部分放在附件里面了,如果有興趣了可以和我討論tree2,討論其它JSF的東西。
源文件下載
查看 解析Tree2 全文