キー入力のつかまえかた:まだScriptUIで生きようとする人のために

どーすか。

DTP界隈でスクリプト書いてる人たち、ぼちぼちUXPの習得は進んでいるでしょうか。
うちはぜんぜんです。半歩も進んでません。さすがに危機感が。
Hello Worldすらおぼつきません。やばくないか。

さておき、

ExtendScriptはまだ世界中の資産もあることなので当分は現役かと思います。
でもでも、ScriptUIはどうだ。いくらなんでも終わってんじゃないか。
UIにこだわる人たちは最低でもCEPエクステンションに勤しんでんじゃないか。
もうだいぶ存在感が薄まってんじゃないか、と想像してます。

つっても、

ここ最近、ScriotUI関連で2つばかし公開したんすよね。
流行ってはないにしろ、需要のあるごくわずかな人の参考になることでも書いておこうか、と思ったので、先日公開したやつからほんの一部、技術的なことを紹介をしておこっかな、なんて。
ふだんは完成品を配ってるだけのblogだけど、たまにはそういうのもやろう。
誰か、今からがんばる人にちょっとでも参考になればいいな。
こんなのはQiitaに投稿すればいいんだけど、物が物なのでちょっと恥ずかしい。
ここで紹介する小技は、だいたいはマンチカンにも使っています。

つわけで、

まずは先日の記事。

InDesign:イラスターの「グリッドに分割」をInDesign用にマネして作ってみたよ

ここからScriptUIのイベントハンドラを抜粋してみます。
コード的にダサい箇所をあとからちょっぴり直したので公開当時にダウンロードした人はもらい直してください。


キー入力をつかまえて処理する

134行め

// エンターキーでOKボタン、escキーでキャンセル
win.addEventListener ("keydown", function(e){
    e.preventDefault();
    if(e.keyName == "Enter"){
        win.apls.btns.ok.notify("onClick");
        }
    if(e.keyName == "Escape"){
        win.apls.prv.value = false;
        win.close();
    }
});

OKボタンとキャンセルボタンをenterキーとescキーを絡めてます。
本来、dialogであれば自動でそうなるものを、
paletteで運用する必要があったのでしぶしぶ実装したかんじ。

ウィンドウでkeydownイベントをつかまえる
Window.addEventListener ("keydown", function(event){ }

個々のコントロールに影響しないようバブリングを遮断しておく
Event.preventDefault();

入力したキーが“Enter”か
Event.keyName == "Enter"

ボタンを押したことにするメソッドを実行。
(これにより、ボタンに別途仕込んでおいたクリックイベントが発火)
Button.notify("onClick");


値のフィールド(EditText)上で行われたキー入力を処理

191行め

// 値のフィールドで矢印キー上下の操作
win.prms.rowP.length.e.addEventListener ("keydown", function(e){
    e.preventDefault();
    if(e.keyName == "Up"){
        upFunc(this);
    }
    if(e.keyName == "Down"){
        dnFunc(this);
    }
    if(e.keyName == "Tab"){
        win.prms.clmP.length.e.active = true;
    }
});

キー入力が 上↑ なら値を増加、下↓ なら減少、tab なら隣の入力欄へフォーカスする、という内容。


上下キー操作時、shiftキーが同時に押されていたら増減量を盛る

231行め

// 値のボタン操作による増加 シフトキーで5ずつ
function upFunc(up){
    var et = up;
    var val = et.text - 0;
    var bs = ScriptUI.environment.keyboardState.shiftKey ? 5 : 1;
    et.text = val - val % bs + bs;
    if(win.apls.prv.value == true){
        verifyValues();
    }
}

shiftキーが押されていたら5ずつ、いなかったら1ずつにする三項演算子
var bs = ScriptUI.environment.keyboardState.shiftKey ? 5 : 1;


keycodeStringのしらべかた

たとえば、こういう。

#targetengine "getkeycode"

var win = new Window("palette{E:EditText{characters:20}, F:EditText{characters:20}}");

win.F.addEventListener("keydown", function(event){
    win.E.text = event.keyName;
});

win.show();

下の欄に任意にキー入力すると上の欄にkeycodeStringが出るやつ。
万能ではないけどお手軽。


だいたい以上です。
上記はkeycodeString(文字列)ではだめで、keycode(コード)でないと扱えない、というキーもありますが自分的にはあんまり需要がありませんのでやりませんのですみません。
なんかおもしろいもん作ってみてください。
ではではー。

アレを直しました

むかし手習いに書いた、ExtendScriptで動くマインスイーパー的なものがあるんですが(14年まえ……)
アプリのインターフェイスが変遷してUIテーマカラーが選べるようになって以来、とんでもなく見づらいことになってたんでした。
しかし仕事にかまけて地雷撤去などするヒマもなく、放置してました。
修正内容はといえば、iconButtonのenabledをさわらないようにしただけです。
なんのことだかわかんなくても大丈夫です。言いたかっただけです。

というわけで、どうぞ。

msByESTK

今や意味を成さない名前ですが、「ExtendScriptToolKitで作られたマインスイーパー」の意ですね…
Photoshop, Illustrator, InDesign, AfterEffects で動作確認済み。
WindowsおよびMojave以前のMacなら ExtendScriptToolKit でも動きます。Bridgeはどうだろう?


あそびかた

ダウンロード&解凍するとこんなかんじになっています。

jsxファイル「msByESTK.jsx」だけ、対応アプリの所定のスクリプト置き場へ移動してくださいまし。
他はアイコンのデータです。フォルダごとデスクトップに転がしておきます。デスクトップじゃないとだめです。
準備は以上。

アプリからスクリプト実行で、おしごと開始。
幅・高さのマス数、レベル(ばくだん率)を選択して、おしごとをどうぞ。


だいじなこと

ほんとにだいじなことなんですが、
途中でやめたくなったら、escボタンで閉じることができます。
そもそもですが、勤務中は控えましょうね。言ってもやる人はやるよね。自分のことだね。


ちなみに改修前はこんなかんじになっちゃってました。ひどい。視力おちる。

InDesign:画像と親フレームの変形基準点同士を整列するやつ、15年ぶりに修正

ものかのさんが何かしてたのをたまたま見かけてしまい、
昔そんな感じのスクリプト書いて、今でも使ってますよ、と動作確認したらちょっぴり不自由だったので、すこしだけ書き足しました。
あらためて。

fitAnchors.jsx


あそびかた

あらかじめ、変形パネルやコントロールで、変形基準点を確認しておきます。この基準点が整列基準点になります。
そいで、画像か、画像の親フレームを選択して実行。複数まとめていけるはず。
すると、親フレームと中身の変形基準点が合わさります。
こんなかんじ。回転かかってても大丈夫なはず。

というのを書いたのが2010年11月ごろだそうで、shagとか着手するよりも前なので、もうまったく内容を覚えとりません。はー。