Home » AS3 »Class »Flash » Currently Reading:

Eventos click y doble click en un botón con Actionscript 3

junio 1, 2007 AS3, Class, Flash 4 Comments
Eventos click y doble click en un botón con Actionscript 3

En este post explicaré cómo detectar un doble click sobre un botón en flash con actionscript 3 gracias a la clase MouseEvent que nos permite detectar directamente el evento dobleclick.

El uso de la clase MouseEvent es muy simple, únicamente hemos de crear un listener que detecte el evento y ejecutar una acción.

  1. clip.doubleClickEnabled = true
  2. clip.addEventListener(MouseEvent.DOUBLE_CLICK, onDobleClick);
  3. function onDobleClick(event:MouseEvent)
  4. {
  5.    trace("doble click");
  6. }

Hemos de fijarnos en la propiedad doubleClickEnabled que es la que nos indica si la acción de doble click está activa o no. Por defecto la propiedad está con valor false, con lo que debemos pasarla a true en caso contrario el dobleclick no se ejecutaría.

Ahora explicaré cómo detectar si hemos hecho un click o un dobleclick sobre el mismo botón. Es decir, que si clicamos sobre el botón una vez ejecute una acción y si clicamos doble ejecute otra distinta.

Siguiendo lo explicado en este otro tip empezaremos el código creando la clase para nuestro botón. Crearemos la clase Boton.as

A este botón le añadiremos los eventos de click y double_click.

  1. package
  2. {
  3.    import flash.display.MovieClip;
  4.    import flash.events.MouseEvent;
  5.    //-----------------------------------------
  6.    public class Boton extends MovieClip
  7.    {
  8.       //-----------------------------------------
  9.       public function Boton()
  10.       {
  11.          doubleClickEnabled = true;
  12.          addEventListener(MouseEvent.CLICK, onClick);
  13.          addEventListener(MouseEvent.DOUBLE_CLICK, onDobleClick);
  14.       }
  15.       //-----------------------------------------
  16.       private function onClick(event:MouseEvent):void
  17.       {
  18.          trace("click");
  19.       }
  20.       private function onDobleClick(event:MouseEvent):void
  21.       {
  22.          trace("doble click");
  23.       }
  24.       //-----------------------------------------
  25.    }
  26. }

Si publicasemos ahora este botón veríamos el siguiente problema… al ejecutar el dobleclick tambien se ejecutaría el click normal, ya que los dos listeners son detectados. En el panel salida nos marcaría esto:

click
doble click

Esto no es lo que nos interesa, solo queremos que se ejecute una de las dos. Para solucionar el problema ampliaremos la clase siguiendo este proceso:

Crearemos una variable boleana donde indicaremos si hemos realizado un click o un dobleclick

  1. private var isDobleClick:Boolean;

El valor de la variable lo cambiaremos a través de las funciones de los eventos:

  1. private function onClick(event:MouseEvent):void
  2. {
  3.    isDobleClick = false;
  4. }
  5. private function onDobleClick(event:MouseEvent):void
  6. {
  7.    isDobleClick = true;
  8. }
  9.  
  10. Escribiremos una tercera función que ejecute las acciones según el valor de la variable.
  11.  
  12. private function controlaClick(event:TimerEvent):void
  13. {
  14.    if (isDobleClick == false) {
  15.       trace("click");
  16.    } else {
  17.       trace("doble click");
  18.    }
  19. }

Esta función controlaClick() la ejecutaremos desde la función onClick(), pero hemos de darle un margen de tiempo para detectar si hemos realizado un dobleclick, así que la ejecutaremos desde un intervalo. La función quedaría así:

  1. private function onClick(event:MouseEvent):void
  2. {
  3.    isDobleClick = false;
  4.    espera = new Timer(200, 1);
  5.    espera.addEventListener(TimerEvent.TIMER, controlaClick);
  6.    espera.start();
  7. }

