获取特定单元格的 ItemRenderer - Flex DataGrid

Question

我有一个包含 2 列的数据网格。每当 column-1 值发生变化时，我都需要访问第二列的项目渲染器。即如果第 1 列的值为 A- 需要在第 2 列中显示文本字段，如果值为 B，我需要显示下拉列表。

Col1---------Col2

A ---------- 下拉菜单

B ---------- 文本框

A ----------下拉

任何解决方案？？？

public class ItemRendererfroDropTest extends GridItemRenderer
{
    private var dropdown:DropDownList;
    public function ItemRendererfroDropTest()
    {
        super();
        dropdown=new DropDownList();
        dropdown.dataProvider=new ArrayCollection(new Array("ABC","PQR"));
        this.addElement(dropdown);
        dropdown.addEventListener(FlexEvent.VALUE_COMMIT,dataChanged);
    }

    private function dataChanged(event:FlexEvent):void
    {
        owner.dispatchEvent(new CustomEvent(CustomEvent.DATA_CHANGED,true));
    }

}


public class ItemRenderlabel extends GridItemRenderer
{
    public var wlabel:Label=new Label();
    public var checkbox:CheckBox=new CheckBox();

    public function ItemRenderlabel()
    {
        super();
        this.addEventListener(CustomEvent.DATA_CHANGED,mappingChanged,true);
        this.addElement(wlabel);
    }
    private function mappingChanged(e:CustomEvent):void
    {
        Alert.show("asfAS");
    }
}

Answer 1

使用ViewStack创建项目渲染器并根据需要使用视图，并像通常为项目渲染器所做的那样覆盖数据函数，以设置字段容器基础的活动子级，如果您想动态设置活动子级，请参阅post

希望有帮助

Answer 2

您可以从下面的代码中获得一些想法：- 事件您可以通过使用 dpHierarchy.itemUpdated() 更新单个行来仅针对特定项目执行此操作。

<?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"
               creationComplete="init()">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            [Bindable]
            private var dpHierarchy:ArrayCollection= new ArrayCollection([
                {name:"A", region: "Arizona"},
                {name:"B", region: "Arizona"},
                {name:"C", region: "California"},
                {name:"D", region: "California"}
            ]); 

            private function init():void
            {
                this.addEventListener(FlexEvent.DATA_CHANGE, changeDataHandler);
            }

            private function changeDataHandler(event:FlexEvent):void
            {
                dpHierarchy.refresh();
            } 
        ]]>
    </fx:Script>

    <mx:AdvancedDataGrid id="myADG" 
                         width="100%" height="100%" 
                         variableRowHeight="true" dataProvider="{dpHierarchy}">
        <mx:columns>
            <mx:AdvancedDataGridColumn dataField="name" headerText="Name" itemRenderer="AddComboboxADG"/>
            <mx:AdvancedDataGridColumn dataField="region" headerText="Region" itemRenderer="SelectedCustomComponent"/>
        </mx:columns>   

    </mx:AdvancedDataGrid>

</s:Application>

//AddComboboxADG自定义项渲染器

<?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">
    <fx:Script>
        <![CDATA[
            import mx.controls.AdvancedDataGrid;
            import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
            import mx.controls.advancedDataGridClasses.AdvancedDataGridHeaderRenderer;
            import mx.controls.advancedDataGridClasses.AdvancedDataGridListData;
            import mx.events.AdvancedDataGridEvent;
            import mx.events.DataGridEvent;
            import mx.events.FlexEvent;
            import mx.events.ItemClickEvent;

            import spark.components.supportClasses.ItemRenderer;
            import spark.events.IndexChangeEvent;


            protected function comboBoxID_changeHandler(event:IndexChangeEvent):void
            {
                data.name = comboBoxID.selectedItem;
                dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE, true));
            }

            override public function set data(value:Object):void
            {
                super.data = value;

                if(data.name == "A")
                {
                    comboBoxID.selectedIndex = 0;
                }else if(data.name == "B")
                {
                    comboBoxID.selectedIndex = 1;
                }else if(data.name == "C")
                {
                    comboBoxID.selectedIndex = 2;   
                }else
                {
                    comboBoxID.selectedIndex = 3;
                }
            }

        ]]>
    </fx:Script>

    <s:DropDownList id="comboBoxID" change="comboBoxID_changeHandler(event)">
        <s:ArrayCollection>
            <fx:String>A</fx:String>
            <fx:String>B</fx:String>
            <fx:String>C</fx:String>
            <fx:String>D</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>
</s:MXAdvancedDataGridItemRenderer>

//SelectedCustomComponent 自定义项渲染器

<?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">
    <fx:Script>
        <![CDATA[
            override public function set data(value:Object):void
            {
                super.data = value;
                customFirstDropDown.visible = customTextInput.visible = customSecondDropDown.visible = lblData.visible = false;

                if(data.name == "A")
                {
                    customFirstDropDown.visible = true;
                }else if(data.name == "B")
                {
                    customTextInput.visible = true;
                }else if(data.name == "C")
                {
                    customSecondDropDown.visible = true;    
                }else
                {
                    lblData.visible = true;
                }
            }
        ]]>
    </fx:Script>

    <s:DropDownList id="customFirstDropDown" visible="false" selectedIndex="0">
        <s:ArrayCollection>
            <fx:String>First</fx:String>
            <fx:String>Second</fx:String>
            <fx:String>Third</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>
    <s:TextInput id="customTextInput" visible="false" text="Selected"/>
    <s:DropDownList id="customSecondDropDown" visible="false" selectedIndex="0">
        <s:ArrayCollection>
            <fx:String>1</fx:String>
            <fx:String>2</fx:String>
            <fx:String>3</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>   

    <s:Label id="lblData" visible="false" text="Selected"/>
</s:MXAdvancedDataGridItemRenderer>