AIRアプリでTreeの要素を起動時に全て展開する
最近、デスクトップアプリのモックアップを作るのにAIRを試しています。とりあえず、Flex Builder 3の体験版を使って60日限定でお勉強中です。
で、今回は、ツリービュー形式のメニューを作ろうとしていて、起動時に全て展開している状態にしようとして少し悩んでいました。ようやく一つの方法がわかったので書き留めておきます。
その前に、よく書かれているXMLListを使ったメニューアイテムの記述
例えば、Tree - ActionScript 3.0 言語およびコンポーネントリファレンスの最下部に書かれている方法で最初はやっていたが、expandChildOfメソッドを思い通りに動作させる方法が結局わからなかった。(たぶん、あるのだろうが)
JSONオブジェクトでスクリプト上にツリーアイテムを記述した
それで、Treeコンポーネント作成時のイベントハンドラ中でexpandChildOfすることで動作しました。
以下がこのmxmlコード。
<?xml version="1.0" encoding="utf-8"?> <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="390" height="318"> <mx:Script> <![CDATA[ private var treeItems:Object = { label:"top", children: [ { label:"item1", children: [ { label: "item1-1" }, { label: "item1-2" }, ]}, { label:"item2", children: [ { label: "item2-1" }, { label: "item2-2" }, ]}, { label:"item3", children: [ { label: "item3-1" }, { label: "item3-2" }, ]}, ]}; private function openAllItems(items:Object):void { myTree.dataProvider = items; myTree.validateNow(); // (1) myTree.expandChildrenOf(treeItems, true); // (2) } ]]> </mx:Script> <mx:Panel layout="absolute" top="10" left="10" bottom="10" right="10"> <mx:Tree id="myTree" x="0" y="0" width="100%" height="100%" showRoot="false" creationComplete="openAllItems(treeItems)"> </mx:Tree> </mx:Panel> </mx:WindowedApplication>
(1)と(2)を省略したときは、普通のツリービューにになります。両方書くと、起動時に全てツリーが展開された状態になります。(1)でvalidateNowしているのは、dataProviderへのitemsの設定がすぐには反映されないため、(1)がないコードでは、(2)を書いてもツリーは展開されません。
というわけで
デスクトップアプリを開発するには慣れが必要だなぁ、とか思いました。