クイック スタート: アプリからの印刷 (HTML)

  • [アーティクル]

[この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、 「最新のドキュメント」をご覧ください]

このクイック スタートでは、印刷機能を Windows ストア アプリに追加する最も簡単な方法について説明します。

プロセスの概要については、このビデオをご覧ください。

Windows ストア アプリからの印刷を最も簡単に行うには、Windows 印刷機能を使います。それには、アプリで次のことを行う必要があります。

  • 印刷コントラクトに登録します。これは、ユーザーによる印刷を可能にするアプリの各表示で行います。

    印刷コントラクトへの登録では、PrintManager オブジェクトを取得し、PrintTask オブジェクトを作り、印刷イベントを処理します。

  • 印刷する書式付きコンテンツを用意します。

    このクイック スタートで説明する既定の印刷エクスペリエンスでは、Windows でアプリの画面表示を印刷します。

    注  独自の印刷機能 (特定のページを印刷するなど) や印刷設定を Windows ストア アプリに追加するには、C++、C#、Visual Basic のいずれかと XAML を使う必要があります。アプリへの独自の印刷機能の追加について詳しくは、「印刷 (XAML)」をご覧ください。

     

必要条件

  • HTML、JavaScript、Windows イベント、イベント処理について理解している必要があります。
  • Microsoft Visual Studio がインストールされている必要があります。
  • プリンターがインストールされている必要があります。
  • 印刷機能の追加先となるアプリが存在している必要があります。独自のアプリがない場合は、印刷サンプルのサンプル アプリをダウンロードして使うことができます。注  このクイック スタートの例は、印刷サンプルのサンプル アプリで確認できます。  

手順

1. 編集のためにアプリのソース コードを開く

この手順では、印刷サンプルのサンプル アプリの PrintSampleJS アプリを開く方法について説明します。独自のアプリを使う場合は、Visual Studio で開き、次の手順に進んでください。

  1. 印刷サンプルのサンプル アプリを開き、コンピューターに JavaScript の例をダウンロードします。
  2. Visual Studio で、[File]、[Open Project] の順にクリックし、前の手順でダウンロードしたサンプル アプリのソリューション ファイルが格納されているフォルダーに移動します。
  3. PrintSampleJS ソリューション ファイルを選び、[開く] をクリックします。

2. アプリをビルドしてテストする

  1. [ビルド]、[ソリューションのビルド] の順にクリックし、作業するアプリをビルドします。画面下部の [出力] ウィンドウにエラー メッセージが表示されていないことを確かめます。
  2. [デバッグ]、[デバッグなしで開始] の順にクリックします。
  3. 数秒間待ち、画面に Print JS Sample アプリが表示されたことを確認します。
  4. アプリがエラーなしで実行された場合は、Visual Studio に戻り、[デバッグ]、[デバッグの停止] の順にクリックします。

3. Windows 印刷機能に登録する

この時点で、何かコンテンツが含まれる画面を表示するアプリが存在しています。

アプリに印刷機能を追加する最初の手順は、印刷コントラクトへの登録です。アプリは、ユーザーによる印刷を可能にするすべての画面でこの処理を行う必要があります。

注  ユーザーに表示される画面のみ、印刷登録を行うことができます。アプリの画面を印刷登録した場合は、画面終了時に印刷登録を解除する必要があります。別の画面で置き換えられる場合は、その画面が開いたときに画面を新しい印刷コントラクトに登録する必要があります。

 

印刷コントラクトへの登録とは、PrintManager オブジェクトを取得し、PrintTaskRequested イベントのハンドラーを定義するという意味です。

  1. 印刷するアプリの各画面に、画面が開いたときに実行されるように次のコードを追加します。PrintSampleJS サンプル アプリでは、これは画面を作るために呼び出される WinJS.UI.Pages.define 関数への members パラメーターの ready メンバーで行われます。

    var printManager = Windows.Graphics.Printing.PrintManager.getForCurrentView();
printManager.onprinttaskrequested = onPrintTaskRequested;

    注  このコードを、PrintSampleJS サンプル アプリが行うように別の関数に含めることができます。

     

  2. 対象画面の印刷タスク イベント ハンドラーを追加します。たとえば、印刷用に異なる書式をコンテンツに設定する必要がある場合など、アプリの各画面で異なる関数が必要になることがあります。

    この PrintSampleJS アプリには、次のように完了ハンドラーが含まれています。エラー発生の有無をユーザーに知らせ、考えられる解決策を提供することが可能になるため、完了イベントを処理することをお勧めします。同様に、完了イベントを使うと、印刷ジョブが正常に終了した後でユーザーが実行する手順を提示することができます。

    function onPrintTaskRequested(printEvent) {
    var printTask = printEvent.request.createPrintTask("Print Sample", function (args) {
        args.setSource(MSApp.getHtmlPrintDocumentSource(document));

        // Register the handler for print task completion event
        printTask.oncompleted = onPrintTaskCompleted;
    });
}

    function onPrintTaskCompleted(printTaskCompletionEvent) {
    // Notify the user about the failure
    if (printTaskCompletionEvent.completion === Windows.Graphics.Printing.PrintTaskCompletion.failed) {
        WinJS.log && WinJS.log("Failed to print.", "sample", "error");
    }
}

  3. 上記で説明した方法でアプリをビルドし、テストします。

4. アプリから印刷する

アプリの変更とビルドが終わったら、デバッガーで新しい機能をテストします。

  1. [デバッグ]、[デバッグの開始] の順にクリックします。
  2. 数秒間待ち、画面に Print JS Sample アプリが表示されたことを確認します。
  3. 画面の右端からスワイプして、チャームを表示します。
  4. デバイス チャームを選びます。
  5. プリンターを選びます。印刷ウィンドウが表示されます。
  6. 印刷ウィンドウの [印刷] をクリックして、現在の画面のコンテンツを印刷します。
  7. 印刷結果を確認します。

要約と次のステップ

このクイック スタートでは、ユーザーがアプリを操作する方法やアプリのコンテンツを印刷用に書式設定する方法を変更することなく、アプリに Windows 印刷機能を追加しました。

この後は、より高度な印刷機能について調べることができます。「アプリ内印刷ボタンを使って印刷する方法」では、Windows ストア アプリからクリック操作で印刷できるように印刷ボタンを追加します。

注  

JavaScript 関数 window.print() を使ってアプリのコンテンツを印刷できますが、window.print() は既定の印刷エクスペリエンスを使って画面に表示されているコンテンツを印刷するためのものです。Windows ストア アプリ画面は常に良好な印刷出力を生成するとは限らないため、window.print() を呼び出すことは必ずしも最善のアプローチとは言えません。これらのトピックで説明するように、最高のカスタマー エクスペリエンスのため、Windows ランタイム関数を使って印刷コントラクトに登録することをお勧めします。

 

Windows ストア アプリで利用可能な印刷シナリオについて詳しくは、印刷サンプルのサンプル アプリに関するページをご覧ください。

関連トピック

印刷サンプルのサンプル アプリ

印刷できる Windows ストア アプリの開発のベスト プラクティス

プリンター用 Windows ストア デバイス アプリの開発