Sweet idea, here’s some bitmap action added into the mix. (In hindsight, I probably should’ve inherited your Tile class instead of changing it).
All you have to do in the .fla is change this line:
var Scene:Tile = new Tile(text_arr,"block",10 ,_root,true);
to this line:
var Scene:BitmapTile = new BitmapTile(text_arr,"block",10 ,_root,true, "pic");
Where “pic” references a picture in the library.
would be cool if you could use a black and white image as like the array mask for it. So like you could draw up your little logo on a 20,20 jpeg or somtin. The put that into flash and it could read the black pixels and make them 1 in the the array and white pixels would be 0’s. Dunno just an idea, would save having to do the whole creating a new array everytime you wanted to change it.
There was a small bug in my code before - it inserted an extra comma at the end of the last second level array. A small tweak to the AS gets rid of it.
[AS]w = 15;
h = 5;
w_txt.onChanged = createPixels;
h_txt.onChanged = createPixels;
createPixels();
function createPixels() {
_root.createEmptyMovieClip(“eraser”, 1);
_root.createEmptyMovieClip(“grid”, 1);
k = 0;
for (j=0; j<h; j++) {
for (i=0; i<w; i++) {
k++;
clip = _root.grid.attachMovie(“pixel”, “pixel”+k, k, {_x:i10, _y:j10});
clip.onRelease = function() {
this.play();
};
}
}
}
function createArray() {
pixelArray = new Array();
for (i=1; i<=wh; i++) {
if (_root.grid[“pixel”+i]._currentframe == 1) {
pixelArray.push(0);
} else {
pixelArray.push(1);
}
}
trace(“text_arr = [”);
pixelString = pixelArray.join(", “);
for (i=0; i<h; i++) {
if (i == h-1) {
trace(”["+pixelString.substr(iw3, (w3)-2)+"]");
} else {
trace("["+pixelString.substr(iw3, (w*3)-2)+"],");
}
}
trace("];");
}[/AS]
With my addition up above, you could just plop in your jpeg and set the entire array as 1’s to get the result you’re asking for.
thanks for that bitmap thing its awsome.
i have no idfea how to work with bitmap class so maybe ill learn by reading yours.
thanks
It’s pretty simple once you understand the copyPixels() method requires parameters from the Rectangle class and the Point class. Rectangle is just a way to store and _x,_y , width, and height, while Point just stores _x, _y.
rmo518, could you make it so it adds pixles on the drag in as well as the on click, I think that would make it a little easier to doodle. I know we can add it since you posted your source, but in future versions if you were thinking of continuing this I think that would be cool! Nice work!
that too, i don’t know the rectangle class or point class or any of the new stuff in flash 8. ill learn though.
Yeah, that’s a good idea. Let me see what I can come up with.
I’ve added a pen and an eraser tool that should let you press and drag to add/remove pixels (as cr125rider suggested).
The AS depends on the tools movieclip that has the pencil and eraser buttons in it (check out the FLA to see how that works).
[AS]w = 15;
h = 5;
w_txt.onChanged = createPixels;
h_txt.onChanged = createPixels;
createPixels();
_root.onMouseDown = function() {
pen = setInterval(pressAndDrag, 10);
};
_root.onMouseUp = function() {
clearInterval(pen);
};
function pressAndDrag() {
if (_root._xmouse<=w10 && _root._ymouse<=h10 && _root._xmouse>0 && _root._ymouse>0) {
pixID = Math.ceil(_root._xmouse/10)+(Math.floor(_root._ymouse/10)w);
if (_root.tool == “pencil”) {
_root.grid[“pixel”+pixID].gotoAndStop(2);
} else {
_root.grid[“pixel”+pixID].gotoAndStop(1);
}
}
}
function createPixels() {
_root.createEmptyMovieClip(“eraser”, 1);
_root.createEmptyMovieClip(“grid”, 1);
k = 0;
for (j=0; j<h; j++) {
for (i=0; i<w; i++) {
k++;
clip = _root.grid.attachMovie(“pixel”, “pixel”+k, k, {_x:i10, _y:j10});
}
}
}
function createArray() {
pixelArray = new Array();
for (i=1; i<=wh; i++) {
if (_root.grid[“pixel”+i]._currentframe == 1) {
pixelArray.push(0);
} else {
pixelArray.push(1);
}
}
trace(“text_arr = [”);
pixelString = pixelArray.join(", “);
for (i=0; i<h; i++) {
if (i == h-1) {
trace(”["+pixelString.substr(iw3, (w3)-2)+"]");
} else {
trace("["+pixelString.substr(iw3, (w3)-2)+"],");
}
}
trace("];");
}[/AS]
Do you have any experience with JSFL?
No, I don’t. (I actually had to look it up when I saw your question.) I’m still working in Flash MX. It looks like that was introduced in MX 2004.
Why do you ask?
It would allow you to make the tool built-in to the Flash authoring environment. Meaning you wouldn’t have to publish a swf, then copy and paste from the output. You could just use it as one of the tools inside Flash (or so I understand, someone correct me if I’m wrong).
Mind if I give it a try? I didn’t want to step on your feet. I haven’t messed with it at all, but this looks like a good reason to try it out.
I wouldn’t mind at all, I’d love to see something like that - it sounds much less clumsy than what I’m doing here.
[SIZE=4][FONT=Comic Sans MS][COLOR=#680aac][COLOR=#680aac]
If you want it to show in the movie, just make a dynamic text box, that refers to “_root.textBox”, or something, and replace the first trace statement with ’ textBox = “text_arr = [” ', and the subsequent ones with ’ textBox += whatever '. That should work. I haven’t actually tried it.[/COLOR]
[/COLOR][/FONT][/SIZE]
That’s great. I was trying to think of a way to do that and it didn’t occur to me to use += to tack on each line as it’s written. I set the text box up to render as HTML so I could throw in some <br> tags and keep it in a similar format to the original example. Thanks for the idea.
The modified code:
[AS] _root.textBox = “text_arr = [<br>”;
pixelString = pixelArray.join(“, “);
for (i=0; i<h; i++) {
if (i == h-1) {
_root.textBox += “[”+pixelString.substr(iw3, (w3)-2)+“]<br>”;
} else {
_root.textBox += “[”+pixelString.substr(iw3, (w3)-2)+”],<br>”;
}
}
_root.textBox += “];”;[/AS]
While I was in there, I added text boxes right to the swf that let you change the size of the pixel grid while the swf is running (instead of having to change the as and re-export).
[FONT=Courier New][/FONT]
I added color functionallity to it, but it was to an old version. rmo518, it would be really cool if you could add it to a new version of it. I like the changes, I was thinking of adding those myself but you made a much nicer version :D.
Here is what I changed in the AS file, you can see the “setRGB” stuff that I added. It pulls from an array the editor spits out.
[FONT=Courier New][/FONT]
for (var i = 0; i<Line1_mc.text_arr.length; i++) {
for (var j = 0; j<Line1_mc.text_arr*.length; j++) {
depth = Line1_mc.getNextHighestDepth();
if (Line1_mc.text_arr*[j] == 1) {
Line1_mc.attachMovie("block", "block"+depth.toString(), depth);
var my_color:Color = new Color(_root.Line1_mc["block"+depth].block.block);
my_color.setRGB(_root.Line1_mc.color_arr*[j]); // my_mc turns red
Line1_mc["block"+depth]._x = (j*10)+(Stage.width/2-Line1_mc.maxwidth/2);
Line1_mc["block"+depth]._y = (i*10)+(Stage.height/2-Line1_mc.maxheight/2);
Line1_mc["block"+depth].xStart = Line1_mc["block"+depth]._x;
Line1_mc["block"+depth].yStart = Line1_mc["block"+depth]._y;
}
_root.Line1_mc["block"+depth].onEnterFrame = function() {
_root.EffectMe(this, _root.effectNumb);
};
}
}
Please incorperate the new color stuff, makes it soo much cooler. Here is a SWF of my mod too, it has presets and stuff but the FLA is too big to host on here. Preset 3 shows off the color capabilities.
EDIT: OOPS rmo, I saw that your runnin MX, I’ll save a mx version for ya. I changed the structure of the little “pixles”. I made a MC inside of them that changes colors, so they still keep their outline.
[SIZE=4][FONT=Comic Sans MS][color=#680aac]I made a class oriented color file!! All you do is pass an array of tile mc’s to the mc argument, and it does the work for you! You can have as many different colors as you want! I think I worked out all the bugs, and with minimal butchering of the original code. (yay!) This project is really cool. It’ll be really great for tile based games, not to mention just effects. I think, if you wanted to, you could use little chopped up pieces of a bitmap as tiles, and it would reduce the use for the BitmapData or BitmapTile classes. Ease of use is good!
Usage:
tiles = [“block”, “block2”, “block3”];
var Scene:Tile = new Tile(tile_arr, tiles, 10, _root, true);
Scene.distance();
P.S. FYI, the file TileColor.as, is only named that. The class is still Tile.[/color]
[/FONT][/SIZE]
nice works !
I have an idea .if somebody can combine the rmo518 “create array” with tilemaps ,that is would be cool. can dynamic generate text array and dynamic generate tilemaps…
I trid it but it cannot work .I am newbie with AS.
var text_arr=new Array();
w = 15;
h = 5;
createPixels();
_root.onMouseDown = function() {
pen = setInterval(pressAndDrag, 10);
};
_root.onMouseUp = function() {
clearInterval(pen);
};
function pressAndDrag() {
if (_root._xmouse<=w*10 && _root._ymouse<=h*10 && _root._xmouse>0 && _root._ymouse>0) {
pixID = Math.ceil(_root._xmouse/10)+(Math.floor(_root._ymouse/10)*w);
if (_root.tool == "pencil") {
_root.grid["pixel"+pixID].gotoAndStop(2);
} else {
_root.grid["pixel"+pixID].gotoAndStop(1);
}
}
}
function createPixels() {
_root.createEmptyMovieClip("eraser", 1);
_root.createEmptyMovieClip("grid", 1);
k = 0;
for (j=0; j<h; j++) {
for (i=0; i<w; i++) {
k++;
clip = _root.grid.attachMovie("pixel", "pixel"+k, k, {_x:i*10, _y:j*10});
}
}
}
function createArray() {
pixelArray = new Array();
for (i=1; i<=w*h; i++) {
if (_root.grid["pixel"+i]._currentframe == 1) {
pixelArray.push(0);
} else {
pixelArray.push(1);
}
}
[COLOR=red]_root.textBox = "[";[/COLOR]
pixelString = pixelArray.join(", ");
for (i=0; i<h; i++) {
if (i == h-1) {
_root.textBox += "["+pixelString.substr(i*w*3, (w*3)-2)+"]";
} else {
_root.textBox += "["+pixelString.substr(i*w*3, (w*3)-2)+"],";
}
}
_root.textBox += "];";
[COLOR=red]text_arr.push(_root.textBox);
trace(text_arr);
doeffect();[/COLOR]
}
[COLOR=red]function doeffect(){[/COLOR]maxwidth = text_arr[0].length*11;
maxheight = text_arr.length*11;
for (var m = 0; m<text_arr.length; m++) {
for (var n = 0; n<text_arr[m].length; n++) {
depth = this.getNextHighestDepth();
if (text_arr[m][n] == 1) {
this.attachMovie("block", "block"+depth.toString(), depth);
this["block"+depth]._x = (n*10)+(Stage.width/2-maxwidth/2);
this["block"+depth]._y = (m*10)+(Stage.height/2-maxheight/2);
}
this["block"+depth].onEnterFrame = function() {
dx = this._x-_root._xmouse;
dy = this._y-_root._ymouse;
dist = Math.sqrt(dx*dx+dy*dy);
if (dist > 100) dist = 100;
this._xscale = this._yscale += (dist-this._xscale);
};
}
}
}
can trace text_arr array .but it is not works fine?
this has really come a long way and just keeps getting better.
rmo518, your array creator makes it so easy to make an array instead of manulaay typiung it.
:: Copyright KIRUPA 2024 //--