メソッド | プロパティ | エフェクト | イベント | スタイル | フレームあり | フレームなし

mx.controls
Tree クラス

継承を示す線継承を示す線継承を示す線継承を示す線継承を示す線継承を示す線


Tree クラス
mx.controls.List の拡張

Tree コントロールを使用すると、展開表示可能なツリー形式に整理された階層データをユーザーが表示できます。ツリー内の各アイテムはノードと呼ばれ、ノードにはリーフノードとブランチノードがあります。リーフノードとは、ツリー内の各末端にあるノードです。ブランチノードとは、リーフノードまたはブランチノードを含んだノードです。

デフォルトでは、リーフは、ファイルアイコンの横のテキストラベルで表されます。ブランチは、フォルダアイコンの横のテキストラベルで表されます。ブランチにはユーザーが開いて子を表示できる展開用矢印が付いています。

ツリーのノードは、TreeDataProvider コントロールによって表されます。ツリー内の各ノードについて、TreeDataProvider コントロールに次のプロパティを定義できます。

MXML シンタックス

<mx:Tree> タグは、親クラスのすべてのプロパティと、次のプロパティを継承します。

 <mx:Tree
alternatingRowColors="No default."
dataProvider="No default."
defaultLeafIcon="No default."
depthColors="No default."
firstVisibleNode="No default."
folderOpenIcon="No default."
folderClosedIcon="No default."
indentation="8"
openDuration="250"
openEasing="No default."
rollOverColor="0xE3FFD6"
selectedNode="No default."
selectionColor=#0xCDFFC1"
cellEdit="Event handler; no default."
cellFocusIn="Event handler; no default."
cellFocusOut="Event handler; no default."
cellPress="Event handler; no default."
change="Event handler; no default."
nodeClose="Event handler; no default."
nodeOpen="Event handler; no default."
/>

を参照するにはここをクリックしてください

関連項目
    treeclasses.TreeDataProvider



メソッド
       addTreeNode( labelOrNode, data)
ツリーの最上位にノードを追加します。
       addTreeNodeAt( index, labelOrNode, data)
ツリーの最上位ノードの指定されたインデックスに子ノードを追加します。
       calculateWidths( count)
コントロール内のコンテンツに基づいて、コントロールの推奨される幅を返します。
       getDisplayIndex( node)
ツリー内で現在開いているノードと閉じているノードの状態に基づいて、指定したノードがツリー内の何行目にあるかを返します。
       getDropParent( ) :  Object
ドラッグ & ドロップ操作時にドロップ位置の親ノードを返します。
       getIsBranch( node)
指定したノードがブランチノードの場合は true を返します。
       getIsOpen( node)
指定したノードのブランチが開いている (子が表示されている) 場合は true を返します。
       getNodeDisplayedAt( index)
ツリーの現在の状態に基づいて、指定したインデックス位置のノードを返します。
       getTreeNodeAt( index)
ツリーの最上位にある指定したインデックス位置のノードを返します。
       removeAll( )
ツリーからすべてのノードを削除します。
       removeTreeNodeAt( index)
ツリーの最上位から指定したノードを削除します。
       setIcon( node, iconID, iconID2)
ノードに関連付けるアイコンを設定します。
       setIsBranch( node, branch)
ノードがブランチノードかどうかを指定します。
       setIsOpen( node, open, animate, fireEvent)
ブランチノードを開きます。

mx.controls.listclasses.ScrollSelectList クラスから継承されるメソッド
addItem   addItemAt   calculateWidths   clearSelected   createChildren   draw   fillRowsFromBottom   fillRowsFromTop   getDropLocation   getItemAt   hideDropFeedback   isSelected   layoutChildren   measure   removeAll   removeItemAt   replaceItemAt   setPropertiesAt   showDropFeedback   sortItems   sortItemsBy  

mx.core.ScrollView クラスから継承されるメソッド
childLoaded   createChildren   createChildWithStyles   getViewMetrics   init   layoutChildren   setScrollProperties  

mx.core.View クラスから継承されるメソッド
childLoaded   constructObject2   createChild   createChildren   destroyAllChildren   destroyChild   destroyChildAt   draw   getBorderMetrics   getChildAt   getChildIndex   getViewMetrics   init   layoutChildren   layoutChrome   setChildIndex  

