Adobe Fireworks のコマンドでトリコロールのグラデーションを作る

Fireworks

FireWorks でトリコロールやビコロールの塗りを作る時にどうしてますか？
矩形を並べてそれぞれ単色の塗りを与えてもいいのですが、矩形のレイヤーが邪魔になったりしませんか？
そんなあなたに矩形１つに対して３色分割を簡単に行うコマンドの紹介です。
要はグラデーション処理（Adobe Fireworks で虹色グラデーション - Office L テクニカルノート）を改良して、３色表示になるようにしただけなんですけどｗ


コマンド化の優れている点、工夫されている点

  1. 何も選択していない状態なら自動で矩形を１つ生成する
  2. 矩形、オートシェイプ、パス、テキストなど、おおよそどのオブジェクトに対しても適用できる(きれいかどうかは別)
  3. 処理後は自由にいじれる
  4. 実行時に三色を #RRGGBB で指定するので、狙った色に出来る
  5. 色指定中ならいつでもキャンセルできる

未解決の問題点、未対応な点、検討の余地がある点、未熟な点

  1. 複数処理は未対応（オブジェクトを複数選択してまとめて実行、はできない）
  2. ４色や５色にもプログラムで対応可能なはず
  3. グラデーションハンドルを横向きにする、をやりたい
  4. 色コードのエラー処理書いてない（めんどいｗ）

インストール

  1. 置くべきところにファイルとして置くだけです。（CS3 で Vista の場合は、c:\Users\ユーザ名\AppData\Roaming\Adobe\Fireworks CS3\Commands らへん）
  2. Adobe Fireworks でコマンドにアクセスキーをつける（CS3なら Flash でもOK） - Office L テクニカルノートも参考にどうぞ

使い方

  1. 実行するだけです
  2. 順番に表示されるプロンプトに色を指定してください
  3. 何も選択してない状態だと、100x100の四角い矩形を自動で生成します
  4. 適当な矩形やオートシェイプを選択した状態で実行すると、そのオブジェクトに対してグラデーションがかかります。

その他

というわけでソースコードは以下です。
自由にコピペして使ってください。

ソース ( tricolour(&T).jsf )

/*
Name: tricolour ( Adobe Fireworks Commands )
URI:  http://d.hatena.ne.jp/officel/
Description: グラデーションで３色分割を設定する。
Version: 1.0
Author:  Y.Nishimura from Office L
Author URI: http://officel.biz/

Usage: 処理したいオブジェクト（矩形、シェイプ、パス、テキスト等々）を選択して実行
     : 選択されていない場合は新しい矩形を勝手に作成
     : 複数処理には未対応（めんどくさいｗ
Tags: Fireworks,commands
*/

var dom = fw.getDocumentDOM();			// document object
var sel = [].concat(fw.selection);		// saved selection
var iam = "Tricolour by Office L";

function tricolour(){
	if (!dom) return;
	if (sel.length >  1) return alert('１つずつしか処理できないです。');
	if (sel.length <= 0){
		// オブジェクトが選択されてなかったら勝手に１個作って処理する
		dom.addNewRectanglePrimitive({left:100, top:100, right:200, bottom:200}, 0);
		sel = [].concat(fw.selection);
	}

	col1 = prompt('1st Color (#rrggbb)','#ff0000');
	if(col1 == null){return;}
	col2 = prompt('2nd Color (#rrggbb)','#ffffff');
	if(col2 == null){return;}
	col3 = prompt('3rd Color (#rrggbb)','#0000ff');
	if(col3 == null){return;}


	dom.setFill({
		category:"fc_Linear",
		ditherColors:[ "#000000", "#000000" ],
		gradient:{
			name:"cn_Custom",
			nodes:[
				{ color:col1, isOpacityNode:false, position:0 },
				{ color:col1, isOpacityNode:false, position:0.02 },
				{ color:col1, isOpacityNode:false, position:0.33 },

				{ color:col2, isOpacityNode:false, position:0.34 },
				{ color:col2, isOpacityNode:false, position:0.66 },

				{ color:col3, isOpacityNode:false, position:0.67 },
				{ color:col3, isOpacityNode:false, position:0.98 },
				{ color:col3, isOpacityNode:false, position:1.0 }
			],
			opacityNodes:[
				{ color:"#000000", isOpacityNode:true, position:0 },
				{ color:"#000000", isOpacityNode:true, position:0.01 },
				{ color:"#000000", isOpacityNode:true, position:0.99 },
				{ color:"#000000", isOpacityNode:true, position:1.0 }
			]
		},
	});
}

try{
	tricolour();
}catch(e){
//	alert([e, e.lineNumber, e.fileName].join("\n"));
};

最後に

自由に改造して使ってください。
もっと上手に書き直してやったぜ、とか、こんなセッティングにしてみたぜ、みたいなのは歓迎です。ぜひいろいろやっちゃってください。
では楽しんでください。