So wird’s gemacht: Ändern von Standardoptionen auf der Druckvorschau-UI (HTML)

Artikel
12/12/2015

[ Dieser Artikel richtet sich an Windows 8.x- und Windows Phone 8.x-Entwickler, die Windows-Runtime-Apps schreiben. Wenn Sie für Windows 10 entwickeln, finden Sie weitere Informationen unter neueste Dokumentation]

In diesem Lernprogramm wird gezeigt, wie Sie die Druckoptionen in der Druckvorschau-UI anpassen.

Standardmäßig werden auf der Druckvorschau-UI die folgenden Optionen angezeigt:

colorMode

copies

orientation

Neben den oben genannten Einstellungen enthält Windows weitere allgemeine Druckeroptionen, die Sie der Druckvorschau-UI hinzufügen können. Diese weiteren allgemeinen Optionen lauten wie folgt.

binding	collation	duplex	holePunch
inputBin	mediaSize	mediaType	nUp
printQuality	staple

Diese Optionen sind in der standardPrintTaskOptions-Klasse definiert. Sie können in der Optionsliste, die in der Druckvorschau-Benutzeroberfläche angezeigt wird, Optionen hinzufügen oder entfernen. Sie können auch die Reihenfolge, in der die Optionen angezeigt werden, und die für den Benutzer angezeigten Standardeinstellungen ändern.

Die Änderungen, die Sie auf diese Weise vornehmen, betreffen allerdings nur die Druckvorschau-Benutzeroberfläche. Der Benutzer kann immer auf alle vom Drucker unterstützten Optionen zugreifen, indem er in der Druckvorschau-UI auf Weitere Einstellungen klickt.

Obwohl Sie in Ihrer App beliebige anzuzeigende Druckoptionen festlegen können, werden in der Druckvorschau-UI nur die vom ausgewählten Drucker unterstützten Optionen angezeigt. Die Druckvorschau-UI zeigt keine Optionen an, die der ausgewählte Drucker nicht unterstützt.

Roadmap: Wie hängt dieses Thema mit anderen zusammen? Informationen finden Sie unter:

Roadmap für Windows Store-Apps mit JavaScript

Wissenswertes

Technologien

Windows-Runtime

Voraussetzungen

Sie müssen mit HTML, JavaScript, Windows-Ereignissen und Ereignishandling vertraut sein.
Microsoft Visual Studio muss installiert sein.
Ein Drucker muss installiert sein.
Sie benötigen eine Windows Store-App, der Sie eine Druckschaltfläche hinzufügen möchten. Wenn Sie keine eigene App haben, können Sie die PrintSample-Beispiel-App herunterladen und diese verwenden.
Ihre App muss grundlegende Windows-Druckfunktionen unterstützen. Falls dies nicht der Fall ist, können Sie unter Schnellstart: Drucken in der App nachlesen, wie Sie Ihrer App Unterstützung für grundlegende Windows-Druckfunktionen hinzufügen.

Anweisungen

Schritt 1: Öffnen der App in Visual Studio

Das in diesem Lernprogramm beschriebene Verfahren bezieht sich auf die PrintSampleJS-App aus der Print Sample-Beispiel-App. Wenn Sie die Druckvorschau-UI Ihrer eigenen App anpassen, öffnen Sie anstelle der PrintSample-Beispiel-App Ihre App in Visual Studio.

Öffnen Sie die PrintSample-Beispiel-App, und laden Sie das JavaScript-Beispiel auf Ihren Computer herunter.
Klicken Sie in Visual Studio auf File > Open Project, und navigieren Sie zu dem Ordner, der die Projektmappendatei der im vorhergehenden Schritt heruntergeladenen Beispiel-App enthält.
Wählen Sie die Projektmappendatei PrintSampleJS aus, und klicken Sie auf Öffnen.

Schritt 2: Erstellen und Testen der App

Klicken Sie auf Erstellen > Projektmappe erstellen, um die App zu erstellen. Stellen Sie sicher, dass unten auf dem Bildschirm keine Fehlermeldungen im Ausgabebereich angezeigt werden.
Klicken Sie auf Debuggen > Starten ohne Debugging.
Vergewissern Sie sich, dass nach einigen Sekunden die App Print JS Sample angezeigt wird.
Wenn die App ohne Fehler ausgeführt wird, kehren Sie zu Visual Studio zurück, und klicken Sie auf Debuggen > Debugging beenden.

Schritt 3: Definieren der anzuzeigenden Druckoptionen

Wenn der Bildschirm der App geladen wird, wird die App für den Vertrag für "Drucken" registriert. Im Rahmen dieser Registrierung wird der PrintTaskRequested-Ereignishandler definiert. Der Code zum Anpassen der in der Druckvorschau-Benutzeroberfläche angezeigten Optionen wird dem PrintTaskRequested-Ereignishandler hinzugefügt.

Ändern Sie den PrintTaskRequested-Ereignishandler, um ihm die printTask.options-Anweisungen hinzuzufügen, mit denen die in der Druckvorschau-UI anzuzeigenden Druckeinstellungen konfiguriert werden.

Suchen Sie nach dem PrintTaskRequested-Ereignishandler in der App. In der PrintSample-Beispiel-App sieht der grundlegende PrintTaskRequested-Ereignishandler wie in diesem Beispiel aus.

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");
    }
}

Fügen Sie die Druckoptionen hinzu, die in der Druckvorschau-UI angezeigt werden sollen. Die Optionen erscheinen in der Druckvorschau-UI vertikal in der Reihenfolge, in der sie hinzugefügt wurden. Die erste Option, die Sie hinzufügen, wird ganz oben platziert, und der Rest wird der Reihe nach darunter eingefügt.

Hinweis Dieser Code stammt aus der Datei scenario3.js der PrintSample-Beispiel-App. Weisen Sie die Druckoptionen zu, die in der Druckvorschau-UI für den Benutzer angezeigt werden sollen, wenn Sie Ihrer App diesen Code hinzufügen.

Wichtig Wenn die printTask.options.displayedOptions.clear()-Methode aufgerufen wird, werden alle Druckoptionen aus der Druckvorschau-UI entfernt, sodass nur noch der Link Weitere Einstellungen angezeigt wird. Geben Sie mit der append-Methode die Optionen an, die in der Druckvorschau-UI angezeigt werden sollen.

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

        // Choose the printer options to be shown.
        // The order in which the options are appended determines the order in which they appear in the UI
        printTask.options.displayedOptions.clear();
        printTask.options.displayedOptions.append(Windows.Graphics.Printing.StandardPrintTaskOptions.copies);
        printTask.options.displayedOptions.append(Windows.Graphics.Printing.StandardPrintTaskOptions.mediaSize);
        printTask.options.displayedOptions.append(Windows.Graphics.Printing.StandardPrintTaskOptions.orientation);
        printTask.options.displayedOptions.append(Windows.Graphics.Printing.StandardPrintTaskOptions.duplex);

        // Preset the default value of the printer option
        printTask.options.mediaSize = Windows.Graphics.Printing.PrintMediaSize.northAmericaLegal;

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

Erstellen und testen Sie Ihre App wie oben beschrieben.

Anmerkungen

Weitere Druckszenarien für Windows Store-Apps finden Sie in der PrintSample-Beispiel-App.