PowerPoint アドイン

  • [アーティクル]

PowerPoint アドインを使用して Windows、iPad、Mac、およびブラウザー上など、複数のプラットフォームでのユーザーのプレゼンテーション用に魅力的なソリューションを構築できます。 次の 2 種類の PowerPoint アドインを作成できます。

  • コンテンツ アドインを使うと、プレゼンテーションに HTML5 の動的コンテンツが追加されます。 たとえば PowerPoint のための LucidChart ダイアグラム アドインでは、これを使って LucidChart からデッキにインタラクティブな図を挿入することができます。

  • 作業ウィンドウ アドインを使えば、サービスを介して、参照情報を取り込んだり、プレゼンテーションにデータを挿入したりすることができます。 たとえば Pexels - 無料ストックフォト アドインでは、これを使ってプロの写真をプレゼンテーションに追加することができます。

PowerPoint アドインのシナリオ

この記事で紹介するコード例では、PowerPoint のアドインの開発のための基本的なタスクをいくつか示します。 以下のことに注意してください。

  • 情報を表示するために、これらの例は app.showNotification 関数を使用します。これは、Visual Studio の Office アドイン プロジェクト テンプレートに含まれています。 アドインを開発するのに Visual Studio を使用していない場合は、showNotification 関数を独自のコードに置き換える必要があります。

  • これらの例のいくつかでは、これらの関数のスコープを Globals 超えて宣言された オブジェクトも次のように使用します。 var Globals = {activeViewHandler:0, firstSlideId:0};

  • これらの例を使用するには、アドイン プロジェクトで Office.js v1.1 ライブラリ以降を参照する必要があります。

プレゼンテーションのアクティブ ビューの検出と ActiveViewChanged イベントの処理を行う

コンテンツ アドインをビルドする場合は、プレゼンテーションのアクティブ ビューを取得して、Office.Initialize ハンドラーの一部として、ActiveViewChanged イベントを処理する必要があります。

注:

PowerPoint on the web では Document.ActiveViewChanged イベントは、スライド ショー モードが新しいセッションとして扱われるようには起動しません。 この場合、次のコード サンプルに示すように、アドインで読み込むアクティブ ビューをフェッチする必要があります。

コード サンプルは次のとおりです。

  • この関数は getActiveFileViewDocument.getActiveViewAsync メソッドを呼び出して、プレゼンテーションの現在のビューが "編集" ( 標準 ビューや アウトライン ビューなど、スライドを編集できるビューのいずれか) か "読み取り" (スライド ショー または 閲覧ビュー) かを返します。

  • 関数は registerActiveViewChangedaddHandlerAsync メソッドを呼び出して Document.ActiveViewChanged イベントのハンドラーを登録します。

//general Office.initialize function. Fires on load of the add-in.
Office.initialize = function(){

    //Gets whether the current view is edit or read.
    const currentView = getActiveFileView();

    //register for the active view changed handler
    registerActiveViewChanged();

    //render the content based off of the currentView
    //....
}

function getActiveFileView()
{
    Office.context.document.getActiveViewAsync(function (asyncResult) {
        if (asyncResult.status == "failed") {
            app.showNotification("Action failed with error: " + asyncResult.error.message);
        }
        else {
            app.showNotification(asyncResult.value);
        }
    });

}

function registerActiveViewChanged() {
    Globals.activeViewHandler = function (args) {
        app.showNotification(JSON.stringify(args));
    }

    Office.context.document.addHandlerAsync(Office.EventType.ActiveViewChanged, Globals.activeViewHandler,
        function (asyncResult) {
            if (asyncResult.status == "failed") {
                app.showNotification("Action failed with error: " + asyncResult.error.message);
            }
            else {
                app.showNotification(asyncResult.status);
            }
        });
}