mx.core.UIComponent クラスから継承されるメソッド
drawFocus   getFocus   getFocusManager   setEnabled   setFocus  

mx.core.UIObject クラスから継承されるメソッド
addEventListener   applyProperties   buildDepthTable   commitProperties   constructObject2   createAccessibilityImplementation   createChildAtDepth   createChildren   createClassChildAtDepth   createClassObject   createEmptyObject   destroyObject   dispatchEvent   doLater   draw   drawRect   executeBindings   fillRect   findNextAvailableDepth   getRepeaterItem   getStyle   handleEvent   init   invalidate   invalidateLayout   invalidateProperties   invalidateSize   invalidateStyle   layoutChildren   measure   move   redraw   removeEventListener   setDepthAbove   setDepthBelow   setMask   setSize   setSizeNoLayout   setStyle   swapDepths  



プロパティ
       cellEditor:MovieClip
セルエディタへの参照です (存在する場合)。
       dataProvider:Object
表示されるオブジェクトの階層構造を表す TreeDataProvider または XMLTreeDataProvider です。
       firstVisibleNode:var
ツリーの一番上の行に現在表示されているノードです。
       focusedCell:Object
指定したノードに cellEditor を作成します。
       maxHPosition:Number
ツリーの hPosition の最大値です。
       selectedNode:var
ツリー内で選択されているノードです。
       selectedNodes:Array
選択されているノードです。
staticversion:String
このクラスのバージョンを表すストリングです。

mx.controls.List クラスから継承されるプロパティ
version  

mx.controls.listclasses.ScrollSelectList クラスから継承されるプロパティ
cellRenderer   dataProvider   dataTipField   dataTipFunction   dragEnabled   dropIndicatorSkin   iconField   iconFunction   labelField   labelFunction   multipleSelection   rowCount   rowHeight   rowRenderer   selectable   selectedIndex   selectedIndices   selectedItem   selectedItems   showDataTips   value   variableRowHeight   verticalAlign   wordWrap  

mx.core.ScrollView クラスから継承されるプロパティ
className   hPosition   hScrollPolicy   liveScrolling   maxHPosition   maxVPosition   scrollTipFunction   showScrollTips   version   vPosition   vScrollPolicy  

mx.core.View クラスから継承されるプロパティ
baselinePosition   className   numChildren   version  

mx.core.UIComponent クラスから継承されるプロパティ
enabled   errorString   tabEnabled   tabIndex   version  

mx.core.UIObject クラスから継承されるプロパティ
alpha   baselinePosition   className   depth   documentDescriptor   height   heightFlex   id   instanceIndices   isDocument   kStretch   layoutHeight   layoutWidth   maxHeight   maxWidth   minHeight   minWidth   mouseX   mouseY   nestLevel   oldHeight   oldWidth   oldX   oldY   parent   parentApplication   parentDocument   percentHeight   percentWidth   preferredHeight   preferredWidth   repeaterIndices   scaleX   scaleY   styleName   tabEnabled   toolTip   version   visible   width   widthFlex   x   y  



エフェクト

mx.core.UIComponent クラスから継承されるエフェクト
focusInEffect   focusOutEffect  

mx.core.UIObject クラスから継承されるエフェクト
creationCompleteEffect   hideEffect   mouseDownEffect   mouseOutEffect   mouseOverEffect   mouseUpEffect   moveEffect   resizeEffect   showEffect  



