アドオン・プログラムを作ろう！ (2/5)

では、実際にアドオンを作ってみましょう。ここではスプレッドシートに組み込んで使うタイプのアドオンを作ってみます。

まず、Googleドライブから新規にスプレッドシートを作成してください。そして、開いたら＜ツール＞メニューの＜スクリプトエディタ...＞を選び、スクリプトエディタを起動します。そして、下のリスト欄のスクリプトを記述してください。今回のサンプルは、「マイ・アドオン」というアドオンです。これはサイドバーに表示されている入力フィールドとボタンを操作して簡単なメッセージを表示する、というごく単純なものです。


ここでは、いくつかの機能が用意されています。まず、注目すべきは、「onOpen」と「onInstall」の２つの関数です。

onOpenは、既におなじみですね。ドキュメントを開いた際に実行される処理です。そしてonInsallが、新たに追加された「アドオンをインストールした際のイベント」です。ここでは、onInstallでは単純にonOpenを呼び出して実行しています。まぁ、普通は「インストール時の処理＝オープン時の処理」と考えていいでしょう。


onOpenで行っているのは、「アドオン」メニューへの組み込みです。これは以下の手順で行います。


1. Uiオブジェクトの取得

var ui = SpreadsheetApp.getUi();

まず、Uiオブジェクトを取得します。ここではスプレッドシートを利用していますから、SpreadsheetApp.getUi();で取得しています。もしGoogleドキュメント用のアドオンを作りたいなら、DocumentApp.getUi();として取得すればいいでしょう。


2. Menuオブジェクトの作成

var addon = ui.createAddonMenu();

「アドオン」メニューのMenuオブジェクトを作成します。これは、Uiオブジェクトの「createAddonMenu」を呼び出します。これで作成されたMenuオブジェクトに、必要なメニュー項目を追加していきます。


3. メニュー項目の追加

addon.addItem('サイドバーを表示', 'showSidebar');

作成したMenuオブジェクトの「addItem」を呼び出して、メニュー項目を追加していきます。ここでは、「サイドバーを表示」というメニュー項目で'showSidebar'関数を呼び出すようにしてあります。


4. メニューの組み込み

addon.addToUi();

メニューが作成できたら、Menuオブジェクトの「addToUi」メソッドを呼び出し、メニューを組み込んで作業終了です。


――実際にスクリプトを見れば気づくことですが、これはUiオブジェクトによるオリジナルメニュー作成の処理とほとんど同じです。Menuオブジェクト生成に新たに用意されたcreateAddonMenuというのを利用しているだけです。


※Uiオブジェクトによるオリジナルメニュー作成
http://libro.tuyano.com/index3?id=1189003&page=2

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

function onOpen() {
  var ui = SpreadsheetApp.getUi();
  var addon = ui.createAddonMenu();
  addon.addItem('サイドバーを表示', 'showSidebar');
  addon.addToUi();
}

function onInstall() {
  onOpen();
}

function showSidebar() {
  var ui = SpreadsheetApp.getUi();
  var sidebar = HtmlService.createHtmlOutputFromFile('Sidebar');
  sidebar.setTitle('マイ・アドオン');
  ui.showSidebar(sidebar);
}

function hello(msg){
  var ui = SpreadsheetApp.getUi();
  var re = ui.alert("Message", msg + 'さん、こんにちは！', ui.ButtonSet.OK);
}