Cómo añadido podemos hacer que si damos un solo click sobre el botón pulsando la tecla “Ctrl” se ejecuten las acciones de un dobleclick, para eso utilizaremos la propiedad ctrlKey del evento MouseEvent. Esta propiedad devuelve true o false según esté pulsada la tecla en el momento del click. (Esta propiedad también está para “shift” y “Alt”)

  1. if (event.ctrlKey) {
  2.    isDobleClick = true;
  3. }

La clase completa sería esta:

  1. package
  2. {
  3.    import flash.display.MovieClip;
  4.    import flash.events.MouseEvent;
  5.    import flash.utils.Timer;
  6.    import flash.events.TimerEvent;
  7.    //-----------------------------------------
  8.    public class Boton extends MovieClip
  9.    {
  10.       private var isDobleClick:Boolean;
  11.       private var espera:Timer;
  12.       //-----------------------------------------
  13.       public function Boton()
  14.       {
  15.          doubleClickEnabled = true;
  16.          addEventListener(MouseEvent.CLICK, onClick);
  17.          addEventListener(MouseEvent.DOUBLE_CLICK, onDobleClick);
  18.       }
  19.       //-----------------------------------------
  20.       private function onClick(event:MouseEvent):void
  21.       {
  22.          isDobleClick = false;
  23.          espera = new Timer(200, 1);
  24.          espera.addEventListener(TimerEvent.TIMER, controlaClick);
  25.          espera.start();
  26.          if (event.ctrlKey) {
  27.             isDobleClick = true;
  28.          }
  29.       }
  30.       private function onDobleClick(event:MouseEvent):void
  31.       {
  32.          isDobleClick = true;
  33.       }
  34.       private function controlaClick(event:TimerEvent):void
  35.       {
  36.          if (isDobleClick == false) {
  37.             trace("click");
  38.          } else {
  39.             trace("doble click");
  40.          }
  41.       }
  42.       //-----------------------------------------
  43.    }
  44. }

Compártelo:

Eventos click y doble click en un botón con Actionscript 3

Post relacinonados:

  1. Otener parámetros en eventos de Actionscript 3
  2. Comunicación entre clases Actionscript 3 con EventDispatcher
  3. onReleaseOutside, onDragOut, onDragOver en ActionScript 3
  4. Eventos de botón en AS3
  5. Botones con parámetros en Actionscript 3

YARPP
Visto 19.282 veces

Currently there are "4 comments" on this Article:

  1. blog.2grafic.com » Blog Archive » Click y Doble Clik en AS3 dice:
    30 noviembre, -0001 a las 12:00 am

    […] En el post publicado por codigo.as se explica cómo detectar un doble click sobre un botón en flash con actionscript 3 gracias a la clase MouseEvent que nos permite detectar directamente el evento dobleclick. […]

  2. fiestas infantiles dice:
    30 noviembre, -0001 a las 12:00 am

    gracias por el dato , intentare modificar mi script

  3. GersonM dice:
    9 julio, 2009 a las 6:09 am

    Realmente no parece haber otra solución, pero me parece que no deberia ser asi, eso les paso a los de adobe, por mas que pienso no se me ocurre un utilidad al detectar los dos listeners al mismo tiempo.

  4. elpapa dice:
    15 septiembre, 2010 a las 12:24 pm

    Todas las explicaciones estan muy buenas o que buenas excelentes
    lo que pasa es que soy muy lento…
    Me gustaria que me comentaran paso a paso como hago para meter comentarios a un boton por ej. bintroduccion, bsintaxis; que cuando abra mi pagina en flash cs3 me muetre la pagina inicial y cuando de clic en el boton bintroduccion ò en el boton bsintaxis me muetre su contenido (los he tratado de hacer pero no se donde meter y como los comentarios ni tampoco como programarlos).

    si es posible se lo agradeceria una cantidad…..

Comment on this Article:








Usuario registrado

Conectar con
Conectar con

Twitter: zguillez

AdvertisementAdvertisementAdvertisementAdvertisement

Recibe las novedades por email



Map

Ranking

Codigoactionscript.org: 4.65 sobre 5 (106 valoraciones)

twitter-widget.com