2009/01/20

Fireworksでくずれた角丸を元通りにするコマンド

こんばんは。きんくまです。

Fireworksで角丸矩形を作ったあと、それを拡大縮小するときの話です。

縦横比を固定のままだと問題ないんですが、固定じゃない場合、角丸がくずれちゃいます。
それを、直そうというコマンドを作りました。

やっていることは、くずれた矩形を削除してから、新しい矩形を作って、前の属性をコピーする。
というそれだけです。ヒストリパネルからいくつかコピったらすぐできました。

■使い方
1.下のソースをコピーして、「replaceRoundRect.jsf」などの名前で保存。
拡張子が「.jsf」であれば何でもOK
2.Fireworks上で対象となる角丸矩形を選択
3.コマンド→スクリプトの実行から、さきほどのファイルを選べばOK

ちなみに毎回やるのがめんどいので、CS3の場合
C:Program Files\Adobe\Adobe Fireworks CS3\Configuration\Commands
ここに.jsfファイルをおいてから再起動かけるとコマンドに最初から入ってます。
他のバージョンのFireworksもFireworksフォルダから
ConfigurationCommands
ってめぐっていくとあるのでそこにいれて再起動をかけてみてください

(MIT License)
CS3用

fw.getDocumentDOM().clipCopy();
var currentRect= fw.selection[0];
var _right = currentRect.left + currentRect.width;
var _bottom = currentRect.top + currentRect.height;
var _roundness = currentRect.roundness;
fw.getDocumentDOM().deleteSelection(false);

fw.getDocumentDOM().addNewRectanglePrimitive({
  left:currentRect.left,
  top:currentRect.top,
  right:_right,
  bottom:_bottom
}, 0);

fw.getDocumentDOM().clipPasteAttributes();
fw.getDocumentDOM().setRectRoundness(_roundness);

CS4用(10/02/24追記)
>> サンプルソースダウンロード(ResetRoundRectCorner.jsf)

fw.getDocumentDOM().clipCopy();
var currentRect= fw.selection[0];
var _right = currentRect.left + currentRect.width;
var _bottom = currentRect.top + currentRect.height;
var _roundness = currentRect.roundness;
var mode = currentRect.mode;
fw.getDocumentDOM().deleteSelection(false);

fw.getDocumentDOM().addNewRectanglePrimitive({
	left:currentRect.left,
	top:currentRect.top,
	right:_right,
	bottom:_bottom
}, 0);

fw.getDocumentDOM().clipPasteAttributes();
fw.getDocumentDOM().setRectRoundness(_roundness, mode);

コメント / トラックバック 11 件

  1. [...] 由変形などをすると角丸がゆがんでしまいます。 パネルから数値をいれての変形も手間、そんな方におすすめです。 Fireworksでくずれた角丸を元通りにするコマンド « きんくまデザイン [...]

  2. [...] ば問題ないみたい。 Fireworksでくずれた角丸を元通りにするコマンド|きんくまデザイン うちもjsf作れるようになりたひ。 [...]

  3. ふわりん より:

    はじめまして。いつもためになるブログをありがとうございます。感謝しております!

    こちらの、角丸矩形を戻すスクリプトを実行したところ、
    崩れた『角丸長方形』から、普通の『長方形』になってしまいます。

    バージョンはFW CS4です。未対応なのでしょうか?

  4. admin より:

    > ふわりんさん
    コメントありがとうございます。
    CS4用のものを追加しました。
    CS4から角丸が「%とピクセル」を選べるようになったので、動かなかったのは
    たぶんピクセルが選ばれていたのかもしれませんね。
    なので、そこをスクリプトに追加しておきました。

  5. ふわりん より:

    早々のご対応、ありがとうございました。
    早速試してみたところ、

    『スクリプトを実行できませんでした。
    パラメータが正しくありません。』

    とエラーが出てしまいます。。

    そちらでうまく動作しているのならば、
    何か私の環境がおかしいのかもしれません。

    せっかく対応いただいたのに、申し訳ないです。

  6. admin より:

    > ふわりんさん
    CS4用のサンプルソースを置いておきました。
    これを名前をつけてCommandsフォルダに保存します。
    それでアプリの再起動かけたあと、実行してみてください。

    ちなみに、この動作が面倒な場合は、手軽にjsfを試して実行できる拡張パネル
    jsfEditっていうのを作ってますのでよかったらためしてみてください
    > sflEdit, jsfEdit « 複数の「JSFL/JSF」の「実行/編集」ができる「Flash/Fireworks」の拡張パネル

  7. ふわりん より:

    ありがとうございます。
    サンプルからResetRoundRectCorner.jsfをダウンロードしましたが、同じエラーになってしまいました。
    私の環境がおかしいのかもしれません。
    機会があれば、他マシンでやってみます。ありがとうございました。

  8. [...] Fireworksでくずれた角丸を元通りにするコマンド « きんくまデザイン [...]

  9. [...] きんくまデザインさんのもとコードはこちら→Fireworksでくずれた角丸を元通りにするコマンド (きんくまデザインさんの記事でライセンスがMITになってたんですが、ライセンス/著作権 [...]

  10. たいが より:

    神様仏様きんくま様ありがとうございます!今までの悩みが一発で解消されました!(使用Ver.はCS5です)
    このような有用なツールの公開感謝いたします(^^*)

  11. admin より:

    たいがさま
    お役にたったようで、うれしいです!

コメントはお気軽にどうぞ!(コメントのみも受け付けてます)

ページトップへ戻る