Como alterar opções padrão na Interface do Usuário para visualização de impressão (HTML)

  • Artigo

[ Este artigo destina-se aos desenvolvedores do Windows 8.x e do Windows Phone 8.x que escrevem aplicativos do Windows Runtime. Se você estiver desenvolvendo para o Windows 10, consulte documentação mais recente]

Este tutorial mostra como personalizar as opções de impressão na Interface do Usuário para visualização de impressão.

Por padrão, a Interface do Usuário para visualização de impressão mostra as seguintes opções:

colorMode copies orientation

 

Além das configurações anteriores, o Windows fornece várias outras opções de impressora comuns que você pode adicionar à Interface do Usuário para visualização de impressão. Veja a seguir essas outras opções comuns.

binding collation duplex holePunch
inputBin mediaSize mediaType nUp
printQuality staple    

 

Essas opções são definidas na classe standardPrintTaskOptions. Você pode adicionar ou remover opções na lista de opções exibida na interface do usuário para visualização de impressão. Também pode mudar a ordem de exibição dessas opções e definir as configurações padrão que são apresentadas para o usuário.

No entanto, as modificações feitas com o uso desse método só afetam a interface do usuário para visualização de impressão. O usuário sempre pode acessar todas as opções com suporte na impressora clicando em Mais configurações na interface do usuário para visualização de impressão.

Embora o seu aplicativo possa especificar qualquer opção de impressão para exibição, apenas aquelas com suporte na impressora selecionada serão apresentadas na interface do usuário para visualização de impressão. A interface do usuário para visualização de impressão não mostrará nenhuma opção para a qual não haja suporte na impressora selecionada.

Mapa: como este tópico está relacionado aos outros? Veja:

O que você precisa saber

Tecnologias

Pré-requisitos

  • Você precisa ter familiaridade com HTML, JavaScript, eventos do Windows e manipulação de eventos.
  • É necessário ter o Microsoft Visual Studio instalado.
  • É necessário ter uma impressora instalada.
  • É necessário ter um aplicativo da Windows Store ao qual você queira adicionar um botão de impressão. Se você não tem o seu próprio aplicativo, pode baixar e usar o aplicativo de amostra PrintSample.
  • Seu aplicativo já deve dar suporte à impressão básica do Windows. Se esse não for o caso, confira o Guia de início rápido: imprimindo a partir do seu aplicativo para saber como adicionar o suporte para impressão básica do Windows ao seu aplicativo.

Instruções

Etapa 1: Abrir o aplicativo no Visual Studio

O procedimento descrito neste tutorial refere-se ao aplicativo PrintSampleJS do aplicativo de amostra PrintSample. Se você estiver personalizando a interface do usuário para visualização de impressão do seu próprio aplicativo, abra esse aplicativo no Visual Studio em vez do aplicativo de amostra PrintSample.

  1. Abra o aplicativo de amostra PrintSample e baixe o exemplo para JavaScript no seu computador.
  2. No Visual Studio, clique em File > Open Project e vá para a pasta que contém o arquivo de solução do aplicativo de amostra que você baixou na etapa anterior.
  3. Selecione o arquivo de solução PrintSampleJS e clique em Abrir.

Etapa 2: Compilar e testar o aplicativo

  1. Clique em Compilar > Compilar Solução para compilar o aplicativo no qual você está trabalhando. Verifique se não há mensagens de erro no painel Saída localizado na parte inferior da tela.
  2. Clique em Depurar > Iniciar sem Depuração.
  3. Verifique se, depois de alguns segundos, a tela exibe o aplicativo Amostra de Impressão JS.
  4. Se o aplicativo for executado sem erros, retorne ao Visual Studio e clique em Depurar > Parar Depuração.

Etapa 3: Definir as opções de impressão para exibição

Quando a tela do aplicativo estiver carregada, ela se registrará para o contrato do botão Imprimir. Parte desse registro inclui definir o manipulador de eventos PrintTaskRequested. O código para personalizar as opções exibidas na interface de usuário para visualização da impressão é adicionado ao manipulador de eventos PrintTaskRequested.

Modifique o manipulador de eventos PrintTaskRequested de forma a incluir as instruções printTask.options que definem as configurações de impressão que você quer exibir na interface do usuário para visualização da impressão.

  1. Encontre o manipulador de eventos PrintTaskRequested no aplicativo. No aplicativo de amostra PrintSample, o manipulador de eventos PrintTaskRequested básico é semelhante ao exemplo a seguir.

    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. Adicione as opções de impressão que você quer exibir na interface do usuário para visualização da impressão. As opções aparecerão verticalmente na interface do usuário para visualização da impressão, na ordem em que você as adicionar. A primeira opção adicionada estará na parte superior, e o restante das opções virá abaixo, em sequência.

    Observação  Esse código é obtido de scenario3.js do aplicativo de amostra PrintSample. Se você estiver adicionando esse código ao seu aplicativo, atribua as opções de impressão que você quer exibir para o usuário na interface do usuário para visualização da impressão.

     

    Importante  Chamar printTask.options.displayedOptions.clear() remove todas as opções de impressão da interface do usuário para visualização da impressão, deixando apenas o link Mais configurações. Não deixe de usar o método append para especificar as opções que você quer mostrar na interface do usuário para visualização da impressão.

     

    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. Compile e teste seu aplicativo, conforme descrito anteriormente.

Comentários

Para conhecer mais cenários de impressão em aplicativos da Windows Store, confira o aplicativo de amostra PrintSample.

Tópicos relacionados

Exemplo de impressão de aplicativo da Windows Store

Guia de início rápido: imprimindo a partir do seu aplicativo

Práticas recomendadas para desenvolver aplicativos da Windows Store com capacidade de impressão