fireworks

2009年09月30日

Fireworksで自動処理-amazonのCDジャケ画分割を並べる

これは先日のamazonの分割されたCDジャケット画像をFireworksで結合するプロジェクト。我ながらなんて諦めが悪いんだろうと思ったりする(w というか何か出来そうな気がするからやってみたくなるんだよね。

基本となるのはやはりFireworksのヒストリに残ったスクリプトである。こいつを手がかりにしてスクリプト化していくしかプログラミングが苦手な私には手が無い。
fw.getDocumentDOM().importFile("file:///C|/amazon/0-0.jpg", {left:l, top:t, right:0, bottom:0}, false);
ぶっちゃけ肝はこれだけだ。対象となるファイル名を指定し、それをどの位置に読み込むか?をleftとtopで指定している。rightとbottomは0にしとけば、きっちりしたサイズじゃなくてもリサイズされないのがポイントだ。

とりあえず先日の平原綾香の分割画像を読み込むスクリプトをつらつらと記してみた。汎用性を持たせるために前提条件としてファイル名をリネームすることとした。とりあえずはめっちゃベタなスクリプト。でもこれをベースにすればリネームの手間はあるがFireworksで結合が出来てしまう。

C:\amazon\0-0.jpg という感じに行-列番号の連番にリネーム。

「Amazonジャケット自動配置5x5.jsf」
// 初期変数設定(l=left,t=TOP)
var l = 0;
var t = 0;

//第一列
fw.getDocumentDOM().importFile("file:///C|/amazon/0-0.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/0-1.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/0-2.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/0-3.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/0-4.jpg", {left:l, top:t, right:0, bottom:0}, false);

//第二列
l = 400;
t = 0;
fw.getDocumentDOM().importFile("file:///C|/amazon/1-0.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/1-1.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/1-2.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/1-3.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/1-4.jpg", {left:l, top:t, right:0, bottom:0}, false);

//第三列
l = 800;
t = 0;
fw.getDocumentDOM().importFile("file:///C|/amazon/2-0.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/2-1.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/2-2.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/2-3.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/2-4.jpg", {left:l, top:t, right:0, bottom:0}, false);

//第四列
l = 1200;
t = 0;
fw.getDocumentDOM().importFile("file:///C|/amazon/3-0.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/3-1.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/3-2.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/3-3.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/3-4.jpg", {left:l, top:t, right:0, bottom:0}, false);

//第五列
l = 1600;
t = 0;
fw.getDocumentDOM().importFile("file:///C|/amazon/4-0.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/4-1.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/4-2.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/4-3.jpg", {left:l, top:t, right:0, bottom:0}, false);
t = t + 400;
fw.getDocumentDOM().importFile("file:///C|/amazon/4-4.jpg", {left:l, top:t, right:0, bottom:0}, false);

めっさ長くてゴメンナサイ。livedoorブログはテキストファイルすら添付できないですからね。

とりあえず出来たのでキャプチャアップしておきます。
400px間隔のガイドラインももちろんスクリプトで引いてます。
一瞬で配置できるのはある種快感ですな(w

全画面キャプチャ 20090930 183636

後は汎用性を持たせられたら良いんだけどな。それともっとブラッシュアップさせたい。人に見せるスクリプトじゃないもんな(w ってこんなところに書いてるし。恥を言ってたら成長できませんと開き直る。


関連ページ

続きを読む

sasapurin at 23:58|PermalinkComments(0)TrackBack(0)このエントリーをはてなブックマークに追加 mixiチェック

Fireworksで自動処理-ガイドラインを引く

Fireworksは案外便利なのに活用してなかったりする。仕事で画像処理系の作業をする事が多くなったので、定期的に行なうこととかは、自動処理させられる様に工夫しようと思った。

まずはガイドラインの設定。いわゆる方眼紙のような等間隔の升目にガイドラインを引いておくと作業が便利な時がある。しかしこれをいちいち手作業でやってるとあほらしくなってくる。

という訳でガイドラインを指定したピクセル数の等間隔で指定本数設定してくれるスクリプトを作ることにした。と言っても大したことではなかったりする。基本的には、Fireworksの「ヒストリ」に記録されたJavascriptコードを流用するのだ。「ステップをクリップボードにコピー」することと、つくったスクリプトの拡張子を.jsfで保存することだけ。

後はぶっちゃけ手順を羅列して行けば定型作業の効率化は期待できる。個人で楽するのが目的なら洗練されたスクリプトを書く必要性は低い。

とりあえず簡単に作ってみたもの。
「400px間隔で5本ガイドライン.jsf」
//400ピクセル幅でガイドライン設定スクリプト

//縦に5本
fw.getDocumentDOM().addGuide(0, "vertical");
fw.getDocumentDOM().addGuide(400, "vertical");
fw.getDocumentDOM().addGuide(800, "vertical");
fw.getDocumentDOM().addGuide(1200, "vertical");
fw.getDocumentDOM().addGuide(1600, "vertical");

//横に5本
fw.getDocumentDOM().addGuide(0, "horizontal");
fw.getDocumentDOM().addGuide(400, "horizontal");
fw.getDocumentDOM().addGuide(800, "horizontal");
fw.getDocumentDOM().addGuide(1200, "horizontal");
fw.getDocumentDOM().addGuide(1600, "horizontal");
これだけのことだけど400ピクセル間隔で5本ずつガイドを引いてくれる。毎度毎度同じ作業をしているのであればスクリプト化しておくメリットは大きいと思うがいかがでしょうか?

このjsfファイルをデフォルトだと下記に保存すればFWのコマンドメニューに追加されて簡単に選択して実行させられます。
C:\Program Files\Macromedia\Fireworks MX 2004\Configuration\Commands\
続きを読む

sasapurin at 23:01|PermalinkComments(0)TrackBack(0)このエントリーをはてなブックマークに追加 mixiチェック