Adobe User Groups

Aplicaciones

Artículos

Concursos

Device Central

Home » Flash en Móviles

Marcando el Foco en textos de entrada bajo Flash Lite 2.x

Enviado por: Marcos Gonzalez Sancho en Jueves, 30 noviembre 20063 comentarios

Quítame ese focus!

En el ultimo desarrollo que hemos llevado a cabo en [Q] bajo Flash Lite 2, teníamos unos cuantos módulos que hacían un trabajo intenso con entradas de texto. Uno de los problemas más claros que nos encontramos es la nula representación del foco en estos elementos (ni un cursor de texto parpadeando, ni una ayuda visual que no sea el _focusrect que evidentemente se elimina en aplicaciones comerciales por cuestiones esteticas... XD ).

Si bien el componente que se ha expuesto en este blog soluciona en parte este problema, tiene algunas carencias que lo hacen poco práctico, como el hecho de perder la capacidad de la escritura intuitiva. (T9). Como queríamos conservar esa funcionalidad, hemos creado la siguiente clase (pobremente implementada... se adminten sugerencias) para poder destacar el foco en todos nuestros campos de texto de entrada sin tener que trabajar directamente sobre ninguno de ellos ni tener que conservar el foco por defecto de Flash.

La clase

Actionscript:
  1. class AutoFoco
  2. {
  3.     private var autoFocoTextos:Object;
  4.    
  5.     public function AutoFoco()
  6.     {
  7.     }
  8.    
  9.     public function activarControlFoco():Void
  10.     {
  11.         autoFocoTextos = new Object();
  12.         autoFocoTextos.ref = this;
  13.         autoFocoTextos.onSetFocus = function(oldFocus,newFocus)
  14.         {
  15.             if (oldFocus instanceof TextField)
  16.             {
  17.                 oldFocus.border = false;
  18.                 oldFocus.background = false;
  19.             }
  20.             if (newFocus instanceof TextField)
  21.             {
  22.                 newFocus.border = true;
  23.                 newFocus.background = true;
  24.                 newFocus.borderColor = 0xcc0000;
  25.                 newFocus.backgroundColor = 0xEEEEEE;
  26.             }
  27.         }
  28.         Selection.addListener(autoFocoTextos);
  29.     }
  30.    
  31.     public function desactivarControlFoco():Void
  32.     {
  33.         Selection.removeListener(autoFocoTextos);
  34.                 delete autoFocoTextos.onSetFocus;
  35.                 autoFocoTextos = null;
  36.     }
  37. }

La clase dispone de solo dos metodos, uno para activar su funcionamiento y otro para desactivarlo. Un ejemplo de su uso podria ser el siguiente:

Actionscript:
  1. _focusrect = false;
  2. var controler:AutoFoco = new AutoFoco();
  3. controler.activarControlFoco();
  4. Selection.setFocus(entrada_0);

Suponiendo que en el escenario tenemos 3 campos de entrada con nombres de instancia entrada_0, entrada_1 y entrada_2.

Esperamos que os sea de utilidad!

Compártenos:
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • LinkedIn
  • Meneame
  • Netvibes
  • RSS
  • Technorati
  • Twitter
  • Yahoo! Bookmarks

3 Comments »

  • Raul Jimenez dice:

    Está muy bien la clase, lo que quizá se podría mirar de hacer es pasarle un parámetro type que nos indicase si es un campo de texto o no y entonces añadirle un clip de un cursor parpadeando a la caja de texto, para así enseñarle al usuario que es una caja de texto input.

    Creo que sería bastante fácil de implementar además.

    Un saludo!

  • Freddie® dice:

    La idea de elecash no es mala, pero tiene el problema de que en algunos cells donde he probado (No han sido muchos, pero son mainstream) el sólo hecho de dejar una animación continua estatica corriendo en la pantalla ralentiza la entrada de datos a la aplicación.

    Estoy seguro que depende del modelo y la versión de Flash Lite, pero en “mis tiempos” era un problema recurrente la optimización de recursos en un lenguaje tan interpretado como Flash.

  • Marcos dice:

    También lo habia pensado pero efectivamente sería un aumento del uso de recursos de cpu. Haré alguna prueba y si sale algo curioso, posteare la mejora :)

Leave a comment!

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.