カテゴリー:Photoshop 一覧

Node.jsでやりとりするAdobeのアプリ同士のやりとり

前回Photoshopからサーバーを立ち上げて待ち受けの状態まで作ったのでさらに通信を受け取って受け取った内容を表示させたいと思います。具体的にはPOSTでサーバーにデーターを送信してデーターを受け取ったらjsxでデータの内容を表示させます。 POST送信でオブジェクトを受け取ったらjsxでオブジェクトの内容をjsx内のアラートで通知。POST送信はfetchで投げれば簡単にできます。 決して難しくはないコードですが一連のやりとりは勿論非同期で行われる事、IllustratorやPhotoshopといった異なるアプリ間でコードを書かないといけない上、さらにjsxともやりとりしないといけないので

Read more

NodeJsでAdobeのアプリを連携させる

Adobe scriptにBridge talkというものがあって、Bridgeを通じてAdobeのアプリをscriptで連携して動かすという優れものです。これを使ってPhotoshopで画像を編集してその後の処理をIllustratorに渡すという事が可能になるのですが私が何回か使用した経験ですとこれが中々安定しなくてBridgeにデータを送った段階で止まったりした事が多かったので結局使わずじまいで終わりました。しかし最近Illustratorを使う頻度が多くなったのでやはりPhotoshopと連携させたい、という事でもっと安定してアプリ間の連携ができないとかと思ったところExtension

Read more

Photoshop Extensionの開発34 ロード画面(エクステンション)

今回はロード画面をエクステンション上に作ります。エクステンションの場合進捗の割合を表示できませんがcssやjavascriptで自在にロード画面を作成できるので自由度が高いです。まずはロード画面のcssとhtmlから websiteを作る場合と同じ要領でhtmlの一番上の要素にロード画面のレイヤーを載せて通常は非表示。jsxの処理が動いている時にロード画面のhtmlを表示させます。cssはアニメーションで円が三つバウンドするよくあるロード画面です。 作成したロード画面。jsxの処理が開始される時にこのロード画面のdisplayをcssでblockにします。その後jsxの処理が終わった時にロード

Read more

Photoshop Extensionの開発33 プログレスバー

前回よりjsxでのGUIの作り方からプログレスバーの作り方を載せていきます。 jsxの進捗率をリアルタイムで監視するためにはjsxでGUI上にプログレスバーを表示させて処理が終わるまで更新させていきます。まずプログレスバーを表示させる方法は簡単で前回のようにダイアログのオブジェクトにプロパティーで追加します。 プログレスバーの引数は第一引数からprogressbar(ダイアログのパーツの種類)、バーの大きさ、バーの初期値の値、バーの最大値の値になっています。バーの初期値が0の場合真っ黒なバーが画面に表示されます。それでjsxの進捗をバーに反映させる方法ですがプログレスバーのプロパティーに値を代

Read more

Photoshop Extensionの開発32 jsxで作成するGUI

html,cssを駆使してExtensionでscriptのインターインターフェイスを作成できますが実はjsxだけでもユーザーインターフェイス作成できます。まずダイアログの作成ですが。 ウインドウ、コンストラクトから引数にdialogでウインドウ(ダイアログ)を作成する事を指示。第二引数にダイアログの名前。第三引数はダイアログの大きさを配列形式で指定。各配列は[右,上,左,下] と角ダイアログの座標に対応しています。詳しくは古籏氏のサイトを参照するといいかと思います。(かなり詳しく載っています) さらに細かいパーツを追加する場合このウインドウオブジェクトから作成したインスタンスにプロパティーを

Read more

Photoshop Extensionの開発31 ScriptingListener

Adobeから無料で配布されているScriptingListenerはPhotoshop上で操作したユーザーの動作を記録してscriptとしてテキストに書き出してくれる。一部のスクリプト開発者の間では有名だがインストールの方法と一部詳細をここに記載する。 プラグインの場所 こちらのAdobeのサイトからダウンロードできる。ScriptingListener プラグインのwin用かmac用のプラグインをダウンロード、解凍したファイルの保存先はAdobeのサイトに記載してある場所に保存。再度Photoshopを立ち上げるとファイル->スクリプトメニューにScriptingListener O

Read more

Photoshop Extensionの開発30 エクステンションでエクセルデータを表示させる

エクセルの表がどのように読み込まれるか図を上げ直しました。読み込まれた際にはオブジェクト形式でA1,A2,A3,A4….A列の次はそのままB1,B2B3….と各セルがそのまま連続して読み込まれます。これを前回A列、B列と縦列毎に分けました。 以降B,C,Dといった各列のデータ 前回オブジェクトデータの中にMapデータとして各列を整理しました。 因みにAの次にIになっているのはそもそもオブジェクトのプロパティの列挙順が保証されていないためアルファベット順に列挙されたりするわけではないからです。配列のようにsortメソッドも存在しないのでこの辺の処理を気をつけなければなりま

Read more

Photoshop Extensionの開発29 エクステンションでエクセルデータを読み込む

エクセルの表と照らし合わせながらAdobeのソフトでレイアウトを決めたりデザインする作業というのも世の中沢山あるかと思います。というわけで今回はxlsデータをExtensionで読み込んでパネル上に表示させたいと思います。 今回xlsデータの読み込みのためにxlsxモジュールをNodeから使用することにしました。という事でまずはインストール。 インストールしましたらCEPの環境もNode.jsが使用できるようにmanifest.xml等の調整もします。 また今回サンプルのエクセルデータとしてこちらのページから第3章の国民経済計算のエクセルデータを使用しました。 まずはxlsxを読み込みましょう

Read more

Photoshop Extensionの開発28 フィルター作成

古い記事ですが古籏氏のPhotoshopのjavascriptでフィルターを作ろうという記事があってjavascriptでの画像処理のやり方がこちらに載っています。 ただ記事を読めばわかるのですがjavascriptですと処理時間がかかりすぎて実用的なものにならないという結論に至っています。2009年の記事なので今ならjavascriptエンジンも改善されているのではと思う方もいるかもしれませんがjsxに関しては現状特にこれといって何も改善されていないので(未だにecma3ですよ)ピクセルを一つずつ操作する処理はなかなか難しそうです。以下記事を参考にしたもっと簡単なピクセル処理のコードです。4

Read more

Photoshop Extensionの開発27 フォルダー内のファイルをJSXから取得する

今回はjsx側からファイルを再帰的に取得したいと思います。基本的なやり方はパネル側と変わりませんが仕様がいろいろ違ってややこしいとは思います。 まずパネル側がecma2015だったのに対してこちらはecma3なので大分古臭く見えると思います。(wwww まずウインドウダイアログですがjsxですとFolder.selectDialogで呼び出して変数に選択したフォルダーのパスを代入できます。 この後にこのパスを元にファイルリストを取得してゆきます。ファイル取得関数はjsxですとフォルダーオブジェクトに専用のgetFilesメソッドが用意されているのでフォルダーパスを元にgetFilesメソッドで

Read more