How to give dynamically created buttons actions for each one - part 2

Question

Hi again fellow Flashers :)

My first question poised here at StackOverFlow dealt with this issue, I had an array which created a few different buttons. However I didn't know how to assign actions to them: How to give dynamically created buttons actions for each one - part 1

Thanks to Joel Hooks, I was able to get my code working. However this time around instead of using an imported graphic as a Class from my library, I'm instead creating a movieClip by drawing a gradient*(didn't need to import a jpg)*. Now I'm getting another dreaded "not compile time constant" error again. I believe it has something to do with how I'm trying to determine the button instance that is clicked or rolledOver.

The Previous button creation (working) code:

for (var i:Number=0; i < myXMLArray.length; i++) { navButton=new NavButton ; navButton.name="button" + i; navButton.x=i * navSIZE; navButton.y=navBtnY; navButton.buttonMode=true; thumbsMov.addChild(navButton);

buttons.push(navButton); buttons[i].addEventListener(MouseEvent.MOUSE_UP,handleButtonClick); buttons[i].addEventListener(MouseEvent.ROLL_OVER,handleButtonOver); buttons[i].addEventListener(MouseEvent.ROLL_OUT,handleButtonOff); }

The Previous listener (working) code:

function handleButtonOver(event:MouseEvent):void {

var button:NavButton = event.target as NavButton; var id:Number = Number(button.name.split("button")[1]); if(button) TweenLite.to(buttonRolls[id], .4, {alpha:1, ease:Strong.easeOut}); cataText[id].defaultTextFormat = a12Green; cataText[id].text = myXMLArray[id].id; }

Current button creation code:

for (var i:Number = 0; i < num; i++) {
trace("loop number = "+i);

var blueGradient:MovieClip = new MovieClip();
 blueGradient.name = "button" +i;
 blueGradient.graphics.beginGradientFill(bGrad, bColors, bAlphas, bRatios ,bMatrix)
 blueGradient.graphics.drawRect(0, 0, 266, 40);
 blueGradient.x = i * navSIZE;
 blueGradient.y = navBtnY;
 blueGradient.buttonMode = true;
addChild(blueGradient);

buttons.push(blueGradient)

buttons[i].addEventListener(MouseEvent.MOUSE_UP, handleButtonClick);
buttons[i].addEventListener(MouseEvent.ROLL_OVER, handleButtonOver);
buttons[i].addEventListener(MouseEvent.ROLL_OUT, handleButtonOff);

}

Current button listener code:

function handleButtonOver(event:MouseEvent):void {
var button:blueGradient = event.target as blueGradient;
var id:Number = Number(blueGradient.name.split("button")[1]);
if(blueGradient)
 cataText[id].defaultTextFormat = navFontRoll;
 cataText[id].text = myArray[id].id;

}

The current movie will only run without an error if the following line is commented out:

var button:blueGradient = event.target as blueGradient;

Because that is what is causing the not compile time constant error to come up. However by removing that line, all buttons are button1 instead of 2 buttons dynamically created named button0 and button1.

Any help or pointers here would be greatly appreciated! Thanks in advance for taking a look at my code.

Answer 1

I think, since the as keyword is for casting, you want this line instead:

var button:MovieClip = event.target as MovieClip;

blueGradient seems to be a variable name, not a class name.

Answer 2

Your problem is that you're confusing the blueGradient Class with the button object. In the original handler, your code says:

var button:NavButton = event.target as NavButton;
var id:Number = Number(button.name.split("button")[1]);
if(button)....

But in your new code,

var button:blueGradient = event.target as blueGradient;
var id:Number = Number(blueGradient.name.split("button")[1]);
if(blueGradient)

Do you see the difference? In both cases you're referring to your button object as "var button" - but then in the new version you write "blueGradient.name.split..." instead of "button.name.split..." and the same for your if() statement.

The var keyword defines the name of an object. The syntax is var [objectName]:[objectType], and when you work with that object you'll always want to refer to it by its name rather than by its type. Unless you've got a static class with a static method, but that's a bit more advanced.

So, in short: replace "blueGradient" with "button" in those two places in your new handler and it should clear up your problems. I hope that helped!