オリジナルツール / Fireworks用オリジナルコマンド(jsf)一覧

Fireworks用のコマンドファイル(JSF)を公開します。
業務の中でブラッシュアップしてきたコマンド集なので、年がら年中、Fireworksを使ってる方には、便利なコードがいくつかあるとおもいます。

■ビデオチュートリアルに関しての注意点

チュートリアルビデオのFireworkの画面中に、右側にCommandsというパネルがありますが、インストールしているコマンドをボタンとして利用できる拡張機能です。
以下のサイトで配布しています。いろいろFireworksの拡張機能があります。

johndunning.com/fireworks
http://johndunning.com/

■コマンド / ドキュメント関連

ビデオチュートリアル
実際の使用方については、こちらにて確認できます。
各コマンドの解説
00_document_save.jsf 強制的に、指定したディレクトリに保存します。
デフォルトではW:/temp/となってるので、適当にどこかにディレクトリを作成し、JSFファイルを編集してください。
保存先やファイル名を決めるのが面倒なとき、とりあえずこのコマンドを実行し保存します。
コマンド実行時の年月日と時間からファイル名をつけてるので、保存順にならびます。

実行するたびに、新規保存されます。

■解説 / オブジェクト関連

ビデオチュートリアル
実際の使用方については、こちらにて確認できます。
各コマンドの解説
object_dupulicate_holizon.jsf オブジェクトを10px間隔で右へ複製します。
object_dupulicate_vertical.jsf オブジェクトを10px間隔で下へ複製します。
object_fit10px.jsf オブジェクトの配置位置を、10PX単位で丸めます。
レイアウト微調整時に、まとめてオブジェクトを選択し実行し、半端なXY位置をまるめるという用途ですが、テキストオブジェクトに対しては、微妙にずれるので、あまり実用度は高くありません。
object_resize_1px_up.jsf オブジェクトの上下左右を1pxづつ大きくします。スライスにも使用できます。
object_resize_1px_down.jsf オブジェクトの上下左右を1pxづつ小さくします。スライスにも使用できます。
object_resize_harf.jsf オブジェクトを半分のサイズにします。
object_resize_prompt.jsf ダイアログに値入力し、オブジェクトをリサイズします。
例:オリジナル画像サイズが横:200px、縦:300pxの場合

[ 100,100 ] とした場合は、横:100px、縦:100pxにリサイズされます。
比率を保持したい場合は、0を使用します。
[ 100,0 ] とした場合は、横:100px、縦:150pxとなります。
object_rotation.jsf ダイアログに値入力し、オブジェクトを回転します。

■解説 / テキスト関連

ビデオチュートリアル
実際の使用方については、こちらにて確認できます。
各コマンドの解説
textBox_copy_text.jsf テキストを1行だけ抜き出し編集します。通常のテキスト編集ウィンドウとくらべ高速に動作します。
textBox_delete_break.jsf テキスト内の改行を削除し、強制的に、1行にします。
textBox_font_size_down.jsf フォントサイズを大きくします。
textBox_font_size_up.jsf フォントサイズを小さくします。
textBox_join.jsf 複数のテキストオブジェクトを1つに。順番は、オブジェクトの重ね順によります。
textBox_resize_fit.jsf テキストオブジェクトの横幅を、テキストの幅にあわせてフィットします。
textBox_resize_width_narrow_50px.jsf テキストオブジェクトの横幅を、50px狭めます。
textBox_resize_width_wide_50px.jsf テキストオブジェクトの横幅を、50px広げます。

■解説 / カラー補正関連

ビデオチュートリアル
実際の使用方については、こちらにて確認できます。
各コマンドの解説
color_lebel_10.jsf レベル補正します。
color_lebel_10_strong.jsf レベル補正します。
color_lebel_50up.jsf レベル補正します。
color_lebel_50_updown.jsf レベル補正します。
color_lebel_90.jsf レベル補正します。
color_lebel_90_strong.jsf レベル補正します。

■解説 / スライス関連

ビデオチュートリアル
実際の使用方については、こちらにて確認できます。
各コマンドの解説
slice_copy_exported_filePath.jsf FireworksのPNGドキュメントは、前回書き出したスライス画像のパスを覚えています。その情報をもとに、前回出力したファイルパスをダイアログに表示します。1ドキュメント1パスだけ記憶しているので、その点を注意する必要があります。
slice_copy_imageTag.jsf スライスからIMGタグを生成し、をダイアログに表示し、コピーすることができます。
slice_create.jsf スタイルを作成します
slice_nambering.jsf 複数のスライスに対して、一括で連番や指定した名前で、スライス名を設定できます。

■2011/07/20追記

スライス関連の拡張パネル作りました。
スライスの作成・名前付け、コード出力など「PI_Slice」

■解説 / レイヤー関連

ビデオチュートリアル
実際の使用方については、こちらにて確認できます。
各コマンドの解説
layer_all_Layer_close.jsf すべてのレイヤーを閉じます。
layer_webLayer_close_and_open.jsf ウェブレイヤーの開閉ができます。

■一括ダウンロードと設置手順について


MXPファイルになってますので、ダウンロード後、「PI_fireworks_commands.mxp」をクリックすれば、 EXTENSION MANAGERが起動し、インストールできます。

以上です。
使用や改変は、自己責任でご自由に。

エントリー一覧

ソーシャル

About This Site

HTML、CSS、Javascript、デザイン、3D、モバイルアプリ、CMSなど、ウェブ制作関連の話題を扱うブログです。Fireworksのオリジナル拡張機能の配布や、デザインリソースの配布、オリジナルツールの公開も行っています。

About Me


大阪在住フリーのウェブデザイナーの、ピクセルイメージ田中です。長年、ウェブサイト構築のお手伝いを行っており、デザインやプログラムを中心に、Flash全盛期につちかったモーショングラフィクスのセンスを生かした動画作成や、サイト構築に便利なCMSの開発も行っています。

JS CMS -- DBレス・簡単導入・無料のWebサイト構築用オープンソースCMS
ピクセルイメージ | JS CMSの導入、カスタマイズの依頼は...