Flex AutoComplete: Version 1.2

I’m just wrapping up a Flex project which used the component extensively. Along the way I noticed a number of reasonably serious bugs which this update fixes.

Latest version

  • When using the component as an item renderer the sizing is sometimes messed up
  • Prevented a toolTip from appearing when selecting an item
  • Resolved tab focus issue when using the component in a Flex 4 project

One other change in this release is that all private methods and properties have been changed to protected. Minor changes should no longer require using the sourecode.

Best,
Hillel

35 thoughts on “Flex AutoComplete: Version 1.2”

  1. Awesome! Great timing for an update, and thanks again for such a wonderful contribution to the Flex community. I use it a lot!

    Reply

  6. I’ve make some modifications to get what I will:
    I wanted a combo without multiple selection and without selected item skin in prompt (I don’t know why to set the selectedItemStyleName property to “none” don’t work for me) .
    So I have put the property “_showSelectedItems” public to make it true. Then I changed the method “handleSelectedItemsChange ()” and commented out the line “searchtext = null;”
    I think this component can be easily modified to accommodate this simple use case.
    Thanks.

    Reply

  7. Hi,
    First, thanks for the excellent component.
    I use it with states and sometimes when it is in a hidden state, something is trying to get it to focus (not sure what). When this happens, it fails in FlowBox.mxml line 63 because “focusPane” is null. My fix is to add…
    if (focusPain != null) drawFocus(true);

    Just wanted to see if I could get that added to the trunk.
    Thanks!

    Reply

  8. Great stuff! I have a comparative method, but it uses the local database and SQL statements to perform the search + auto complete. But I must say, your method is more elegant!!

    Can I ask, is it possible to do a search on multiple array fields? For example, to search ‘B5B35C’ for both labelField=”name” and labelField=”hex” and the result will show Olive Green.

    Reply

  9. Hi,

    I’m seeing some html showing up in the labels for individual items that are not selected. Like A, etc. This disappears when the item is selected. Any advice? I’m using the Flex 4 version with the swc.

    Jeff

    Reply

    1. It’s hard to say, I haven’t seen that myself. If you could put together a sample application which demonstrates the issue I’d be happy to help debug it.

      Reply

  10. Hillel,

    I’ve sent you a screen grab of what I’m seeing. I’ve dug into the code and it appears to be an issue with the mx:Label that’s being used for the drop down item renderer. Basically it’s not interpreting the html tags – just sending it back as a string.

    I briefly looked into the Spark label and I see that it would have to rely on the Text framework as provided by Spark.

    Jeff

    Reply

    1. If you’re not already doing so you may want to set a custom item renderer. ColorItemRender.xml in the examples folder of the download is worth checking out.

      Reply

  11. I use the Flex 4 SWC but get the following error:

    warning: incompatible embedded font ‘ArialCFF’ specified for mx.core::UITextField (UITextField1486) . This component requires that the embedded font be declared with embedAsCFF=false.

    Are you sure you’re using flex 4 components in your SWC ?

    I cannot embed the font one more time just for this component, is there any workaround for this ?

    TIA

    Reply

      1. Thank you I figured that out later but still cannot make it work in my 4.5 application:
        If I use cff=true fonts, it complains, and if I use cff=false fonts, it also complains, so I’m pretty stuck 🙂

        Maybe you are going to make a full flex 4 version someday ?

    2. I am having the same issues here. I can make it work with Flex 4 using embedded fonts.
      Great component !

      Reply

      2. Hilal, fonts are correctly embedded but your lovely component complains with or without CFF for a given embedded font.

        Anyway, I’m sure one day you’ll make flex 4 version so I’ll wait 🙂
        Keep doing good work !

  12. I use the Flex 4.5 SWC.
    I have only one problem:
    AutoComplete.focusEnabled=true for the item focus with tabulator key didn’t work in mx:Form.

    It is an important functionality to work “mousless”.

    Reply

  13. Hi Hillel! once again, thanks for this amazing component! I’ve an issue and I would like a little help.

    I’m implementing a Virtual Keyboard that appears everytime a textfield is focused. Iv’e wrapped your AutoComplete class and given the “extra instruction” to dispatch the ShowVKeyBoard event.

    Now, for the keyboard to know where to type the characters, I’ve implemented a

    public static function getCurrentTextInputTarget(currentFocusedObject:IFocusManagerComponent):SkinnableTextBase{
    var txtTarget:SkinnableTextBase;
    …
    }else if (objectClass == ShorterTextInput)
    {
    txtTarget = currentFocusedObject as SkinnableTextBase;
    }
    return txtTarget;
    }

    then the keyboard uses the txtTarget.text property to write the keys.

    But as you can see, currentFocusedObject as SkinnableTextBase returns NULL cause your text area does not extends SkinnableTextBase.

    So

    1): is ShorterTextInput the “skin part” that I want to write down the characters from my keyboard (i.e. programmatically?)

    2) if it is, does it extends from flash.text.TextField?

    3) if non of the above, any hint?

    THANKS and especially: Merry Christmas!

    Reply

    1. As I understand it, SkinnableTextBase is used by the spark component set (which the AutoComplete doesn’t use). ShorterTextInput extends the MX TextInput (and enables it to be shorter than would otherwise be allowed). You’ll want to come up with an MX compatible solution.

      Hope this helps…

      Reply

  14. Hi, I m using this component in Flex 4.1, I figure out sometime List shows blank rows. Same thing happened when select one item and if I selecting another one first item’s font goes invisible/blank.

    Thanks
    sk

    Reply

    1. I’d check for a possible null error in your redering logic (Flex swallows nulls in binding and can cause blank rows). Otherwise, if you could create a sample application demonstrating the issue I’d be happy to help debug it.

      Reply

  15. Hi Hillel,

    Thanks for educating us with your blogs and programs.. I am just a beginner in flex. Sorry for my silly doubt. I would like to use your component for my text box. I downloaded the source code and added it to my build path by choosing add swc folder. And also in my main.mxml file i added this line xmlns:components=”com.hillelcoren.components.*”> but I am getting an error

    The prefix “hc” for element “hc:Chooser” is not bound.

    Could you please guide me, on how should i debug it?

    Thanks in advance

    Reply

    1. Try adding this to the top of the page:

      xmlns:hc=”com.hillelcoren.components.*”

      Also, a simpler way to use the component is to put the swc file from the bin folder of the download in the lib directory of your flex project.

      Reply

Leave a comment