Condividi tramite


Come modificare le opzioni standard nell'interfaccia utente dell'anteprima di stampa (HTML)

[ Questo articolo è rivolto agli sviluppatori per Windows 8.x e Windows Phone 8.x che realizzano app di Windows Runtime. Gli sviluppatori che usano Windows 10 possono vedere Documentazione aggiornata ]

Questa esercitazione mostra come personalizzare le opzioni di stampa visualizzate nell'interfaccia utente dell'anteprima di stampa.

Per impostazione predefinita, nell'interfaccia utente dell'anteprima di stampa vengono visualizzate le opzioni seguenti:

colorMode copies orientation

 

Oltre alle impostazioni precedenti, Windows offre agli sviluppatori molte altre opzioni comuni per la stampante che puoi aggiungere all'interfaccia utente dell'anteprima di stampa. Di seguito sono riportate le altre opzioni comuni:

binding collation duplex holePunch
inputBin mediaSize mediaType nUp
printQuality staple    

 

Queste opzioni sono definite nella classe standardPrintTaskOptions. Puoi aggiungere o rimuovere opzioni dall'elenco visualizzato nell'interfaccia utente dell'anteprima di stampa. Puoi inoltre modificare l'ordine in cui vengono visualizzate e definire le impostazioni predefinite mostrate all'utente.

Tuttavia, le modifiche che apporti con questo metodo hanno effetto solo sull'interfaccia utente dell'anteprima di stampa. L'utente può sempre accedere a tutte le altre opzioni supportate dalla stampante facendo clic su Altre impostazioni nell'interfaccia utente dell'anteprima di stampa.

Anche se puoi specificare qualsiasi opzione di stampa da visualizzare nella tua app, nell'interfaccia utente dell'anteprima di stampa verranno visualizzate solo quelle supportate dalla stampante selezionata. L'interfaccia utente dell'anteprima di stampa non mostrerà opzioni non supportate dalla stampante selezionata.

Roadmap: che relazione c'è tra questo argomento e gli altri? Vedi:

Cosa sapere

Tecnologie

Prerequisiti

  • Devi avere familiarità con il linguaggio HTML, JavaScript, gli eventi di Windows e la gestione di eventi.
  • Deve essere installato Microsoft Visual Studio.
  • Deve essere installata una stampante.
  • Devi avere un'app di Windows Store a cui aggiungere un pulsante di stampa. Se non disponi di un'app, puoi scaricare e usare l'app di esempio per la stampa.
  • L'app deve già supportare le funzionalità di stampa di base di Windows. In caso contrario, vedi Guida introduttiva: Stampa dall'app per scoprire come aggiungere il supporto delle funzionalità di stampa di base di Windows alla tua app.

Istruzioni

Passaggio 1: Aprire l'app in Visual Studio

La procedura descritta in questa esercitazione fa riferimento all'app PrintSampleJS tratta dall'app di esempio PrintSample. Se personalizzi l'interfaccia utente dell'anteprima di stampa della tua app, apri l'app in Visual Studio invece di aprire l'app di esempio PrintSample.

  1. Apri l'app di esempio per la stampa e scarica l'esempio in JavaScript nel computer.
  2. In Visual Studio fai clic su File > Open Project e passa alla cartella contenente il file della soluzione per l'app di esempio scaricato nel passaggio precedente.
  3. Seleziona il file della soluzione PrintSampleJS e fai clic su Apri.

Passaggio 2: Compila l'app ed eseguine il test

  1. Fai clic su Compila > Compila soluzione per compilare l'app su cui stai lavorando. Assicurati che non ci siano messaggi di errore nel riquadro Output in fondo allo schermo.
  2. Fai clic su Debug > Avvia senza debug.
  3. Verifica che dopo alcuni secondi sullo schermo venga visualizzata l'app esempio di stampa JS.
  4. Se l'app viene eseguita senza errori, torna a Visual Studio e fai clic su Debug > Termina debug.

Passaggio 3: Definisci le opzioni di stampa da visualizzare

Dopo il caricamento, l'app si registra per il contratto Stampa. Il processo di registrazione include la definizione del gestore dell'evento PrintTaskRequested. Il codice per personalizzare le opzioni visualizzate nell'interfaccia utente dell'anteprima di stampa viene aggiunto al gestore dell'evento PrintTaskRequested.

Modifica il gestore dell'evento PrintTaskRequested per includere le istruzioni printTask.options che configurano le impostazioni di stampa da visualizzare nell'interfaccia utente dell'anteprima di stampa.

  1. Individua il gestore dell'evento PrintTaskRequested nell'app. Nell'app di esempio di stampa il gestore dell'evento PrintTaskRequested di base è come mostrato nell'esempio.

    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");
        }
    }
    
  2. Aggiungi le opzioni di stampa da visualizzare nell'interfaccia utente dell'anteprima di stampa. Le opzioni verranno visualizzate in verticale, nell'ordine in cui le aggiungi. La prima opzione che aggiungi verrà visualizzata all'inizio e le altre al di sotto in sequenza.

    Nota  Questo codice si trova in scenario3.js nell'app di esempio di stampa. Se aggiungi questo codice alla tua app, assegna le opzioni che vuoi rendere visibili all'utente nell'interfaccia utente dell'anteprima di stampa.

     

    Importante  La chiamata a printTask.options.displayedOptions.clear() rimuove tutte le opzioni dall'interfaccia utente dell'anteprima di stampa, lasciando solo il link Altre impostazioni. Assicurati di usare il metodo append per specificare le opzioni da visualizzare nell'interfaccia utente dell'anteprima di stampa.

     

    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;
        });
    }
    
  3. Compila la tua app ed eseguine il test come descritto in precedenza.

Osservazioni

Per altri scenari di stampa delle app di Windows Store, vedi l'app di esempio di stampa.

Argomenti correlati

Esempio di stampa in un'app di Windows Store

Guida introduttiva: Stampa dall'app.

Procedure consigliate per lo sviluppo di app di Windows Store che supportano la stampa