正在检测ItemRenderer中的复选框选择

Question

我需要显示一个列表，其中每个项目都由一个复选框和一个标签组成。为此，我为List创建了一个自定义的itemrenderer类。创建和应用renderer类非常简单，所有内容都显示正确。现在，我需要向renderer类添加一个函数，该函数将在选中或取消选中复选框时更改文本颜色。我知道CheckBox有一个"更改"事件，但当我试图收听该事件时，我遇到了第二十二条军规。我需要将renderer类的"mouseChildren"属性设置为false，以防止List和Checkbox的鼠标事件相互干扰。不幸的是，将该属性设置为false也会阻止复选框中的更改事件，因此我的处理程序永远不会被调用。我完全被这件事难住了，任何帮助都将不胜感激。

作为参考，以下是我的渲染器类的代码：

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:s="library://ns.adobe.com/flex/spark"
                xmlns:mx="library://ns.adobe.com/flex/mx"
                autoDrawBackground="true"
                mouseChildren="false"
                width="100%">
    <s:states>
        <s:State name="normal"/>
        <s:State name="hovered"/>
        <s:State name="selected"/>
    </s:states>
    <s:HGroup left="10"
              right="0"
              top="0"
              bottom="0"
              verticalAlign="middle"
              gap="3">
        <s:CheckBox selected.selected="true"
                    change="{handleCBChange()}"/>
        <s:Label text="{data.value}"
                 width="100%"/>
    </s:HGroup>
    <fx:Script>
        <![CDATA[
            public function handleCBChange():void
            {
                trace("Checkbox clicked");
            }
        ]]>
    </fx:Script>
</s:ItemRenderer>

Answer 1

经过一段时间的努力，我想我终于解决了这个问题。关键是我是如何绑定选定的。

selected.selected="true"

该代码的目的是确保在用户单击"列表项"上的任何位置时切换复选框（从而更改渲染器状态）。问题是，单击实际复选框也会导致所选的值发生更改。因此，状态更改是将"selected"设置为true，然后复选框通过将其设置回false来响应单击。通过将"mouseChildren"设置为false，我可以防止复选框上的鼠标事件重新调整选择。不幸的是，它还抑制了我试图收听的"更改"事件。

好消息是，我找到了一个变通办法。我没有监听复选框的"change"事件，而是为"valueCommit"事件添加了一个监听器。由于valueCommit是由对"selected"的编程更改触发的，因此selected.selected=true绑定将触发事件并让我对更改做出响应。