apache-flex - フレックス高度なデータグリッドの階層データ表示にチェックボックスを表示する方法

Question

私の高度なデータグリッドでは、階層データを表示しています。フォルダ アイコンの代わりに、選択または選択解除できるチェックボックスを表示する必要があります。選択したチェックボックスに基づいて、選択したセルの値を表示する必要があります。それを達成する方法を教えてください。

Answer 1

以下のコードが役に立ちます: - 必要に応じて、ロジックを実装できます。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.ListEvent;

            [Bindable]
            private var dpHierarchy:ArrayCollection = new ArrayCollection([
                {Region:"Southwest", categories: [
                    {Region:"Arizona", categories: [ 
                        {Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000}, 
                        {Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000}]},  
                    {Region:"Central California", categories: [ 
                        {Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000}]},  
                    {Region:"Nevada", categories: [ 
                        {Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000}]},  
                    {Region:"Northern California", categories: [ 
                        {Territory_Rep:"Lauren Ipsum", Actual:38805, Estimate:40000}, 
                        {Territory_Rep:"T.R. Smith", Actual:55498, Estimate:40000}]},  
                    {Region:"Southern California", categories: [ 
                        {Territory_Rep:"Alice Treu", Actual:44985, Estimate:45000}, 
                        {Territory_Rep:"Jane Grove", Actual:44913, Estimate:45000}]}
                ]}
            ]);


            protected function onItemClick(event:ListEvent):void
            {
                myADG_ID.expandItem(myADG_ID.selectedItem,!myADG_ID.isItemOpen(myADG_ID.selectedItem));
            }



        ]]>
    </fx:Script>

    <mx:AdvancedDataGrid id="myADG_ID" width="100%" height="100%" defaultLeafIcon="{null}" 
                         folderOpenIcon="{OpenCheckBox}" folderClosedIcon="{CloseCheckBox}"
                         itemClick="onItemClick(event)" 
                         displayDisclosureIcon="false"> 
        <mx:dataProvider>
            <mx:HierarchicalData source="{dpHierarchy}" 
                                 childrenField="categories"/>
        </mx:dataProvider>
        <mx:columns>
            <mx:AdvancedDataGridColumn dataField="Region"/>
            <mx:AdvancedDataGridColumn dataField="Territory_Rep"
                                       headerText="Territory Rep"/>
            <mx:AdvancedDataGridColumn dataField="Actual"/>
            <mx:AdvancedDataGridColumn dataField="Estimate"/>
        </mx:columns>
    </mx:AdvancedDataGrid>  
</s:Application>

OpenCheckBox.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:MXAdvancedDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                  xmlns:s="library://ns.adobe.com/flex/spark" 
                                  xmlns:mx="library://ns.adobe.com/flex/mx" 
                                  focusEnabled="true" width="100%" height="100%">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:CheckBox id="cbSelector" selected="true" width="100%" />
</s:MXAdvancedDataGridItemRenderer>

CloseCheckBox.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:MXAdvancedDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                  xmlns:s="library://ns.adobe.com/flex/spark" 
                                  xmlns:mx="library://ns.adobe.com/flex/mx" 
                                  focusEnabled="true" width="100%" height="100%">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:CheckBox id="cbSelector" selected="false" width="100%" />
</s:MXAdvancedDataGridItemRenderer>