При прокрутке мой checkBox в itemRenderer отмечен / не отмечен

Question

This is my application:


<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark">

    <s:layout>
        <s:VerticalLayout/>
    </s:layout>

    <fx:Script>
        <![CDATA[
            import mx.collections.XMLListCollection;
            import mx.controls.Alert;
            import mx.events.FlexEvent;

            import spark.components.gridClasses.IGridItemRenderer;

            public var modulesXMLList:XMLListCollection;

            private function onGridInitialize(event:FlexEvent):void{
                this.addEventListener('moduleItemChange', onModuleItemChange);
            }

            private function onModuleItemChange(event:Event):void{
                var item:IGridItemRenderer = event.target as IGridItemRenderer;

                if(!item || !item.data) 
                    //item.data.access = !item.data.access;
                    Alert.show(item.data.sub_module);    
            }

            protected function controlPanel_Datagrid_creationCompleteHandler(event:FlexEvent):void
            {
                modulesXMLList = new XMLListCollection(tempXML.module as XMLList);

                modulesXMLList.refresh();
                myDatagrid.dataProvider = modulesXMLList;

            }

        ]]>
    </fx:Script>

    <fx:Declarations>

        <s:RadioButtonGroup id="rbg1"/>
        <fx:XML id="tempXML" source="assets/myXMl1.xml"/>

        <!--<s:ArrayCollection id="moduleControlPanel_DP">
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub1" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub2" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub3" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub4" default="true" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub5" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub6" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub7" default="true" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub8" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub9" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub11" default="true" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub11" default="true" access="true"/>
        </s:ArrayCollection>
        -->
    </fx:Declarations>


    <s:DataGrid id="myDatagrid" creationComplete="controlPanel_Datagrid_creationCompleteHandler(event)" rowHeight="35" fontSize="9"  
                x="20" y="20" width="184" height="176">
        <s:columns>
            <s:ArrayList>                   
                <s:GridColumn headerText="Default">
                    <s:itemRenderer>
                        <fx:Component>
                            <s:GridItemRenderer>
                                <s:RadioButton name="yoyo" group="{outerDocument.rbg1}" selected="@{data.default}" label="" horizontalCenter="0"/>
                            </s:GridItemRenderer>
                        </fx:Component>
                    </s:itemRenderer>
                </s:GridColumn> 
                <s:GridColumn headerText="Access" dataField="@access">
                    <s:itemRenderer>
                        <fx:Component>
                            <s:GridItemRenderer>

                                <fx:Script>
                                    <![CDATA[

                                        override public function set data(value:Object):void
                                        {
                                            // not sure of the details on when or why, but sometimes this method is passed a null value
                                            if(value != null)
                                            {
                                                //super.data = value;
                                                // set itemRenderer's state based on data value
                                                //chk.selected = value.access;
                                                super.data = value;
                                                validateNow();
                                            }
                                        }

                                        protected function Check_clickHandler(even:MouseEvent):void
                                        {

                                            dispatchEvent(new Event('moduleItemChange', true));
                                        }  
                                    ]]>
                                </fx:Script>

                                <s:CheckBox id="chk" click="Check_clickHandler(event)" label="" selected="@{data.access}" horizontalCenter="0"/>
                            </s:GridItemRenderer>
                        </fx:Component>
                    </s:itemRenderer>
                </s:GridColumn>
                <s:GridColumn headerText="Sub-Module" dataField="@sub_module" />
            </s:ArrayList>
        </s:columns>
    </s:DataGrid>

</s:Application>



