特集
» 2016年01月15日 05時00分 公開

Office 2016におけるOfficeアドイン進化のポイント特集:Officeストアで世界に飛び出そう! 最新Officeアプリ開発入門(4/4 ページ)

[国分すばる,著]
前のページへ 1|2|3|4       

作業ウィンドウの表示

 上記のアドインコマンドでは、リボンに配置したボタンを押した際にJavaScriptコードを実行しているが、ボタンを押した際に作業ウィンドウ(Task pane)を表示するには、下記の通り、リボンに配置するボタン(<Control xsi:type="Button">要素)の<Action>要素のxsi:type属性に「ShowTaskpane」と指定する(太字が追加したコードだ)。

<VersionOverrides
  xmlns="http://schemas.microsoft.com/office/mailappversionoverrides"
  xsi:type="VersionOverridesV1_0">

  <!-- 途中は省略する (上記参照) -->

  <Hosts>
    <Host xsi:type="MailHost">

      <DesktopFormFactor>
        <FunctionFile resid="residFuncUrl" />

        <ExtensionPoint xsi:type="MessageReadCommandSurface">
          <OfficeTab id="TabDefault">
            <Group id="msgreadTabMessage.grp1">
              <Label resid="residLabel" />
              <Tooltip resid="residLabelTip" />

              <Control xsi:type="Button" id="button1id">
                <Label resid="residUILessButton" />
                <Tooltip resid="residTip" />
                <Supertip>
                  <Title resid="residSuperTipTitle" />
                  <Description resid="residSuperTipDesc" />
                </Supertip>
                <Icon>
                  <bt:Image size="16" resid="icon1" />
                  <bt:Image size="32" resid="icon2" />
                  <bt:Image size="80" resid="icon3" />
                </Icon>
                <Action xsi:type="ExecuteFunction">
                  <FunctionName>showTest</FunctionName>
                </Action>
              </Control>
 
              <Control xsi:type="Button" id="button2id">
                <Label resid="residTaskpaneButton" />
                <Tooltip resid="residTip" />
                <Supertip>
                  <Title resid="residSuperTipTitle" />
                  <Description resid="residSuperTipDesc" />
                </Supertip>
                <Icon>
                  <bt:Image size="16" resid="icon1" />
                  <bt:Image size="32" resid="icon2" />
                  <bt:Image size="80" resid="icon3" />
                </Icon>
                <Action xsi:type="ShowTaskpane">
                  <SourceLocation resid="residTaskpaneUrl" />
                </Action>
              </Control>

            </Group>
          </OfficeTab>
        </ExtensionPoint>
      </DesktopFormFactor>
    </Host>
  </Hosts>

  <Resources>
    <bt:Images>
      <bt:Image id="icon1"
        DefaultValue="https://addintest01.azurewebsites.net/myimg16.bmp" >
      </bt:Image>
      <bt:Image id="icon2"
        DefaultValue="https://addintest01.azurewebsites.net/myimg32.bmp" >
      </bt:Image>
      <bt:Image id="icon3"
        DefaultValue="https://addintest01.azurewebsites.net/myimg80.bmp">
      </bt:Image>
    </bt:Images>
    <bt:Urls>
      <bt:Url id="residFuncUrl"
        DefaultValue="https://addintest01.azurewebsites.net/myfunc.html" >
      </bt:Url>
      <bt:Url id="residTaskpaneUrl"
        DefaultValue="https://addintest01.azurewebsites.net/mypane.html" >
      </bt:Url>
    </bt:Urls>
    <bt:ShortStrings>
      <bt:String id="residLabel"
        DefaultValue="Test App">
      </bt:String>
      <bt:String id="residUILessButton"
        DefaultValue="Do Func">
      </bt:String>
      <bt:String id="residTaskpaneButton"
        DefaultValue="Show Pane">
      </bt:String>
      <bt:String id="residSuperTipTitle"
        DefaultValue="SuperTip Title">
      </bt:String>
    </bt:ShortStrings>
    <bt:LongStrings>
      <bt:String id="residDesc"
        DefaultValue="This is an add-in test.">
      </bt:String>
      <bt:String id="residLabelTip"
        DefaultValue="This is an add-in test.">
      </bt:String>
      <bt:String id="residTip"
        DefaultValue="Run Test app">
      </bt:String>
      <bt:String id="residSuperTipDesc"
        DefaultValue="Run Test App">
      </bt:String>
    </bt:LongStrings>
  </Resources>

</VersionOverrides>

クリックすると作業ウィンドウを表示するボタンをリボンに配置

 このようなマニフェストを記述すれば、[Show Pane]ボタンを押したときに、下図の通り、指定したUrlのページが作業ウィンドウ(Task pane)として表示される。

 もちろん、このWebページに、これまでのメールアドインのように、メールや予定と連携して動作する何らかの処理(JavaScriptコード)を埋め込んで使うこともできる。

リボンにある[Show Pane]ボタンをクリックすると、作業ウィンドウが表示される リボンにある[Show Pane]ボタンをクリックすると、作業ウィンドウが表示される

 Officeのマルチデバイス化(Windows以外のプラットフォームも含めた展開)の流れを受け、Officeアドインはますます重要性が増し、矢継ぎ早に機能拡張もされているので、さらに便利になっていくことに期待したい。

「特集:Officeストアで世界に飛び出そう! 最新Officeアプリ開発入門」のインデックス

特集:Officeストアで世界に飛び出そう! 最新Officeアプリ開発入門

前のページへ 1|2|3|4       

Copyright© Digital Advantage Corp. All Rights Reserved.

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。