objectbuttonmovestage

Move object with buttons on stage in As3


I am trying to achieve this in As3 http://flashexplained.com/actionscript/moving-and-rotating-a-movie-clip-with-button-symbols-via-actionscript/. Even though it is very simple there is no known tutorial in actionscript 3. I only need left and right movement. Please do not refer me to tutorials about arrow keyboard keys. Thanks!


Solution

  • Realize that in As2, this sort of project was much more simple than in As3. The coding we need to do is much more advanced.

    Like in your As2 tutorial, make your buttons and rocket, then label them accordingly.

    Now, let's start here. Open up your actions window, and type this in.

    addEventListener(Event.ENTER_FRAME,onFrame)
    
    function onFrame(e:Event):void {
        //we'll get to this later
    }
    

    Uh oh, this is looks scary. That's ok. This is essentially the as3 replacement of .onEnterFrame. What we say here, is when this happens (ENTER_FRAME) we want to fire this function (onFrame). This explanation is overly simplified, but it serves our purposes.

    Great, so we have a function that is being fired every time we enter a new frame!

    Ok, now we need some variables to tell us if the buttons are being pressed.

    var leftIsPressed:Boolean = false
    var rightIsPressed:Boolean = false
    

    But they're kinda... just there. Stagnant. We need to make a function to change them for us.

    moveLeft.addEventListener(MouseEvent.MOUSE_DOWN,leftPressed)
    moveRight.addEventListener(MouseEvent.MOUSE_DOWN,rightPressed)
    
    function leftPressed(e:MouseEvent):void {
        leftIsPressed = true
    }
    
    function rightPressed(e:MouseEvent):void {
        rightIsPressed = true
    }
    

    Here we say, "moveLeft, wait until the mouse is pressed on you, then fire this function(leftPressed)." Then, in leftPress, we change the variable telling us if the button is pressed from false to true.

    But what happens when we release the mouse? Absolutely nothing. leftPressed will remain true, and our poor little rocket will go shooting off indefinitely into space! Let's fix that.

    stage.addEventListener(MouseEvent.MOUSE_UP,mouseReleased)
    
    function mouseReleased(e:MouseEvent):void {
        leftIsPressed = false
        rightIsPressed = false
    }
    

    Notice that we are telling the stage to wait for the mouse to be released over it, not the buttons. If we were to tell the buttons to wait for the mouse to go up, then we would only change the variables to false if the mouse was currently over the button at the time of release! Thus, we tell the stage to fire the event when the mouse is released over any part of the stage.

    Sweet, so now at any time, we know if the buttons are being pressed by accessing leftIsPressed and rightIsPressed!

    Let's go back to our onFrame function.

    function onFrame(e:Event):void {
        if (leftIsPressed) {
            rocket.x -= 5
        }
        if (rightIsPressed) {
            rocket.x += 5
        }
    }
    

    This function will be fired every frame. So, if one of our variables is true, the rocket will move in that direction! We're done! Press ctrl+enter and watch the little rocket move!

    Just to make things easy, I've organized our code in a more orthodox way. Good luck!

    FINAL CODE

    var leftIsPressed:Boolean = false
    var rightIsPressed:Boolean = false
    
    addEventListener(Event.ENTER_FRAME,onFrame)
    moveLeft.addEventListener(MouseEvent.MOUSE_DOWN,leftPressed)
    moveRight.addEventListener(MouseEvent.MOUSE_DOWN,rightPressed)
    stage.addEventListener(MouseEvent.MOUSE_UP,mouseReleased)
    
    function onFrame(e:Event):void {
        if (leftIsPressed) {
            rocket.x -= 5
        }
        if (rightIsPressed) {
            rocket.x += 5
        }
    }
    
    function leftPressed(e:MouseEvent):void {
        leftIsPressed = true
    }
    
    function rightPressed(e:MouseEvent):void {
        rightIsPressed = true
    }
    
    function mouseReleased(e:MouseEvent):void {
        leftIsPressed = false
        rightIsPressed = false
    }