rows and colums

[bluntmonk40]

Does anyone have a sure fire way of dynamically creating rows and columns of buttons. Here is the situation, I have an .fla which represents a screen in an application. This screen has a variable called maxButton. Say, for example, on the screen "Home" I have 11 buttons. I want 3 colums with each colum consisting of, if possible the same number of buttons. Or, two of the columns with the same number of buttons and the odd column with the remaining.
Does this make sense?

Please, all help is most appreciated.

Thank you

[jbum]

This code example uses duplicateMovieClip to make rows and columns of buttons, from a single offscreen button, named 'myButton'.

code:

---

maxButtons = 11;

nbrColumns = 3;

leftMargin = 10;

topMargin = 50;

cellWidth = 150;

cellHeight = 50;



for (var i = 0; i < maxButtons; ++i)

{

	duplicateMovieClip(myButton, "button_"+i,i+1);

	var mc = eval("button_" + i);

	var cellX = i % nbrColumns;

	var cellY = Math.floor(i / nbrColumns);

	mc._x = leftMargin + cellX * cellWidth;

	mc._y = topMargin + cellY * cellHeight;

}

---

The lines of most interest are these two, which generate cell coordinates, from the single looping i variable.

var cellX = i % nbrColumns;
var cellY = Math.floor(i / nbrColumns);

We use the mod (%) operator to create a cycling X (column) variable that goes 0,1,2, 0,1,2, 0,1,2 etc.

Then we use integer division to determine the y (row) number.

Once you've determined the cell coordinates (x and y) then you can manipulate those to position your buttons into a grid formation, using cellWidth, cellHeight and the left and top margin values.

[bluntmonk40]

Say for example I want to place, dynamically, those 11 buttons, which I have done using your suggestion, now I want to dynamically assign those eleven buttons unique names. How can I do that? I have tried to do so using a case select scenario. I haven't yet gotten it to work.
This is what I have tried.
//this variable will ultimately come from from the xml document
title = "Agricultural Equipment";
//this variable will ultimately come from from the xml document
maxButtons = 11;
nbrColumns = 3;
leftMargin = Stage.width/5;
topMargin = Stage.height/4;
space = 12;
cellWidth = 286.9+space;
cellHeight = 89+space;
trace(Stage.width);
bsntext = "";
b.text = "";
for (i=0; i<maxButtons; ++i) {
attachMovie("MenuItemButton", 'MenuItemButton'+i, i);
MenuItemButton[i].buttonshortname.text = bsntext;
MenuItemButton[i].buttontext.text = btext;
loadMovie("thumbs/AG/agmanagementsolutions.jpg", MenuItemButton0.icon);
var mc = eval("MenuItemButton"+i);
var cellX = i%nbrColumns;
var cellY = Math.floor(i/nbrColumns);
mc._x = leftMargin+cellX*cellWidth;
mc._y = topMargin+cellY*cellHeight;
eval('MenuItemButton'+i).onPress = function() {
trace("this is mc"+this);
this.gotoAndStop(2);
this.onRelease = function() {
this.gotoAndStop(1);
};
var i = i;
switch (i) {
case 0 :
bsntext = "Ag Management Solutions";
break;
case 1 :
bsntext = "Cotton Harvesting";
break;
default :
bsntext = "testing 1 2 3";
}
trace("this is i"+i);
};
}

Thank you in advance for your expertise.

[jbum]

This type of thing (from your code):

var i = i;
switch (i) {
case 0 :
bsntext = "Ag Management Solutions";
break;
case 1 :
bsntext = "Cotton Harvesting";
break;
default :
bsntext = "testing 1 2 3";
}

Is a good example of something that can be done more simply using an array. For example:

code:

---

buttonText = ["Ag Management Solutions","Cotton Harvesting","etc..."];



bsntext = buttonText[i];

---

The next problem is how do you assign the text to each button? If each button contains a text field called "label_txt" you could do something like:

mc.label_txt.text = buttonText[i];

While you're setting up all the other stuff in the grid-making loop. If your button doesn't already have a text field, add one, and make sure you know what it's name is (give it a name, if you haven't).