イベント
cellEditセルの値がセルエディタによって変更されたときにブロードキャストします。セルまたは列が編集可能の場合にのみブロードキャストします。このイベントオブジェクトには、次のプロパティが含まれます。
- itemIndex : 選択されたアイテムのインデックスです。
- columnIndex : 選択された列のインデックスです。
- oldValue : セルの以前の値です。
- target : イベントをトリガしたコンポーネントへの参照です。
- type : イベントの名前 cellEdit です。
cellFocusIn特定のセルがフォーカスを受け取ったときにブロードキャストします。これは、ユーザーがセルをクリックした場合や、キーボードで特定のセルへと移動した場合に発生します。このイベントオブジェクトには、次のプロパティが含まれます。
- itemIndex : 選択されたアイテムのインデックスです。
- columnIndex : 選択された列のインデックスです。
- target : イベントをトリガしたコンポーネントへの参照です。
- type : イベントの名前 cellFocusIn です。
cellFocusOut特定のセルがフォーカスを失ったときにブロードキャストします。これは、ユーザーが別のセルをクリックした場合や、キーボードで別のセルやグリッドの外へと移動した場合に発生します。このイベントオブジェクトには、次のプロパティが含まれます。
- itemIndex : 選択されたアイテムのインデックスです。
- columnIndex : 選択された列のインデックスです。
- target : イベントをトリガしたコンポーネントへの参照です。
- type : イベントの名前 cellFocusOut です。
cellPressユーザーがセルをクリックし、そのセルを編集することを示したときにブロードキャストします。セルまたは列が編集可能の場合にのみブロードキャストします。このイベントオブジェクトには、次のプロパティが含まれます。
- itemIndex : 選択されたアイテムのインデックスです。
- columnIndex : 選択された列のインデックスです。
- view : 現在選択されているオブジェクトです。
- target : イベントをトリガしたコンポーネントへの参照です。
- type : イベントの名前 cellPress です。
changeユーザーがツリーのアイテムを選択したときにブロードキャストします。イベントオブジェクトの target プロパティには、このイベントをトリガしたコンポーネントへの参照が設定されます。イベントオブジェクトの type プロパティには、イベント名 change が設定されます。
nodeCloseブランチが閉じられた (畳まれた) ときにブロードキャストします。イベントオブジェクトの target プロパティには、このイベントをトリガしたコンポーネントへの参照が設定されます。イベントオブジェクトの type プロパティには、イベント名 nodeClose が設定されます。イベントオブジェクトの node プロパティには、閉じられたノードを表すオブジェクトが含まれます。
XML データから Tree を設定する場合は、ノードの label プロパティおよび data プロパティには次のようにアクセスします。
eventobj.node.attributes.label
eventobj.node.attributes.data
TreeDataProvider API を使用して、プログラムにより Tree データプロバイダにアイテムを追加する場合、label プロパティおよび data プロパティには次のようにアクセスします。
eventobj.node.getData()
nodeOpenブランチが開かれた (展開された) ときにブロードキャストします。イベントオブジェクトの target プロパティには、このイベントをトリガしたコンポーネントへの参照が設定されます。イベントオブジェクトの type プロパティには、イベント名 nodeOpen が設定されます。イベントオブジェクトの node プロパティには、開かれたノードを表すオブジェクトが含まれます。
XML データから Tree を設定する場合は、ノードの label プロパティおよび data プロパティには次のようにアクセスします。
eventobj.node.attributes.label
eventobj.node.attributes.data
TreeDataProvider API を使用して、プログラムにより Tree データプロバイダにアイテムを追加する場合、label プロパティおよび data プロパティには次のようにアクセスします。
eventobj.node.getData()

mx.controls.listclasses.ScrollSelectList クラスから継承されるイベント
change  itemRollOut  itemRollOver 

mx.core.ScrollView クラスから継承されるイベント
scroll 

mx.core.View クラスから継承されるイベント
childCreated  childDestroyed  childIndexChanged 

mx.core.UIComponent クラスから継承されるイベント
focusIn  focusOut  invalid  keyDown  keyUp  valid  valueCommitted 

mx.core.UIObject クラスから継承されるイベント
creationComplete  dragComplete  dragDrop  dragEnter  dragExit  dragOver  draw  effectEnd  effectStart  hide  hideToolTip  initialize  load  mouseChangeSomewhere  mouseDown  mouseDownSomewhere  mouseMove  mouseMoveSomewhere  mouseOut  mouseOver  mouseUp  mouseUpSomewhere  move  resize  show  showToolTip  unload 



