【ＧＵＩビルダー】ダイアログボックス表示（１）

■今日のゴール

　　　以前、このブログにて「Googleサイトでできないこと」という記事の中で、
　　　Googleサイト上では、”Browser.msgBox()”というメッセージボックスを表示させる関数は
　　　使えない、ということを書きました。

　　　それは間違いないのですが、いくらなんでもメッセージボックスが表示できないなんて、
　　　不便すぎるーーー(´Д｀。)！！と、ぼやいて色々と調べていましたら、

　　　　　　　　　　　　ダイアログボックスというものがあるらしい！！


　　　と、いうことで、今日はこのダイアログボックスをGoogleサイト上で表示させるスクリプトを
　　　作ってみます。


■参考元

　　　今回主に参考にしたのは、以下のサイトです。

　　　【Libro　：　初心者のためのGoogle Apps Scriptプログラミング入門】
　　　http://libro.tuyano.com/index3?id=650003&page=5

　　　最近おなじみのサイトですね。
　　　ブラウザにメニューバーを追加し、メニュークリック時にダイアログボックスを表示させる
　　　スクリプトが紹介されています。
　　　


■手順・スクリプト

　　　まず、今回もGoogleサイトから「サイトの管理」→「Appsスクリプト」を開き、
　　　「新しいスクリプトを追加」します。

　　　

　　　スクリプトエディタが開いたら、以下のスクリプトを記述し、「保存」します。

　　　　　　　　☆簡単コード解説☆

　　　　　　　　　　1～30行目　　：　UIサービスの起動

　　　　　　　　　　　　　　　　　　　　　　－GUIビルダーで作成したUIの呼び出し

　　　　　　　　　　　　　　　　　　　　　　－関連するfunctionの呼び出し

　　　　　　　　　　　　　　　　　　　　　　－ダイアログボックスの作成

　　　　　　　　　　32～39行目　：　ボタンクリック時の処理を定義

　　　　　　　　　　41～48行目　：　ダイアログボックス内のボタンをクリック時の処理を定義

　　　　　　　-------------------------------------------------------------------

　　　　　　　　　　1～4行目　　 ：　割愛　（決まり文句）

　　

　　　　　　　　　　6行目　　　　 ：　function”ｍｙClickHandlerButton”を呼び出し

　　　　　　　　　　7行目　　　　 ：　function”ｍｙClickHandlerDialog”を呼び出し

　　　　　　　　　　9～16行目　 ：　ダイアログボックスの枠組みを作成

　　　　　　　　　　　（9行目）　　      －createDialogBox（autoHideの可否,modalの可否）という

　　　　　　　　　　　　　　　　　　　　　 　構文で、それぞれ次のような意味

　　　　　　　　　　　　　　　　　　　　　　　　autoHide…ダイアログボックスを複数表示する場合、

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　自動的に古いボックスを閉じる

　　　　　　　　　　　　　　　　　　　　　　　　modal…ダイアログボックス表示時に、それ以外の

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　部品（ボタン等）を使用不可状態にする

　　　　　　　　　　　（10行目）　　　　－ダイアログボックスのID 設定

　　　　　　　　　　　（11行目）　　　　－ダイアログボックスをドラッグで移動できるように設定

　　　　　　　　　　　（12行目）　　　　－ダイアログボックス表示位置設定（上から○○px）

　　　　　　　　　　　（13行目）　　　　－　　　　　　　同上　　　　　　　　　　（左から○○px）

　　　　　　　　　　　（14行目）　　　　－ダイアログボックスタイトルバーの表示設定

　　　　　　　　　　　（15行目）　　　　－ダイアログボックスの大きさ設定（幅＋高さ）

　　　　　　　　 　　 （16行目）　　　　－ダイアログボックスを非表示に設定

　　　　　　　　　18～20行目　：　パネルの作成（サイズ・表示する文字の設定）

　　　　　　　　　　　　22行目　：　ボタン作成

　　　　　　　　　　　　23行目　：　ボタンに、ボタンクリック時の処理を定義したfunctionを紐付け

　　　　　　　　　　　　24行目　：　ボタンをパネルの中に配置するよう設定

　　　　　　　　　　　　26行目　：　パネルをダイアログボックスの中に配置するよう設定

　　　　　　　　　27～35行目　：　割愛　（決まり文句）

　　　　　　　　　　　　36行目　：　ダイアログボックスを表示する設定

　　　　　　　　　37～44行目　：　割愛　（決まり文句）

　　　　　　　　　　　　45行目　：　ダイアログボックスを非表示にする設定

　　　これで、スクリプトは完了！

スクリプトの説明が思いのほか長くなったので、

今日はここまで。

　　

■予告編

　　　明日は、今日の続きです☆