前回の記事は“Office アドイン”のAdvent calendarに乱入したにも関わらず、VBAのコードを載せるという暴挙に出ていたので、今回は真っ当に「Office アドイン」について記事を書こうと思います。
Office アドイン(旧Office 用アプリ)といえば、これまで「挿入」タブからアドインを組み込み、作業ウィンドウやドキュメント本文内に貼りついたアドインコンテンツから機能を実行する、といった流れでしたが、Office 2016でついにリボンUI(既存タブやカスタムタブ)から機能を実行できるようになりました(アドイン コマンド(Add-In Commands))。
(といっても 2015/12/8 時点では、先行リリースの 16.6366.0000 以上のバージョンが必要です。)
この新しい機能については、Connect(); // 2015のセッション動画を見ていただければ概要が掴めるかと思います。
Office Onlineやデスクトップ版のOfficeで、カスタムタブからOffice アドインの機能を呼び出しているのが分かりますね！
実はこの機能、Outlookではすでに実装されていて、国分すばる氏のブログに詳細な記事が載っています。
- Mail Add-ins の add-in command (カスタム Ribbon ボタン)
- https://netweblog.wordpress.com/2015/08/26/ribbon-addin-command-of-office-addins/
GitHubのOverviewによると、WordやExcelだけでなくPowerPointでも近いうちに実装されるようです。
正式リリースが今から待ち遠しいですね！！
さて、アドイン コマンド(こう書いてはいますが日本語の正式名称は未だ分かりません)を簡単に紹介したところで、実際にコードを書いて動作を確認していきたいと思います。
下準備
- 上でも書いた通り、現時点ではまだ先行リリースでないと機能を使うことができないため、Install the latest version of Office 2016 applicationsを参考に、最新版のOffice 2016をインストールします。
- インストール作業が終了したら、GitHubから「EnableAppCmdXLWD.zip」ファイルをダウンロードします。
- 「EnableAppCmdXLWD.zip」ファイルの中にある「EnableAppCmdXLWD.reg」を実行してレジストリにキー登録をします。
- アドインのテストには“共有フォルダ”を使用するので、「OfficeJS Snippet Explorerを使って新しいOffice アドインを体験する」記事を参考に、共有フォルダとOfficeの設定を行います。
Office アドインのコード
準備作業が終了したら下記マニフェストファイルとアドイン本体となるWebページを作成し、適当な場所に配置します。
・マニフェストファイル
※ Id要素の値は「GUIDを作成するVBScript」などで作成した値を使用してください。
<?xml version="1.0" encoding="utf-8"?>
<OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0"
xmlns:ov="http://schemas.microsoft.com/office/taskpaneappversionoverrides"
xsi:type="TaskPaneApp">
<Id>93848143-6ae0-4b56-b7c6-dbb5344c7933</Id>
<Version>1.0.0.0</Version>
<ProviderName>kinuasa</ProviderName>
<DefaultLocale>ja-JP</DefaultLocale>
<DisplayName DefaultValue="Sample Command App" />
<Description DefaultValue="Sample Command App Description" />
<Hosts>
<Host Name="Document" />
</Hosts>
<DefaultSettings>
<SourceLocation DefaultValue="https://localhost/command/index.html" />
</DefaultSettings>
<Permissions>ReadWriteDocument</Permissions>
<VersionOverrides xmlns="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="VersionOverridesV1_0">
<Hosts>
<Host xsi:type="Document">
<DesktopFormFactor>
<FunctionFile resid="residDesktopFuncUrl" />
<ExtensionPoint xsi:type="PrimaryCommandSurface">
<OfficeTab id="TabHome">
<Group id="grpSample">
<Label resid="residGrpSampleLabel" />
<Icon>
<bt:Image size="16" resid="residIcon1_16" />
<bt:Image size="32" resid="residIcon1_32" />
<bt:Image size="80" resid="residIcon1_80" />
</Icon>
<Control xsi:type="Button" id="btnSample">
<Label resid="residBtnSampleLabel" />
<Supertip>
<Title resid="residBtnSampleTitle" />
<Description resid="residBtnSampleDesc" />
</Supertip>
<Icon>
<bt:Image size="16" resid="residIcon2_16" />
<bt:Image size="32" resid="residIcon2_32" />
<bt:Image size="80" resid="residIcon2_80" />
</Icon>
<Action xsi:type="ShowTaskpane">
<SourceLocation resid="residTaskpaneUrl" />
</Action>
</Control>
<Control xsi:type="Button" id="btnSample2">
<Label resid="residBtnSampleLabel2" />
<Supertip>
<Title resid="residBtnSampleTitle2" />
<Description resid="residBtnSampleDesc2" />
</Supertip>
<Icon>
<bt:Image size="16" resid="residIcon2_16" />
<bt:Image size="32" resid="residIcon2_32" />
<bt:Image size="80" resid="residIcon2_80" />
</Icon>
<Action xsi:type="ExecuteFunction">
<FunctionName>btnSample2_onAction</FunctionName>
</Action>
</Control>
</Group>
<Label resid="residGrpSampleLabel" />
</OfficeTab>
</ExtensionPoint>
</DesktopFormFactor>
</Host>
</Hosts>
<Resources>
<bt:Images>
<bt:Image id="residIcon1_16" DefaultValue="https://localhost/command/img/ico1_16.png" />
<bt:Image id="residIcon1_32" DefaultValue="https://localhost/command/img/ico1_32.png" />
<bt:Image id="residIcon1_80" DefaultValue="https://localhost/command/img/ico1_80.png" />
<bt:Image id="residIcon2_16" DefaultValue="https://localhost/command/img/ico2_16.png" />
<bt:Image id="residIcon2_32" DefaultValue="https://localhost/command/img/ico2_32.png" />
<bt:Image id="residIcon2_80" DefaultValue="https://localhost/command/img/ico2_80.png" />
</bt:Images>
<bt:Urls>
<bt:Url id="residDesktopFuncUrl" DefaultValue="https://localhost/command/func.html" />
<bt:Url id="residTaskpaneUrl" DefaultValue="https://localhost/command/index.html" />
</bt:Urls>
<bt:ShortStrings>
<bt:String id="residGrpSampleLabel" DefaultValue="Sample Group" />
<bt:String id="residBtnSampleLabel" DefaultValue="Sample Button" />
<bt:String id="residBtnSampleLabel2" DefaultValue="Sample Button 2" />
<bt:String id="residBtnSampleTitle" DefaultValue="Sample Button SuperTip Title" />
<bt:String id="residBtnSampleTitle2" DefaultValue="Sample Button 2 SuperTip Title" />
</bt:ShortStrings>
<bt:LongStrings>
<bt:String id="residBtnSampleDesc" DefaultValue="Sample Button SuperTip Description" />
<bt:String id="residBtnSampleDesc2" DefaultValue="Sample Button 2 SuperTip Description" />
</bt:LongStrings>
</Resources>
</VersionOverrides>
</OfficeApp>
・index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>Sample</title>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js"></script>
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
<script>
Office.initialize = function(reason){}
$(function(){
$("#btnTest").click(function(){
Word.run(function(context){
context.document.body.insertHtml("<h1>Hello world.</h1>", Word.InsertLocation.start);
});
});
});
</script>
</head>
<body>
<h4>Sample Page</h4>
<input id="btnTest" type="button" value="Test">
</body>
</html>
・func.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title>Functions</title>
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
<script>
Office.initialize = function(reason){}
function btnSample2_onAction(event){
var buttonId = event.source.id;
Word.run(function(context){
context.document.body.insertText(buttonId, Word.InsertLocation.start);
});
event.completed();
}
</script>
</head>
</html>
アドインの実行
- マニフェストファイルとアドイン本体の設定終了後、Wordを起動すると、「挿入」タブの「マイ アドイン」から作成したアドインを挿入することができます。
- 「ホーム」タブを開くと、マニフェストファイルで定義したグループ(Sample Group)が追加されていることが確認できます。
- 「Sample Button」をクリックすると、ShowTaskpane Actionが実行され、SourceLocation要素のresid属性で指定したWebページが作業ウィンドウに表示されます。
- 「Sample Button2」をクリックすると、ExecuteFunction Actionが実行され、FunctionName要素で指定した関数「btnSample2_onAction」が呼び出されます。
マニフェストファイルの各要素については詳しく解説しませんが、ザックリいうと、VersionOverrides要素以下でアドイン コマンドを定義
↓
ExtensionPoint要素以下でタブやグループ設定
↓
ラベルやツールチップ等はResources要素で定義(id属性の値の文字数制限(32文字)に注意)
といった感じですね。
通常のリボン・カスタマイズ(customUI)に比べると煩雑で実に面倒くさいです。
詳しい説明に関しては下記サイトに記載されているので、そちらを是非ご参照ください。
参考Webページ
- Office Add-in Commands Samples
- https://github.com/OfficeDev/Office-Add-in-Commands-Samples
- Outlook-Add-in-Commands-Translator
- https://github.com/OfficeDev/Outlook-Add-in-Commands-Translator
- Add-in Command Demo Outlook Add-in
- https://github.com/jasonjoh/command-demo
- Create add-in commands in your manifest for Excel 2016 and Word 2016 (Preview)
- https://msdn.microsoft.com/ja-jp/library/mt621545.aspx
- アドインで必要な Office ホストと API を指定する
- https://msdn.microsoft.com/ja-jp/library/dn535871.aspx
この記事へのコメントはありません。