From a push button to a hold button in AS3

Even wonder how to create a hold button in Flash? A typical flash simple button is a push button. What it means is the button responds to mouse click once even when the button is clicked and hold at the down state. To have the button to continuously executing while the button is in the down state, the following AS3 script is required:

package
{
 import flash.display.SimpleButton;
 import flash.display.MovieClip;
 import flash.events.*;
 
 public class Test extends MovieClip
 {
  public function Test()
  {
   hold_btn.addEventListener(MouseEvent.MOUSE_DOWN, doDown);
   hold_btn.addEventListener(MouseEvent.MOUSE_UP, doUp);
  }
  public function doDown(e:MouseEvent):void{
   addEventListener(Event.ENTER_FRAME, doEnter);
  }
  public function doEnter(e:Event):void
  {
   trace (“I’m in the downstate.”);
  }
  function doUp(e:MouseEvent):void
  {
   removeEventListener(Event.ENTER_FRAME, doEnter);
  }
 }
}

Advertisements

~ by brianchau on March 3, 2008.

6 Responses to “From a push button to a hold button in AS3”

  1. It’s a little more complicated than that. You would also want to know when the mouse is released outside the button, and most probably if the mouse leaves the stage.

    package
    {

    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.MouseEvent;

    public class HoldButton extends Sprite
    {

    private var button : Sprite;

    public function HoldButton()
    {
    super();

    button = new Sprite();
    button.graphics.beginFill( 0xFF0000, 1 );
    button.graphics.drawRect( 0, 0, 50, 50 );
    button.graphics.endFill();

    button.addEventListener( MouseEvent.MOUSE_DOWN, onButtonMouseDown );

    addChild( button );
    }

    private function onButtonMouseDown( event:MouseEvent ):void
    {
    addStageListeners()
    }

    private function onStageMouseUp( event:MouseEvent ):void
    {
    removeStageListeners()
    }

    private function onStageMouseLeave( event:MouseEvent ):void
    {
    removeStageListeners()
    }

    private function onStageEnterFrame( event:Event ):void
    {
    trace( “onStageEnterFrame” );
    }

    private function addStageListeners():void
    {
    stage.addEventListener( MouseEvent.MOUSE_UP, onStageMouseUp );
    stage.addEventListener( Event.MOUSE_LEAVE, onStageMouseLeave );
    stage.addEventListener( Event.ENTER_FRAME, onStageEnterFrame );
    }

    private function removeStageListeners():void
    {
    stage.removeEventListener( MouseEvent.MOUSE_UP, onStageMouseUp );
    stage.removeEventListener( Event.MOUSE_LEAVE, onStageMouseLeave );
    stage.removeEventListener( Event.ENTER_FRAME, onStageEnterFrame );
    }
    }
    }

  2. Brian…this worked perfect for what I needed. Thanks!

  3. ok, I am not a programming pro or anything (the total oposite actually…) but I fiddled about with both your code snipits.

    first of all: Tink!? what are you dude?? a cyborg or something?
    I have the feeling you wrote that code without even having to look at flash/flex!!! that is absolutely genius! the code is like magic man! RESPECT.

    so I fiddled about a bit and came up with a slighly simpler solution to the release outside of button.
    I cant draw in code but the stage setup is self explanatory.
    one box with instance name “MoveME” one mc named “btnCONT”, containing two squares named “onMEL” and “onMER”(the buttons)

    so here it goes:

    //
    package {
    //you dont realy need all these classes
    //but I was fiddling with other stuff in the same file… sorry.
    import flash.display.MovieClip;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.events.KeyboardEvent;
    import flash.ui.Keyboard;

    public class ScrollTest300608 extends MovieClip {

    public function ScrollTest300608() {

    function moveleft(evtL:Event):void {
    MoveME.x -= 5;
    }
    function moveright(evtR:Event):void {
    MoveME.x += 5;
    }

    btnCONT.onMEL.addEventListener(MouseEvent.MOUSE_DOWN, onMELfunc);
    btnCONT.onMEL.addEventListener(MouseEvent.MOUSE_UP, onMELoff);

    btnCONT.onMER.addEventListener(MouseEvent.MOUSE_DOWN, onMERfunc);
    btnCONT.onMER.addEventListener(MouseEvent.MOUSE_UP, onMERoff);

    btnCONT.addEventListener(MouseEvent.MOUSE_OVER, onOver);
    btnCONT.addEventListener(MouseEvent.MOUSE_OUT, onOut);

    function onOver(evt:MouseEvent):void {
    evt.target.alpha = 0.2;
    }
    function onOut(evt:MouseEvent):void {
    evt.target.alpha = 1;
    removeEventListener(Event.ENTER_FRAME, moveright);
    removeEventListener(Event.ENTER_FRAME, moveleft);
    }

    function onMELfunc(el:MouseEvent):void {
    addEventListener(Event.ENTER_FRAME, moveleft);
    }

    function onMERfunc(er:MouseEvent):void {
    addEventListener(Event.ENTER_FRAME, moveright);
    }

    function onMELoff(elo:MouseEvent):void {
    removeEventListener(Event.ENTER_FRAME, moveleft);

    }

    function onMERoff(ero:MouseEvent):void {
    removeEventListener(Event.ENTER_FRAME, moveright);
    }

    }
    }
    }

    • Lexic13 You are a GENIUS the other two codes didnt work for me but with yours after a few bits of editing ( Instances And Stuff ) IT WORKED i Owe you big TIME thanks so Much
      Developer Tom
      ————-
      Visit my Website “www.torkstudios.co.cc”

  4. ups! I accidentally hit submit…

    so yes, because I’m a total noob, obviously I would apreciate any comments any one may have…

    cheers to you guys though cos I was trying to work this one out on my own but was not getting anywhere untill I passed by here…

    laterz,

    Lexic13

  5. there is a better et simpler way :
    set the autoRepeat property of the Button to ‘true’ and use the mouseDownEvent instead of the clickEvent

    http://blog.flexexamples.com/2007/08/08/making-auto-repeat-button-controls-using-the-autorepeat-property-and-buttondown-event/

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: