Scenes vs Stages in Actionscript 3

Question

I have a program I'm putting together in FlashDevelop that will have several different windows, with buttons on the side of each window that allow the user to go from one window to the next. The windows will not be open at the same time- essentially the background just needs to be redrawn and features added or deleted. The buttons on the side of the windows will be the same.

Right now things work just fine, except that the bitmaps are being drawn from the top left corner of the button as opposed to the top left corner of the window. I asked this question a month ago and got an answer related to scenes. I've been busy and haven't had much time to work with this, but that does not seem to work. If I understand correctly, scenes are just different portions of the timeline. I am not using Flash, otherwise this would be simple- goToAndPlay.

What am I missing here? Should I be using the Stage or Document class? Code is below, at this point I'm just drawing a black rectangle but things work the same when I do bitmaps:

From Main:

songbutton = new SongButton;
addChild(songbutton);
songbutton.x = 680;
songbutton.y = 100;

From SongButton:

public class SongButton extends MusicPlay
{   
        public var songsYellow:Loader;
        public var songsWhite:Loader;
        public function SongButton(): void
        {
            songsYellow = new Loader();
            songsYellow.load(new URLRequest("images/SongsYellow.jpg"));
            songsWhite = new Loader();
            songsWhite.load(new URLRequest("images/SongsWhite.jpg"));
            addChild(songsWhite);
            addEventListener(MouseEvent.MOUSE_OVER, mouseOver);
            addEventListener(MouseEvent.MOUSE_OUT, mouseOut);
            addEventListener(MouseEvent.MOUSE_UP, mouseUp);
        }

        private function mouseOver(e:MouseEvent):void {
            addChild(songsYellow);
        }
        private function mouseOut(e:MouseEvent):void {
            addChild(songsWhite);
        }
        private function mouseUp(e:MouseEvent):void {
            SetMusicScreen();
        }
}

From MusicPlay:

public function SetMusicScreen():void 
{
    graphics.beginFill(0x0);
    graphics.drawRect(0, 0, 800, 550);
    graphics.endFill();
}

Answer 1

OK, I found a way to do this. Might not be the best way, but it turns out that I can put an addEventListener(MouseEvent.MOUSE_UP, gottaMouseUp) in the calling class, add a public variable in the button class that lets me know if the correct button has been clicked, and use that in the calling class to decide which button was clicked. I knew it was something simple like that....

Answer 2

In Flash at least, you can have Flash draw directly on the stage via stage.graphics.beginFill(0x0);

If, for whatever reason, that's outside of scope, you should also be able to get to the parent of the MovieClip via MovieClip(parent).graphics.beginfill(0x0); To get to further parents beyond that, you can "step back" with MovieClip(parent.parent), MovieClip(parent.parent.parent), and so on.

Whether this applies to FlashDevelop, I don't know. I'd think it would, since it is based in ActionScript 3.

Answer 3

except that the bitmaps are being drawn from the top left corner of the button

Because you are using Graphics object of the button

public function SetMusicScreen():void 
{
    graphics.beginFill(0x0);
    graphics.drawRect(0, 0, 800, 550);
    graphics.endFill();
}

SetMusicScreen is method of your button, and graphics is also related to the button. You should change logic of SetMusicScreen method, It should reference correct Graphics object. For example, such method will change background color of your application:

function SetMusicScreen():void {
    //This will change background color of document class
    var myRoot: Sprite = Sprite(root);

    myRoot.graphics.clear();
    myRoot.graphics.beginFill(0);
    myRoot.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight); //x,y, width, height
}

You could place window sprite object, that will change colors, or you can in SetMusicScreen, offset drawing along X axis, so background under buttons on the left site don't change.