スタイル
alternatingRowColors型 : Array   CSS の継承 : あり
切り替えパターンで行を表示する場合に使用する色です。値には、複数の色の配列を指定します。これは、backgroundColor が指定されていない場合にのみ使用します。
defaultLeafIcon型 : String   形式 : EmbeddedFile   CSS の継承 : なし
リーフノードのデフォルトのアイコンを指定します。MXML では、次のシンタックスを使用してこのプロパティを設定できます。defaultLeafIcon="@Embed('c.jpg');"
depthColors型 : Array   CSS の継承 : あり
Tree コントロールで使用されるカラーの配列です (降順)。
folderClosedIcon型 : String   形式 : EmbeddedFile   CSS の継承 : なし
ツリーのブランチノードで使用する、フォルダが閉じた状態のアイコンを指定します。MXML では、次のシンタックスを使用してこのプロパティを設定できます。folderClosedIcon="@Embed('b.jpg');"
folderOpenIcon型 : String   形式 : EmbeddedFile   CSS の継承 : なし
ツリーのブランチノードで使用する、フォルダが開いた状態のアイコンを指定します。MXML では、次のシンタックスを使用してこのプロパティを設定できます。folderOpenIcon="@Embed('a.jpg');"
indentation型 : Number   CSS の継承 : なし
ツリーの各レベルのインデントです (ピクセル単位)。デフォルト値は 8 です。
openDuration型 : Number   形式 : Time   CSS の継承 : なし
開いた状態や閉じた状態へのトランジションにかかる時間の長さです (ミリ秒単位)。デフォルト値は 250 です。
openEasing型 : String   形式 : Time   CSS の継承 : なし
コンポーネントトゥイーンを制御するためのイージング関数です。
rollOverColor型 : Number   形式 : Color   CSS の継承 : あり
マウスポインタが置かれているときのリンクの背景色です。デフォルト値は 0xE3FFD6 です。
selectionColor型 : Number   形式 : Color   CSS の継承 : あり
ユーザーがリンクを選択したときのリンクの背景色です。デフォルト値は 0xCDFFC1 です。

mx.controls.List クラスから継承されるスタイル
alternatingRowColors   marginBottom   marginTop   rollOverColor   selectionColor   selectionDisabledColor   selectionDuration   selectionEasing   textRollOverColor   textSelectedColor   useRollOver  

mx.core.UIComponent クラスから継承されるスタイル
backgroundAlpha   backgroundColor   backgroundDisabledColor   backgroundImage   backgroundSize   barColor   borderCapColor   borderColor   borderSides   borderStyle   borderThickness   cornerRadius   disabledColor   dropShadow   errorColor   fillColors   highlightColor   modalTransparency   scrollTrackColor   selectedFillColors   shadowCapColor   shadowColor   shadowDirection   shadowDistance   symbolBackgroundColor   symbolBackgroundDisabledColor   symbolBackgroundPressedColor   symbolColor   symbolDisabledColor   themeColor  

mx.core.UIObject クラスから継承されるスタイル
color   fontFamily   fontSize   fontStyle   fontWeight   horizontalGap   leading   marginLeft   marginRight   textAlign   textDecoration   textIndent   verticalGap  



メソッドの詳細

addTreeNode

addTreeNode( labelOrNode, data)

ツリーの最上位にノードを追加します。ツリーの他の部分にノードを追加する場合は、treeDataProvider に直接アクセスする必要があります。

パラメータ
    labelOrNode - 作成するノードのラベル、またはノードとしてラップするオブジェクトを表します。ストリングを渡すと、新しいノードの label プロパティにそのストリングが割り当てられます。メモ : Tree の labelField を label 以外のプロパティに設定した場合は、正しい値を使用してこのノードで setProperty を呼び出す必要があります。呼び出さない場合、labelOrNode 引数がコピーされません。Object を渡すと、オブジェクトであるプロパティ (ストリング、数値、ブール値ではないプロパティ) はすべて子として表示されます。このパラメータは必須です。
    data - 追加するデータです。このデータには getData() を使用していつでもアクセスできます。このパラメータはオプションです。

戻り値
     新規ノードです。


addTreeNodeAt

addTreeNodeAt( index, labelOrNode, data)

ツリーの最上位ノードの指定されたインデックスに子ノードを追加します。ツリーの他の部分にノードを追加する場合は、treeDataProvider に直接アクセスする必要があります。

