Question

我有DropDownlist，其中包含Itemrenderer，如下所示：

<s:DropDownList dataProvider="{testList}" labelField="test" 
                        itemRenderer="DropDownSelectRenderer"/>

的ItemRenderer：

<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" >

<fx:Script>
        <![CDATA[

            protected function onChange(event:Event):void
            {
                trace("checked");
            }

        ]]>
    </fx:Script>

<s:CheckBox id="chkBox" selected="{data.selected}" change="onChange(event)"  />
<s:Label id="lblCon" fontSize="14" text="{data.test}"  />

</s:ItemRenderer>

我希望CheckBox chkBox更改并在点击事件上标记lblCon，
但是当我打开Dropdown并尝试单击CheckBox时，DropDown将关闭，并且不会检查CheckBox。

感谢任何帮助。

Answer 1

您可能希望使用 PopUpButton ，如下所示：

<?xml version="1.0"?>
<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">
<fx:Script><![CDATA[
    import mx.collections.ArrayCollection;

    [Bindable]
    private var testList:ArrayCollection = new ArrayCollection([
        {"test":"Test A", "selected": false},
        {"test":"Test B", "selected": true},
        {"test":"Test C", "selected": false},
        {"test":"Test D", "selected": false}
    ]);
    protected function closeButtonClickHandler(event:MouseEvent):void {
        testPopUp.close();
    }
    ]]></fx:Script>
<mx:PopUpButton id="testPopUp"
                width="150">
    <mx:popUp>
        <mx:VBox width="150" backgroundColor="0xd3d3d3">
            <mx:List id="list"
                     dataProvider="{testList}"
                     height="{testList.length * 25}"
                     width="100"
                     borderStyle="none">
                <mx:itemRenderer>
                    <fx:Component>
                        <mx:CheckBox height="20">
                            <fx:Script>
                                <![CDATA[
                                override public function set data(value:Object):void
                                {
                                    super.data = value;
                                    if (value && value.test)
                                    {
                                        super.label = value.test;
                                        super.selected = value.selected;
                                    }
                                }
                                ]]>
                            </fx:Script>
                        </mx:CheckBox>
                    </fx:Component>
                </mx:itemRenderer>
            </mx:List>
            <mx:Button label="Close"
                       click="closeButtonClickHandler(event)"/>
        </mx:VBox>
    </mx:popUp>
</mx:PopUpButton>
</s:Application>

复选框未在下拉列表中检入itemrendere flex

1 个答案: