Question

我需要显示一个列表，其中每个项目都包含一个复选框，后跟一个标签。为此，我为List创建了一个自定义itemrenderer类。创建和应用渲染器类非常简单，一切都正确显示。现在我需要向渲染器类添加一个函数，该函数将在选中或取消选中复选框时更改文本颜色。我知道CheckBox有一个'更改'事件，但当我尝试侦听该事件时，我遇到了一个catch-22。我需要将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 = “真”

该代码的目的是确保如果用户单击List Item上的任何位置（从而更改渲染器状态），则会切换复选框。麻烦的是单击实际的复选框也会导致选中的值发生变化。所以状态更改是将“selected”设置为true，然后复选框通过将其设置为false来响应单击。通过将'mouseChildren'设置为false，我阻止了复选框上的鼠标事件，从而阻止了选择。不幸的是，它也抑制了我试图倾听的“变化”事件。

好消息是，我找到了解决方法。我没有收听复选框的“更改”事件，而是为“valueCommit”事件添加了一个监听器。由于valueCommit被程序化更改激活为“selected”，因此selected.selected = true绑定将触发事件并让我响应更改。

检测ItemRenderer中的CheckBox选择

1 个答案: