Flex Examples
The following example shows how you can check whether a drop down list menu is open in a Spark DropDownList control in Flex 4 by checking the Boolean isDropDownOpen property.
Full code after the jump.
The following example(s) require Flash Player 10 and the Adobe Flex 4 SDK. To download the Adobe Flash Builder 4 trial, see http://www.adobe.com/products/flex/. To download the latest nightly build of the Flex 4 SDK, see http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4.
For more information on getting started with Flex 4 and Flash Builder 4, see the official Adobe Flex Team blog.
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2009/08/06/determining-if-a-drop-down-menu-is-open-in-a-spark-dropdownlist-control-in-flex-4/ --> <s:Application name="Spark_DropDownList_isDropDownOpen_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo"> <fx:Script> <![CDATA[ protected function init():void { checkBox.selected = ddl.isDropDownOpen; } ]]> </fx:Script> <s:CheckBox id="checkBox" label="isDropDownOpen" mouseEnabled="false" tabEnabled="false" creationComplete="init()" x="10" y="10" /> <s:DropDownList id="ddl" requireSelection="true" width="150" horizontalCenter="0" top="40" open="init();" close="init();"> <s:dataProvider> <s:ArrayList source="[The,Quick,Orange,Fox,Jumps,Over,The,Lazy,Dog]" /> </s:dataProvider> </s:DropDownList> </s:Application>
View source is enabled in the following example.
This entry is based on a beta version of the Flex 4 SDK and therefore is very likely to change as development of the Flex SDK continues. The API can (and will) change causing examples to possibly not compile in newer versions of the Flex 4 SDK.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
Hey Peter,
Any idea what would be causing this (http://www.lbpbadminton.com/images/DropDownListIssue.jpg) to happen with my spark drop down list?
Thanks,
Greg.
Greg,
I’ve never seen that before, and I wasn’t able to reproduce the issue locally.
Can you please file a bug at http://bugs.adobe.com/flex/ with a simple test case showing the behavior. Or, if you can give me a few more details so I can try and reproduce the issue, I can file the bug for you (and help you try and find a workaround).
Peter
I tried to reproduce the behaviour with a simple test case and couldn’t either. The application base consists of several modules loaded into a SkinnableContainer (one module for the header, one for the nav, and one for the content). The content module, in this case, has 2 components (one for its titlebar and one for its content). A button in the content module’s content component launches a modal pop up window (which is a SkinnableContainer component in this case). This is the component that has the DropDownList.
I’ve seen several bugs posted that relate to the DropDownList not positioning correct if the component is moved. I’ve tried dynamically adding the DropDownList to the pop up after its creationComplete and I get the same behaviour, so I’m not sure if that bug I’ve seen is related or not.
I’ll try to create a simple test case that can reproduce the issue. If I can’t, can I Email you my files privately? This is a small part of a pretty big application (or what will be a big application when it is completed).
@Greg,
I sent you an email. Send me your files and I can take a look later today and we can try and get a bug filed for this.
I don’t think I’ll be able to sleep until I can reproduce this issue and we can submit a bug.
Thanks,
Peter
Greg, does your project use only Spark components, or it also uses components from Halo theme? As far as I know, positioning can be wrong if Spark component is put in Halo container. The workaround in such situation is to wrap Spark component with Spark container, which resides in Halo container.
I’ve used spark components as much as possible. The modules are mx because that’s the only choice for them. Each module’s 1st child is a SkinnableContainer, so the overall structure would be…
spark (application) -> mx (module) -> spark (SkinnableContainer) -> spark (pop up SkinnableContainer)
Just to close the loop on this… A bug was filed a few days ago, http://bugs.adobe.com/jira/browse/SDK-22425, and there is a bug when the dropDown was opened inside of a module. Adobe is actively working on a fix.
Thanks everybody,
Peter
[SDK-22425] Opening a DropDownList that is in a child application from a different domain from the parent causes a RTE has been fixed in SDK 4.0.0.9182. For more information, see http://forums.adobe.com/message/2163715.
Peter