And this my C<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark">

    <s:layout>
        <s:VerticalLayout/>
    </s:layout>

    <fx:Script>
        <![CDATA[
            import mx.collections.XMLListCollection;
            import mx.controls.Alert;
            import mx.events.FlexEvent;

            import spark.components.gridClasses.IGridItemRenderer;

            public var modulesXMLList:XMLListCollection;

            private function onGridInitialize(event:FlexEvent):void{
                this.addEventListener('moduleItemChange', onModuleItemChange);
            }

            private function onModuleItemChange(event:Event):void{
                var item:IGridItemRenderer = event.target as IGridItemRenderer;

                if(!item || !item.data) 
                    //item.data.access = !item.data.access;
                    Alert.show(item.data.sub_module);    
            }

            protected function controlPanel_Datagrid_creationCompleteHandler(event:FlexEvent):void
            {
                modulesXMLList = new XMLListCollection(tempXML.module as XMLList);

                modulesXMLList.refresh();
                myDatagrid.dataProvider = modulesXMLList;

            }

        ]]>
    </fx:Script>

    <fx:Declarations>

        <s:RadioButtonGroup id="rbg1"/>
        <fx:XML id="tempXML" source="assets/myXMl1.xml"/>

        <!--<s:ArrayCollection id="moduleControlPanel_DP">
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub1" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub2" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub3" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub4" default="true" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub5" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub6" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub7" default="true" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub8" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub9" default="false" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub11" default="true" access="true"/>
            <fx:Object habilitations_id ="1" module_id="4" sub_module="Sub11" default="true" access="true"/>
        </s:ArrayCollection>
        -->
    </fx:Declarations>


    <s:DataGrid id="myDatagrid" creationComplete="controlPanel_Datagrid_creationCompleteHandler(event)" rowHeight="35" fontSize="9"  
                x="20" y="20" width="184" height="176">
        <s:columns>
            <s:ArrayList>                   
                <s:GridColumn headerText="Default">
                    <s:itemRenderer>
                        <fx:Component>
                            <s:GridItemRenderer>
                                <s:RadioButton name="yoyo" group="{outerDocument.rbg1}" selected="@{data.default}" label="" horizontalCenter="0"/>
                            </s:GridItemRenderer>
                        </fx:Component>
                    </s:itemRenderer>
                </s:GridColumn> 
                <s:GridColumn headerText="Access" dataField="@access">
                    <s:itemRenderer>
                        <fx:Component>
                            <s:GridItemRenderer>

                                <fx:Script>
                                    <![CDATA[

                                        override public function set data(value:Object):void
                                        {
                                            // not sure of the details on when or why, but sometimes this method is passed a null value
                                            if(value != null)
                                            {
                                                //super.data = value;
                                                // set itemRenderer's state based on data value
                                                //chk.selected = value.access;
                                                super.data = value;
                                                validateNow();
                                            }
                                        }

                                        protected function Check_clickHandler(even:MouseEvent):void
                                        {

                                            dispatchEvent(new Event('moduleItemChange', true));
                                        }  
                                    ]]>
                                </fx:Script>

                                <s:CheckBox id="chk" click="Check_clickHandler(event)" label="" selected="@{data.access}" horizontalCenter="0"/>
                            </s:GridItemRenderer>
                        </fx:Component>
                    </s:itemRenderer>
                </s:GridColumn>
                <s:GridColumn headerText="Sub-Module" dataField="@sub_module" />
            </s:ArrayList>
        </s:columns>
    </s:DataGrid>

</s:Application>


And this is my XML file:

<?xml version="1.0" encoding="UTF-8"?>

<modules>
    <module habilitation_id="1" module_id="1" sub_module="Sub1" default="true" access="true" />
    <module habilitation_id="1" module_id="2" sub_module="Sub2" default="true" access="true" />
    <module habilitation_id="1" module_id="2" sub_module="Sub3" default="false" access="false" />
    <module habilitation_id="1" module_id="2" sub_module="Sub4" default="false" access="true" />
    <module habilitation_id="1" module_id="3" sub_module="Sub5" default="true" access="true" />
    <module habilitation_id="1" module_id="3" sub_module="Sub6" default="false" access="true" />
    <module habilitation_id="1" module_id="4" sub_module="Sub7" default="true" access="true" />
    <module habilitation_id="1" module_id="4" sub_module="Sub8" default="false" access="true" />
</modules>




Anyone please throw some lights.

Answer 1

Только что посмотрел этот пост и, кажется, вы еще не приняли никакого ответа:

Ваш инструмент визуализации:

override public function set data(value:Object):void
{
    if(value != null)
    {
        super.data = value;
        //chk.selected = value.access;
        validateNow();
    }
}

Раскомментируйте вышеприведенную строку: //chk.selected = value.access;

Flex DataGrid перезапускает свои itemRenderers для лучшей производительности памяти.Когда вы проверяете CheckBox на itemRenderer и запускаете прокрутку, этот itemRenderer с установленным флажком повторно используется для отображения других записей с установленным значением selected = "true".

Таким образом, вы должны явно установить проверкустоимость коробки.Для этого примера, если value.access является логическим значением и он для флажка, он определенно будет работать.

Спасибо.

Answer 2

Это весело.Я столкнулся с этим некоторое время назад.Ваш рендерер предметов уничтожается и используется повторно, когда он прокручивается за пределы экрана.Поэтому он не выбран.Если я правильно помню, попробуйте связать ваши элементы управления с методом в рендере, который обновляет их значения до значений в объекте данных.например, <s:checkbox selected={myMethod(data.selected)} /> или найдите событие обновления в рендерере и установите ваши значения.