Já pensou em ter uma aplicação que possa corrigir erros ortográficos em alguns aplicativos, por exemplo, aplicações de edição de textos públicos, licitatórios, organizadores de documentos virtuais, edição de textos, em fim uma gama de aplicações são pertinentes ao assunto. E A Adobe tem há algum tempo uma biblioteca gratuita que você pode usar para adicionar essa funcionabilidade ao seu aplicativo.
A Squiggly, além de gratuita ela se baseia em dicionário público e open-source que é bastante utilizado nos navegadores Chrome, Firefox e a suite de office open-source Open-Office. Tem alguns bugs conhecidos, mais nada que lhe impeça de criar essa função em seu aplicativo.
E cá entre nós, praticamente 50% dos sistemas não tem um corretor ortográfico em campos como comentários adicionais, preenchimento de dados específicos como descrição de produtos, e acaba afetando, ou vai dizer que todo o texto que seu sistema controla é feito pelo Word?
Vamos lá fazer um exemplo.
Passo 1 – Criar um projeto
Passo 2 – Baixar o SWC do Squiggly.
Passo 3 – Adicionar o SWC’s do Squiggly no diretório lib de seu projeto. Os SWCs você vai encontrar direto na pasta libs do arquivo .zip que você baixou. Veja como ficou o meu abaixo.
Agora, o resto é fácil. Veja um exemplo abaixo que criei. Lembre-se estou usando o Flex 4.5, funciona com Flash, AIR 2.0+ e em projetos Actionscript 3.0 puro. No .zip que você baixar vai encontrar vários exemplos.
Publicador
<?xml version="1.0" encoding="utf-8"?> <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" minWidth="955" minHeight="600"> <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; s|Form s|FormItem { skinClass: ClassReference("spark.skins.spark.StackedFormItemSkin"); } s|Form s|FormHeading { skinClass: ClassReference("spark.skins.spark.StackedFormHeadingSkin"); } </fx:Style> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> <s:Form x="170" y="45" width="487" height="486"> <s:FormItem label="Título do post:" width="100%"> <s:TextInput id="campoTitulo" width="100%"/> </s:FormItem> <s:FormItem label="Post:" width="100%"> <s:TextArea id="campoCorpoTexto" width="100%" height="300"> </s:TextArea> </s:FormItem> <s:Button width="135" height="35" label="Publicar" fontWeight="bold"/> </s:Form> </s:Application> |
Ok, até ai tudo bem, o problema agora é o seguinte, por padrão o Squiggly trás apenas o idioma en_US, para o corretor, o que nos faz pesquisar no Google e tentar achar outros idiomas, já que é gratuito e eu mencionei OpenOffice, então facilmente eu consigo esse dicionário em pt_BR. Ah! achei.
Com o dicionário em mãos, eu vou criar a seguinte estrutura em meu projeto.
Veja que tem a estrutura en_US, pt_BR dentro da pasta dictionaries, essas pastas por padrão estão dentro do pacote que você baixou do squiggly. Você vai encontrar ela (en_US) dentro da pasta src.
Agora o que você precisa fazer é mapear essa nova biblioteca que você adicionou(pt_BR) ao AdobeSpellingConfig.xml que está no projeto, ele tem o atual código.
<?xml version="1.0" encoding='UTF-8'?> <spellingConfig> <languageResource language="English" languageCode="en_US" ruleFile="dictionaries/en_US/en_US.aff" dictionaryFile="dictionaries/en_US/en_US.dic"/> </spellingConfig> |
Troque por essa:
<?xml version="1.0" encoding='UTF-8'?> <spellingConfig> <languageResource language="English" languageCode="en_US" ruleFile="dictionaries/en_US/en_US.aff" dictionaryFile="dictionaries/en_US/en_US.dic"/> <languageResource language="Português Brasil" languageCode="pt_BR" ruleFile="dictionaries/pt_BR/pt_BR.aff" dictionaryFile="dictionaries/pt_BR/pt_BR.dic"/> </spellingConfig> |
Adicione quantos idiomas você quiser. Agora voltamos ao código de nossa aplicação.
Eu peguei o código e apliquei as dependências do Squiggly. Então, veja como ficou.
<?xml version="1.0" encoding="utf-8"?> <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" minWidth="955" minHeight="600" creationComplete="startMeuCorretor(event)"> <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; s|Form s|FormItem { skinClass: ClassReference("spark.skins.spark.StackedFormItemSkin"); } s|Form s|FormHeading { skinClass: ClassReference("spark.skins.spark.StackedFormHeadingSkin"); } </fx:Style> <fx:Script> <![CDATA[ import com.adobe.linguistics.spelling.SpellUI; import com.adobe.linguistics.spelling.framework.ResourceTable; import com.adobe.linguistics.spelling.framework.SpellingConfiguration; import mx.events.FlexEvent; protected function startMeuCorretor(event:FlexEvent):void { // TODO Auto-generated method stub var dicionarios:ResourceTable = new ResourceTable(); //opcional dicionarios.setResource("en_US", {rule:"dicionaries/en_US/en_US.aff", dict:"dicionaries/en_US/en_US.dic"}); dicionarios.setResource("pt_BR", {rule:"dicionaries/pt_BR/pt_BR.aff", dict:"dicionaries/pt_BR/pt_BR.dic"}); SpellingConfiguration.resourceTable = dicionarios; } ]]> </fx:Script> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> <s:Form x="170" y="45" width="487" height="486"> <s:FormItem label="Título do post:" width="100%"> <s:TextInput id="campoTitulo" width="100%" creationComplete="SpellUI.enableSpelling(campoTitulo, 'pt_BR');"/> </s:FormItem> <s:FormItem label="Post:" width="100%"> <s:TextArea id="campoCorpoTexto" width="100%" height="300" creationComplete="SpellUI.enableSpelling(campoCorpoTexto,'pt_BR')"> </s:TextArea> </s:FormItem> <s:Button width="135" height="35" label="Publicar" fontWeight="bold"/> </s:Form> </s:Application> |
Resultado final:
Com isso, basta publicar sua aplicação com todas as dependências de dicionários e arquivos e sua aplicação estará pronta para corrigir os assassinos de palavras portuguesas.
Aproveita, é simples, legal de implementar. Até o próximo post.