パラメータ
    index - ノードの位置です。インデックス 0 が最上位ノードを表します。
    labelOrNode - 作成するノードのラベル、またはノードとしてラップするオブジェクトを表します。ストリングを渡すと、新しいノードの label プロパティにそのストリングが割り当てられます。メモ : Tree の labelField を label 以外のプロパティに設定した場合は、正しい値を使用してこのノードで setProperty を呼び出す必要があります。呼び出さない場合、labelOrNode 引数がコピーされません。Object を渡すと、オブジェクトであるプロパティ (ストリング、数値、ブール値ではないプロパティ) はすべて子として表示されます。このパラメータは必須です。
    data - 追加するデータです。このデータには getData() を使用していつでもアクセスできます。このパラメータはオプションです。

戻り値
     新規ノードです。


calculateWidths

calculateWidths( count)

コントロール内のコンテンツに基づいて、コントロールの推奨される幅を返します。この幅はコントロールのすべてのコンテンツについて計算することも、アイテムのサブセットについて計算することもできます。このメソッドではツリー内の各ノードを測定するため、実行に長い時間がかかる場合があります。このメソッドのシグネチャは、次のとおりです。
calculateWidth(count)

count - 測定するアイテムの数です。このパラメータはオプションです。

パラメータ
    count - 測定するノードの数です。


getDisplayIndex

getDisplayIndex( node)

ツリー内で現在開いているノードと閉じているノードの状態に基づいて、指定したノードがツリー内の何行目にあるかを返します。

パラメータ
    node - 調べるノードです。

戻り値
     ツリーの表示リストのインデックスです。


getDropParent

getDropParent( ) :  Object

ドラッグ & ドロップ操作時にドロップ位置の親ノードを返します。次のように呼び出しを行って、ドロップしたアイテムを Tree コントロールに挿入できます。getDropParent().addTreeNodeAt(getDropLocation(), myNode);


getIsBranch

getIsBranch( node)

指定したノードがブランチノードの場合は true を返します。ブランチノードとは、子があるノード、または明示的にブランチノードとしてマークされているノードです。

パラメータ
    node - 調べるノードです。

戻り値
     ブランチの場合は true、そうでない場合は false です。


getIsOpen

getIsOpen( node)

指定したノードのブランチが開いている (子が表示されている) 場合は true を返します。

パラメータ
    node - 調べるノードです。

戻り値
     開いている場合は true、そうでない場合は false です。


getNodeDisplayedAt

getNodeDisplayedAt( index)

ツリーの現在の状態に基づいて、指定したインデックス位置のノードを返します。ツリーをスクロールして表示可能なノードのリストと表示順序はツリーによって管理され、ノードが開かれたり閉じられたりするのに応じて変化します。たとえば、ルートノードのひ孫ノードがツリーの 9 番目の行に現在表示されているとしても、それはブランチの開閉の状態によって 9 番目の行に見えているにすぎません。ノードが開かれたり閉じられたりして状態が変化すると、9 番目の行に表示されていたノードは、場合によって別の行に移動したり、親ノードが閉じられて行との関連付けがなくなったりします。

パラメータ
    index - ツリー内に表示されるノードの行位置です。

戻り値
     ノードです。


getTreeNodeAt

getTreeNodeAt( index)

ツリーの最上位にある指定したインデックス位置のノードを返します。ツリーの他の部分にあるノードを取得する場合は、treeDataProvider に直接アクセスする必要があります。

パラメータ
    index - ノードの位置です。インデックス 0 が最上位ノードを表します。

戻り値
     ノードです。


removeAll

removeAll( )

ツリーからすべてのノードを削除します。


removeTreeNodeAt

removeTreeNodeAt( index)

ツリーの最上位から指定したノードを削除します。ツリーの他の部分にあるノードを削除する場合は、treeDataProvider に直接アクセスする必要があります。

パラメータ
    index - ノードの位置です。インデックス 0 が最上位ノードを表します。

戻り値
     ノードです。


setIcon

setIcon( node, iconID, iconID2)

ノードに関連付けるアイコンを設定します。これを設定すると、このノードがリーフノードの場合、iconField および iconFunction の設定よりも優先します。ブランチノードでは、iconField および iconFunction ではなく、folderOpenIcon および folderClosedIcon が使用されます。

パラメータ
    node - 設定の対象とするノードです。
    iconID - 閉じた状態のアイコン (またはリーフのアイコン) のリンケージ識別子です。
    iconID2 - 開いた状態のアイコン (またはリーフのアイコン) のリンケージ識別子です。