次のコード サンプルでは、getSelectedRange 関数は Document.getSelectedDataAsync メソッドを呼び出して、asyncResult.value によって返される JSON オブジェクトを取得します。このオブジェクトには、slides という名前の配列が含まれます。 slidesslides 配列には、選択した範囲のスライド (複数のスライドが選択されていない場合は現在のスライド) の ID、タイトル、およびインデックスが含まれます。 また、選択範囲内の最初のスライド ID をグローバル変数に保存します。

function getSelectedRange() {
    // Get the id, title, and index of the current slide (or selected slides) and store the first slide id */
    Globals.firstSlideId = 0;

    Office.context.document.getSelectedDataAsync(Office.CoercionType.SlideRange, function (asyncResult) {
        if (asyncResult.status == "failed") {
            app.showNotification("Action failed with error: " + asyncResult.error.message);
        }
        else {
            Globals.firstSlideId = asyncResult.value.slides[0].id;
            app.showNotification(JSON.stringify(asyncResult.value));
        }
    });
}

次のコード サンプルでは、goToFirstSlide 関数は Document.goToByIdAsync メソッドを呼び出して、前に示した getSelectedRange 関数で識別された最初のスライドに移動します。

function goToFirstSlide() {
    Office.context.document.goToByIdAsync(Globals.firstSlideId, Office.GoToType.Slide, function (asyncResult) {
        if (asyncResult.status == "failed") {
            app.showNotification("Action failed with error: " + asyncResult.error.message);
        }
        else {
            app.showNotification("Navigation successful");
        }
    });
}

次のコード サンプルでは、goToSlideByIndex 関数は Document.goToByIdAsync メソッドを呼び出して、プレゼンテーションの次のスライドに移動します。

function goToSlideByIndex() {
    const goToFirst = Office.Index.First;
    const goToLast = Office.Index.Last;
    const goToPrevious = Office.Index.Previous;
    const goToNext = Office.Index.Next;

    Office.context.document.goToByIdAsync(goToNext, Office.GoToType.Index, function (asyncResult) {
        if (asyncResult.status == "failed") {
            app.showNotification("Action failed with error: " + asyncResult.error.message);
        }
        else {
            app.showNotification("Navigation successful");
        }
    });
}

プレゼンテーションの URL を取得する

次のコード サンプルでは、 関数は getFileUrlDocument.getFileProperties メソッドを呼び出して、プレゼンテーション ファイルの URL を取得します。

function getFileUrl() {
    //Get the URL of the current file.
    Office.context.document.getFilePropertiesAsync(function (asyncResult) {
        const fileUrl = asyncResult.value.url;
        if (fileUrl == "") {
            app.showNotification("The file hasn't been saved yet. Save the file and try again");
        }
        else {
            app.showNotification(fileUrl);
        }
    });
}

プレゼンテーションの作成

アドインでは、アドインが現在実行されている PowerPoint のインスタンスとは異なる新しいプレゼンテーションを作成できます。 PowerPoint の名前空間には、この目的のための createPresentation メソッドがあります。 このメソッドが呼び出されると、新しいプレゼンテーションが PowerPoint の新しいインスタンスですぐに開いて表示されます。 アドインは前のプレゼンテーションで開いて実行されたままになります。

PowerPoint.createPresentation();

createPresentation メソッドでは既存のプレゼンテーションのコピーの作成もできます。 このメソッドは、オプションのパラメーターとして .pptx ファイルの base64 エンコード文字列表現を受け取ります。 文字列の引数は有効な .pptx ファイルと見なされ、作成されるプレゼンテーションはそのファイルのコピーになります。 次の例に示すように、FileReader クラスを使用して、ファイルを必要な base64 エンコード文字列に変換できます。

const myFile = document.getElementById("file");
const reader = new FileReader();

reader.onload = function (event) {
    // strip off the metadata before the base64-encoded string
    const startIndex = reader.result.toString().indexOf("base64,");
    const copyBase64 = reader.result.toString().substr(startIndex + 7);

    PowerPoint.createPresentation(copyBase64);
};

// read in the file as a data URL so we can parse the base64-encoded string
reader.readAsDataURL(myFile.files[0]);

関連項目