【GAS】中級の復習 その5（UI）

▼こちらの続きです。

今日はワクチン2回目を打ってきた。2回目の方が副反応がきついという噂なので、経口補水液やウィダーインゼリー、解熱鎮痛剤を買い込み、家の中をきれいに掃除して、夫と子供の2日間分のごはんも作り置きをした。我ながら万全すぎる・・！

私は会社では安全衛生に関わる業務もしていて、産業医の先生と定期的に話す機会があるのだけれど、先生いわく「若い女性は特に副反応が強い」とのこと。

周りの人は2回目の副反応がかなりキツかったと言っていて、副反応は軽いに越したことはないけれど、若い人に出やすいと聞くと、全く副反応が出なかったらそれはそれで複雑な気持ちになる･･･。

家事も終わったので、GAS復習の続き。今回はメニューやダイアログを操作するUI。「自動化できている・・！」という実感がとても湧きやすい楽しいテーマです。

Uiクラス

まずUiとは何なのか、ということを改めて理解するためにリファレンスを読む。いや、正確にはGoogle翻訳さんに教えてもらう。

スクリプトがメニュー、ダイアログ、サイドバーなどの機能を追加できるようにするGoogleアプリのユーザーインターフェース環境のインスタンス。スクリプトは、開いているエディターの現在のインスタンスのUIと対話できるのは、スクリプトがエディターにコンテナーバインドされている場合のみです。

意訳すると、「メニュー・ダイアログ・サイドバーなどの機能を追加できるよ！ただし、コンテナバインドスクリプトだけね」ということだと思われる。サイドバーが気になって、隣ITを見てみたけれどとても難しそうなので今回は見送る（次回はやってこない予感･･）。

Google Apps Scriptでサイドバーを作る方法のはじめの一歩の概要編

ダイアログ

ダイアログにはアラートダイアログと入力ダイアログの2種類がある。

アラートダイアログ

function myFunction4_13(){
 const ui = SpreadsheetApp.getUi();
 ui.alert(`これがアラートダイアログだよ`);
}

入力ダイアログ

function myFunction4_14(){
 const ui = SpreadsheetApp.getUi();
 ui.prompt(`これが入力ダイアログだよ`);
}

最もシンプルなスクリプトとして、この2種類は脳死で覚えている。入力ダイアログは文字通り、何らかの文字を入力させる窓（？）が出てくる。また、どちらのダイアログも表示させるボタンを以下の4種類から選べる。

OK　　
OK_CANCEL
YES_NO
YES_NO_CANCEL

押されたボタンや入力ダイアログに入力された文字を取得して変数に格納し、次に実行する動作を分岐したりすることもできる。

入力ダイアログで名前を入力させて、「お元気ですか？」の質問を表示し、YESとNOの場合でアラートダイアログを分岐させるスクリプト

function myFunction4_10_2() {
 const ui = SpreadsheetApp.getUi();
 const prompt1 = `名前を入力してください`;
 const response = ui.prompt(prompt1, ui.ButtonSet.OK);
 const name = response.getResponseText();

 const prompt2 = `Hello ${name}さん！\nお元気ですか？`;
 const response2 = ui.alert(prompt2, ui.ButtonSet.YES_NO);

 switch (true) {
   case response2 === ui.Button.YES:
     ui.alert(`それはいいですね！`);
     break;
   case response2 === ui.Button.NO:
     ui.alert(`それは残念ですね！`);
     break;
 }
}

こんな感じで出る。「いいえ」を押すとちょっとイラッとする。

「はい」を押すと嬉しくなる。

分岐はif文やswitch文で書き分ければOK。

メニュー

GASではカスタムメニューも作れる。スプレッドシートで作成すると、上のメニューバーのところに追加される。↓

これも書き方は決まっているので、スニペットツールなどに登録しておくと早い。

A1セルにタイムスタンプを押す独自メニュー

function onOpen() {
 const ui = SpreadsheetApp.getUi();
 const functionName = `timeStamp`;
 ui.createMenu(`独自メニュー`)
   .addItem(`タイムスタンプ`, functionName)
   .addToUi();
}

function timeStamp() {
 const sheet = SpreadsheetApp.getActiveSheet();
 sheet.getRange(`A1`).setValue(new Date());
}

【独自メニュー】>【タイムスタンプ】と押すと、A1に現在時刻が入力される。

メニューの名前は自由に変えられる。便利！

ちなみに↑のonOpen関数の中に処理したい内容をアロー関数で書いた場合はエラーが出て動かなかった。アロー関数は変数に格納されていて、関数名という認識がされないのだろうという推測。まぁ、このonOpen関数のスクリプトは定型で使い回して、実際にやりたい処理は他の関数で書いた方が読みやすいとは思う。

そろそろ熱が出てきた気がするので（気のせい）、次回へ続く。