setIsBranch

setIsBranch( node, branch)

ノードがブランチノードかどうかを指定します。子があるノードは、自動的にブランチノードとして設定されます。このメソッドを呼び出す必要があるのは、空のブランチノードを作成し、それを folderOpenIcon および folderClosedIcon を使用して表示する場合のみです。

パラメータ
    node - 設定の対象とするノードです。
    branch - ブランチの場合は true、そうでない場合は falseです。


setIsOpen

setIsOpen( node, open, animate, fireEvent)

ブランチノードを開きます。ブランチノードを開くと、子ブランチが既にユーザーによって開かれている場合は、子ブランチの開閉の状態が復元されます。

パラメータ
    node - 設定の対象とするノードです。
    open - 開く場合は true、閉じる場合は false です。
    animate - トランジションをアニメーション化する場合は true、そうでない場合は false です。
    fireEvent - 開くアニメーションの終了後に、開くイベントを発行するかどうかを制御します。



プロパティの詳細

cellEditor

cellEditor:MovieClip  

セルエディタへの参照です (存在する場合)。


dataProvider

dataProvider:Object  

表示されるオブジェクトの階層構造を表す TreeDataProvider または XMLTreeDataProvider です。


firstVisibleNode

firstVisibleNode:var  

ツリーの一番上の行に現在表示されているノードです。ブランチが開閉およびスクロールされた状態に応じて、たとえば、現在表示可能なノードのうちリスト内では 9 番目であったり、ルートのひ孫にあたるようなアイテムであっても、一番上の行に表示されることがあります。このプロパティを設定することは、List コントロールの vPosition を設定するのに似ています。デフォルトは Tree コントロール内の最初のノードです。現在表示可能な状態にないノード (たとえば、展開されていないノードの下にあるノードなど) に対しては、このプロパティを設定しても効果はありません。
メモ : Flex 1.0 では、このプロパティは実際には XMLNode または TreeNode のいずれかであるのに対して、XMLNode として型付けされていました。現在では、いずれの場合にも対応するよう型付けされていません。


focusedCell

focusedCell:Object  

指定したノードに cellEditor を作成します。指定したノードが表示領域内にくるよう、必要に応じてスクロールします。


maxHPosition

maxHPosition:Number  

ツリーの hPosition の最大値です。List コントロールの maxHPosition とは異なり、この値はノードが開いたり閉じたりするたびに変化します。これを dataProvider 内で既知の最も幅の広いアイテムに設定すると、たとえそのアイテムが 4 段階下のレベルにあるような場合でも、ユーザーがスクロールして表示できるよう、必要に応じて値を調整します。したがって、maxHPosition の値を取得した場合は設定したのと同じ値が得られますが、それが実際にツリーによって使用される値とは限りません。


selectedNode

selectedNode:var  

ツリー内で選択されているノードです。単一のノードを指定することも、配列で複数のノードを指定 (selectedNodes プロパティを使用) することもできます。
メモ : Flex 1.0 では、このプロパティは実際には XMLNode または TreeNode のいずれかであるのに対して、XMLNode として型付けされていました。現在では、いずれの場合にも対応するよう型付けされていません。


selectedNodes

selectedNodes:Array  

選択されているノードです。multipleSelection が false の場合は、これではなく selectedNode を使用してください。


version

static  version:String  

このクラスのバージョンを表すストリングです。


TreeExample.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" backgroundColor="#FFFFFF">

<!-- Tree コントロールの使用方法を示す簡単な例 -->
<mx:XML id="myxml">
<Company label="Macromedia">
<Branch label="Newton">
<Department label="Flex Doc">
<Title label="Intern">
<Name label="Kapil Virdi"></Name>
</Title>
</Department>
</Branch>
</Company>
</mx:XML>

<mx:Panel id="treePanel" title="Tree Trace Panel" marginTop="10">
<mx:VBox>
<mx:Tree  id="EmployeeTrace"  width="285" height="196">

<mx:dataProvider>
	                  {myxml}
</mx:dataProvider>

</mx:Tree>
</mx:VBox>
</mx:Panel>

</mx:Application>