Error de selección de color en el componente RichTextEditor

Hoy andaba trabajando con el componente RichTextEditor de Flex y me encontré con un fallo del componente en relación a la selección del color desde el ColorPicker para una selección de texto. Este bug ya venía de Flex 3, y parece que en Flash Builder 4 sigue sin solucionarse.

El fallo consiste en que si desde el colorPicker introducimos directamente el código del color en el campo de texto al presionar la tecla ENTER para validar el color introducido, este ENTER nos introduce también un salto de línea dentro de la caja de texto del editor haciendo a su vez que el texto seleccionado desaparezca. Un error del componente bastante impresentable

Pero la solución es bastante fácil. Basta con hacer que el TextArea del componente no sea editable en el momento en el que abrimos el colorPicker, de manera de que el ENTER de validación del color no afectará al texto. Una vez cerrado el colorPicker volveremos a hacer editable el texto.

En cuanto al código, únicamente necesitaremos escuchar los eventos de apertura y cierre del colorPicker, y modificar la propiedad editable del TrextArea.

Podemos crearnos un componente propio que extienda del componente RichTextEditor implementando este código. Este sería el componente:

Código :

<?xml version="1.0" encoding="utf-8"?>
<mx:RichTextEditor xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               creationComplete="init()">
   <fx:Script>
      <![CDATA[
         import mx.events.DropdownEvent;
         private function init():void
         {
            this.colorPicker.addEventListener(DropdownEvent.OPEN, colorPickerOpen);
            this.colorPicker.addEventListener(DropdownEvent.CLOSE, colorPickerClose);
         }
         private function colorPickerOpen(event:Event):void
         {
            this.textArea.editable=false;
         }
         private function colorPickerClose(event:Event):void
         {
            this.textArea.editable=true;
         }
      ]]>
   </fx:Script>
</mx:RichTextEditor>

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.