Making boxes appear 1 by 1

programming flash
1

I was wondering how to duplicate boxes, so they appear in a tiled format (this question was asked before but dind’t get much response :-).

I don’t have much clue at the moment apart from having 2 ‘for’ loops which will assign the boxes their own positions; however this doesn’t make the boxes appear one by one :-\

I’m just looking for the concept, don’t really want the code just yet. thx!

2

Voetsjoeba’s written a tute on it… i dont know if it’s up yet :slight_smile:

3

Nope … first sen’s 12 page 3d tutorial is getting added. It’s pretty cool, I had a preview and I can tell you, sen is a genious !

4

*Originally posted by Voetsjoeba *
**I can tell you, sen is a genious ! **
well DUHH! :stuck_out_tongue:

5

In the most unlikely case someone didn’t know yet :stuck_out_tongue:

6

I’ll be waiting voets :stuck_out_tongue: can i have a little peak into the concept in the meantime though :stuck_out_tongue:

7

Hmmn … no.

[size=1]Psst … http://voetsjoeba.asianillusion.com/tutorials/fadegrid.htm[/size] :wink:

8

ooooh i get it now!!! i thought about the ‘for’ statements, but i thought they would calculate so fast you wouldn’t see them duplicating. Now i understand they actually fade INTO the picture!! thanks you :slight_smile: Now time to try creating the code on my own :stuck_out_tongue:

EDIT: oh btw i’m that kirupa forum member eh :stuck_out_tongue:

9

*Originally posted by blah-de-blah *
ooooh i get it now!!! i thought about the ‘for’ statements, but i thought they would calculate so fast you wouldn’t see them duplicating. Now i understand they actually fade INTO the picture!! thanks you :slight_smile: Now time to try creating the code on my own :stuck_out_tongue:

What it does is create a grid of boxes and fade those out, but they are duplicated so fast you can’t see them duplicating indeed. The effect you see is the fading out, not the duplicating.

*Originally posted by blah-de-blah *
**EDIT: oh btw i’m that kirupa forum member eh :stuck_out_tongue: **

Yep :).

10

or you could do something like this:
[AS]MovieClip.prototype.drawGrid = function() {
//parameters of grid
grid = {maxx:10, maxy:10, spacing:myMC.width};
placeMC = function () {
(x<grid.maxx && y<=grid.maxy ? x++ : y<grid.maxy ? x=1 : grid.maxx);
y<grid.maxy && x == 1 ? y++ : x != grid.maxx ? y : 1;
myMC.duplicateMovieClip(“myMC”+x+""+y, ++d);
root[“myMC”+x+""+y]._x = xgrid.spacing;
root[“myMC”+x+""+y]._y = ygrid.spacing;
// add any extra stuff here ie:
// root[“myMC”+x+""+y].fade(5,2)
// a function to make the squares fade
updateAfterEvent();
};
//set the speed at which grid is drawn
setInterval(placeMC, 100);
};
drawGrid();[/AS]

-zylum

11

Wow that code is much more complicated than voets, but i’ll definately check it out, thanks a lot!! :thumb:

Just a quick question if you don’t mind :stuck_out_tongue: what does the “:” do? i’m surprised i’ve never actually come across these :-\ I know the if…else purpose of them, but in this case:

{maxx:10, maxy:10, spacing:myMC._width};

they are used for something else right?

12

grid = {maxx:10, maxy:10, spacing:myMC._width};

is equivelant to:

grid.maxx = 10
grid.maxy = 10
grid.spacing = myMC._width

hope that explains your question

13

Yep thanks i get it now. I was thinkin it would be somethin like that :stuck_out_tongue:

14

*Originally posted by zylum *
**grid = {maxx:10, maxy:10, spacing:myMC._width};

is equivelant to:

grid.maxx = 10
grid.maxy = 10
grid.spacing = myMC._width**
Actually thats wrong. :sigh:[AS]grid = {maxx:10, maxy:10, spacing:myMC._width};[/AS]is equivalent to:[AS]grid = new Object();
grid.maxx = 10
grid.maxy = 10
grid.spacing = myMC._width[/AS]

15

ooh…i see…this is taking my actionscript to a new level then…never messed with new Object or anything before :stuck_out_tongue: i’ll try it out thanks!

16

Oh yea, just another quick question :stuck_out_tongue: why use a prototype for the draw grid function and a normal function for the other?!

EDIT: ok i don’t know if this is bothering you, but some of this code is bothering me :-\ I have noc lue why this code:

[AS]
(x<grid.maxx && y<=grid.maxy ? x++ : y<grid.maxy ? x=1 : grid.maxx);
y<grid.maxy && x == 1 ? y++ : x != grid.maxx ? y : 1;
[/AS]

one part is in brackets and the otehr isn’t :-\ oh yea and the updateAfterEvent(), does that check to see if the x values or y values have changed? tthanks again

17

oh, sorry, there don’t need to be brackets there… i was optimizing the code and i guess i forgot to take them out there…

as for the prototype thing… i used a prototype because im just used to using them a lot but you really don’t need it… you could do something like this…

