Question

My Brain Is Going to Explode.. .

I have five images all named 0,1,2,3,4.

I have five buttons, btn1, btn2, btn3, btn4, btn5.
The buttons are laid out like:

• • • • •

when an image (lined to a button) is active it looks more like this

if image 1 is active:

• (•) • • •

A timer is running, at the end of 240 seconds, the image on the bottom of the display stack has its alpha set to 0. It is then placed on the top of the stack and its alpha is tweened in.

A user can bypass the timer and advance to whichever image he likes by clicking a button.

btn1 brings up image 0.
btn2 brings up image 1 and so on.

What happens if image 3 is showing and the user clicks btn2 is image 1 ends up at the top and the new stacking order is: 1,3,4,0,2.

Meaning now my images are out of order, (in terms of the button layout). and the highlighted buttons are no longer in order (or in the order the client wants the images to display).

how do I re-stack the images so that if I click btn 4, the images line up behind it correctly?

I know this isn’t a horribly difficult question, I’m just not in the mood to solve this little brain teaser, perhaps you are. Thanks!
-J

Answer 1

If I understand your problem, then something like this should work:

public function setSelected($index:Number) {
    var i:Number = 0;
    for (i = 0; i < $index) {
        addChild(images[i]);
    }
    for (i = $index + 1; i < images.length; i++) {
        addChild(images[i]);
    }
    addChild(images);
}

Where images is an array of your images and index is index number of the button you clicked on. So, 0 for btn1.