这里发生的是flex只为
看得见的
柱。当您滚动时,这些实例将被回收。因此,如果向下滚动,绘制第一行第一列的RadioButton对象现在可能改为绘制第七行的第一列。每当发生这种情况时,flex将重置itemrenderer的“data”属性。
因此,尽管有15行数据,但只有12个单选按钮(6个表示“左”,6个表示“右”,6个表示“可见行”),而不是您所期望的30个单选按钮。如果你只是
显示
选择,但当您允许更新时,它会成为一个更大的问题。
要解决显示问题,您可以将RadioButton的“Selected”属性绑定到itemRenderer的data.left(或right)值,而不是在列上设置“DataField”。然后,您需要使数据提供程序中的项“可绑定”。
要解决更新问题,因为您将直接绑定到数据提供程序项值,所以需要确保更新它们。因为每个项目没有一个单选按钮,所以您需要另一个方案来实现这一点。在本例中,我放入了一个处理程序,该处理程序将每个项的左/右属性设置为“false”,但“selected”属性除外,该属性设置为“true”。
我基于这些想法更新了您的示例代码。尝试如下操作:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application layout="absolute"
xmlns:my="*"
xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:RadioButtonGroup id="leftAxisGrp"
change="selectItem(leftAxisGrp.selectedValue, 'left');"/>
<mx:RadioButtonGroup id="rightAxisGrp"
change="selectItem(rightAxisGrp.selectedValue, 'right');">
</mx:RadioButtonGroup>
<mx:AdvancedDataGrid
id="readingsGrid"
designViewDataType="flat"
height="150" width="400"
sortExpertMode="true"
selectable="false"
dataProvider="{adgData.object}">
<mx:columns>
<mx:AdvancedDataGridColumn
headerText="L" width="25" paddingLeft="6"
sortable="false">
<mx:itemRenderer>
<mx:Component>
<mx:RadioButton groupName="leftAxisGrp"
value="{data}" selected="{data.left}"/>
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn
headerText="R" width="25" paddingLeft="6"
sortable="false">
<mx:itemRenderer>
<mx:Component>
<mx:RadioButton groupName="rightAxisGrp"
value="{data}" selected="{data.right}"/>
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn headerText="" dataField="name" />
</mx:columns>
</mx:AdvancedDataGrid>
<mx:Model id="adgData">
<root>
<object left="false" right="false" name="Reddish-gray Mouse Lemur" />
<object left="false" right="false" name="Golden-brown Mouse Lemur" />
<object left="false" right="false" name="Northern Rufous Mouse Lemur" />
<object left="false" right="false" name="Sambirano Mouse Lemur" />
<object left="false" right="false" name="Simmons' Mouse Lemur" />
<object left="false" right="false" name="Pygmy Mouse Lemur" />
<object left="false" right="false" name="Brown Mouse Lemur" />
<object left="false" right="false" name="Madame Berthe's Mouse Lemur" />
<object left="false" right="false" name="Goodman's Mouse Lemur" />
<object left="false" right="false" name="Jolly's Mouse Lemur" />
<object left="false" right="false" name="Mittermeier's Mouse Lemur" />
<object left="false" right="false" name="Claire's Mouse Lemur" />
<object left="false" right="false" name="Danfoss' Mouse Lemur" />
<object left="false" right="false" name="Lokobe Mouse Lemur" />
<object left="true" right="true" name="Bongolava Mouse Lemur" />
</root>
</mx:Model>
<mx:Script>
<![CDATA[
private function selectItem(selObject:Object, property:String) : void {
for each(var obj:Object in adgData.object) {
obj[property] = (obj === selObject);
}
readingsGrid.invalidateDisplayList();
}
]]>
</mx:Script>
</mx:Application>