grid = {maxx:10, maxy:10, speed:100};
placeMC = function() {
	x<grid.maxx && y<=grid.maxy ? x++ : y<grid.maxy ? x=1 : grid.maxx;
	y<grid.maxy && x == 1 ? y++ : x != grid.maxx ? y : 1;
	_root.attachMovie("myMCID", "myMC"+x+"_"+y, ++d);
	_root["myMC"+x+"_"+y]._x = x*_root["myMC"+x+"_"+y]._width;
	_root["myMC"+x+"_"+y]._y = y*_root["myMC"+x+"_"+y]._height;
	updateAfterEvent();
};
setInterval(placeMC, grid.speed);

notice that i call the function using setInterval and now instead of duplicateMC i use attachMovie…

as for update afterEvent, that just updates the screen independant of the frame rate so since the function is called every grid.speed (100 milliseconds) then the screen will be updated that many times per second. otherwise if the function is called more times than frames go by then and you didnt have updateAfterEvent then the squares would apear in bunches…

try this script to see what i mean:

grid = {maxx:10, maxy:10, speed:50};
placeMC = function() {
	x<grid.maxx && y<=grid.maxy ? x++ : y<grid.maxy ? x=1 : grid.maxx;
	y<grid.maxy && x == 1 ? y++ : x != grid.maxx ? y : 1;
	_root.attachMovie("myMCID", "myMC"+x+"_"+y, ++d);
	_root["myMC"+x+"_"+y]._x = x*_root["myMC"+x+"_"+y]._width;
	_root["myMC"+x+"_"+y]._y = y*_root["myMC"+x+"_"+y]._height;
	//updateAfterEvent();
};
setInterval(placeMC, grid.speed);
18

ok thanks zylum those clear things up now…But just two m ore questions hope you don’t mind :stuck_out_tongue:

Why change attachMovie to duplicateMovieClip? because when i use attachMovie, how do i target where i want the first box to start? i’ve tried making a new movieclip and doing:

_root.newMC.attachMovie…

But that stops the whole process altogther :-\ Do you know whY? if not ii’ll just use the first code you gave me and see if i can undesrtand that…thanks!

19

Oh and i’m trying to make these 2 lines:

[AS]
x<grid.maxx && y<=grid.maxy ? x++ : y<grid.maxy ? x=1 : grid.maxx;
y<grid.maxy && x == 1 ? y++ : x != grid.maxx ? y : 1;
[/AS]

the long way so i can understand em more easily :stuck_out_tongue: This is what i have but for some reason it doesntt work correctly :-\

[AS]
if (x<grid.maxx && y<=grid.maxy) {
x++;
} else if (y<grid.maxy) {
x = 1;
} else {
grid.maxx;
}
if (y<grid.maxy && x == 1) {
y++;
} else if (x != grid.maxx) {
y = 1;
}
[/AS]

thanks and sorry for all the questions :slight_smile:

20

sorry if i’m confusing you :slight_smile: i went over the script again and found a lot of things that needed improvements:trout: here’s the final draft (i hope)

grid = {maxx:10, maxy:10, startx:100, starty:100, speed:50};
placeMC = function () {
	if (x<grid.maxx || y<grid.maxy) {
		x = x<grid.maxx && y<=grid.maxy ? x+1 : 1;
		y = y<grid.maxy && x == 1 ? y+1 : y;
		_root.attachMovie("myMCID", "myMC"+x+"_"+y, ++d);
		_root["myMC"+x+"_"+y]._x = x*_root["myMC"+x+"_"+y]._width+grid.startx;
		_root["myMC"+x+"_"+y]._y = y*_root["myMC"+x+"_"+y]._height+grid.starty;
		updateAfterEvent();
		// trace(x+"_"+y); (for debugging)
	}
};
setInterval(placeMC, grid.speed);

first, notice i added an if statement at the beginning of the function, this prevents the ‘myMC’ from being duplicated or in this case attached unnecessarily after the final grid has been finished. without it, the function would keep being called and the myMC would be duplicated after the grid has been finished. also i refined the two beginning if statements(i don’t know what i was on when i did that code) and now they are much simpler (i hope)

i have chosen to use attachMovie instead of duplicate movie so that i would have the ‘master’ MC floating around on stage, instead it’s in the library.

if you want to generate the grid in a new MC called newMC then you would use the following script :

grid = {maxx:10, maxy:10, startx:100, starty:100, speed:50};
placeMC = function () {
	if (x<grid.maxx || y<grid.maxy) {
		x = x<grid.maxx && y<=grid.maxy ? x+1 : 1;
		y = y<grid.maxy && x == 1 ? y+1 : y;
		_root.newMC.attachMovie("myMCID", "myMC"+x+"_"+y, ++d);
		_root.newMC["myMC"+x+"_"+y]._x = x*_root.newMC["myMC"+x+"_"+y]._width+grid.startx;
		_root.newMC["myMC"+x+"_"+y]._y = y*_root.newMC["myMC"+x+"_"+y]._height+grid.starty;
		updateAfterEvent();
		// trace(x+"_"+y); (for debugging)
	}
};
setInterval(placeMC, grid.speed);

notice how the x and y values are given, you have to use "_root.newMC[…]._x’ to assign the value instead of just _root.

finally to answer your question about positioning. Just add two extra variables to the object to specify the startX and startY of the grid and then when assigning the x and y to the grid, just add “+ startx” and “+ starty” (check first script as reference)

well ihope that answers all your questions. if you have any more then just hit me with them:trout: :stuck_out_tongue:

-zylum