Here’s a handy command I created a while ago, but recently upgraded. It takes all the elements on stage in the current frame and lays them out neatly in a grid according to their size.
Why would you ever want to do such a thing? Two situations:
A. You are making a component. You have an assets frame with all your attachable symbols in it.
B. You are making an application where, in order to have a preloader, you do not export your assets first frame, and therefore need to include the assets in a frame somewhere to force them to be exported.
I do both pretty often and always just dump everything into the frame randomly. Sometimes I’ll use the alignment tools to neaten things up a bit. But it’s tough to tell quickly which assets are in the frame. I’m always dragging them here and there searching for a particular one. Kind of like digging through your sock drawer looking for your other green sock. All this command does is neaten things up for you so you can see everything in the frame.
Anyway, without further ado, here’s the command:
(It’s also pretty useful for demonstrating a few cool JSFL techniques.)
maxHeight = 100; padding = 5; // get current frame _doc = fl.getDocumentDOM(); _tl = _doc.getTimeline(); currLayer = _tl.currentLayer; currFrame = _tl.currentFrame; _frame = _tl.layers[currLayer].frames[currFrame]; // put the elements in this frame into an array elems = _frame.elements; numElems = elems.length; === _doc.scaleSelection(scale, scale, "top left"); } // if beyond right side of stage, make new row if(dx + _elem.width > _doc.width){ dx = 0; dy += Math.min(maxHeight, h); } // move to new position _doc.moveSelectionBy({x:dx+2, y:dy+2}); // update variables dx += _elem.width + padding; h = _elem.height; } // custom height sort function (no sortOn available) function heightSort(arr) { var sorted = false; while(!sorted){ sorted = true; for(var i=1;i
I do this all of the time, thank you very much!
…however, to help further my laziness, some of my custom components dont’ have LivePreviews/DeadPreviews.. therefore, I have no f’n clue what a “white dot” is without toggling the Properties Panel, ya know? It’d be cool if you could upgrade this to draw a box around it w/label that shows it’s element.libraryItem.className property.
You da man!
Keith… You wear green socks? lol
Sweet! Exactly what I was looking for since I always do it like point B.