Wednesday, October 27, 2010

Spell Checking

Here is a short example of how to get the Adobe Squiggly spell checking tool installed. Squiggly can be downloaded here.

Squiggly files:
  • AdobeSpellingConfig.xml - put this file in your project's src folder. It defines the locations of the dictionaries and which language(s) to use.
  • en_US.aff, en_US.dic - these are the dictionary files. You'll need different ones for different languages of course. By default they go in the src/dictionaries/en_US folder.
  • AdobeSpellingEngine.swc - the main engine library - required, goes in project lib folder.
  • AdobeSpellingUI.swc - the ui library for Flex 3/MX components (e.g. <mx:TextArea>)
  • AdobeSpellingUIEx.swc - the ui library for Flex 4/Spark components (e.g. <s:TextArea>)
** Only use one of AdobeSpellingUI.swc or AdobeSpellingUIEx.swc.

To integrate Spell Checking into a Spark TextArea (id="textArea"), all you have to do is add one line:

SpellUI.enableSpelling(textArea, "en_US");

I did notice one problem with using Squiggly with Spark controls. The default Cut/Copy/Paste/Select All context menu items were not available anymore. I found a workaround for this by getting the contextMenu (which gets set on the RichEditableText control, not the TextArea) and setting clipboardMenu = true. See the example below for more details (right click to View Source).

Squiggly is still in prerelease, so a few bugs are expected. There is a forum here for discussions on Squiggly, and to report problems.