Share via


Guia de início rápido: registrar um aplicativo para conteúdo de Reprodução Automática (HTML)

[ 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]

Você pode registrar aplicativos como opções de eventos de conteúdo de Reprodução Automática. Os eventos de conteúdo de Reprodução Automática ocorrem quando um dispositivo de volume, como um cartão de memória de câmera, um pen drive ou DVD, é inserido no computador.

Aqui mostramos como identificar o aplicativo como uma opção de Reprodução Automática quando um dispositivo de volume de uma câmera for inserido.

Objetivo: Criar um aplicativo para manipular um evento de conteúdo de Reprodução Automática.

Pré-requisitos

Microsoft Visual Studio

Instruções

1. Criar um novo projeto e adicione declarações da Reprodução Automática

  1. Abra o Visual Studio e selecione Novo Projeto no menu Arquivo. Na seção Javascript, selecione Windows Store. Nomeie o aplicativo AutoPlayDisplayOrCopyImages e clique em OK.

  2. Abra o arquivo Package.appxmanifest e selecione a guia Recursos. Selecione os recursos Armazenamento removível e Biblioteca de imagens. Essa seleção lhe proporciona acesso de aplicativo aos dispositivos de armazenamento removível como memória de câmera e acesso às imagens locais.

  3. No arquivo de manifesto, selecione a guia Declarações. Na lista suspensa Declarações Disponíveis, selecione Conteúdo da Reprodução Automática e clique em Adicionar. Selecione o novo item Conteúdo da Reprodução Automática que foi adicionado à lista Declarações Suportadas.

  4. Uma declaração Conteúdo de Reprodução Automática identifica seu aplicativo como uma opção quando a Reprodução Automática gera um evento de conteúdo. O evento é baseado no conteúdo de um dispositivo de volume como um DVD ou um pen drive. A Reprodução Automática examina o conteúdo do dispositivo de volume e determina qual evento de conteúdo gerar. Se a raiz do volume tem uma pasta DCIM, AVCHD ou PRIVATE\ACHD ou se o usuário habilitou a opção Escolher o que fazer com cada tipo de mídia no painel de controle Reprodução Automática e há imagens na raiz do volume, então a Reprodução Automática gera o evento ShowPicturesOnArrival.

    Na seção Ações de lançamento, insira os valores seguintes para a primeira ação de lançamento.

    Definição Valor
    Verb mostrar
    Nome de exibição da ação Mostrar fotos
    Evento de conteúdo ShowPicturesOnArrival

     

    A configuração Nome de exibição da ação identifica a cadeia de caracteres que a Reprodução Automática exibe para seu aplicativo. A configuração Verbo identifica um valor que é passado ao seu aplicativo para a opção selecionada. Você pode especificar várias ações de inicialização para um evento de Reprodução Automática e usar a configuração Verbo para determinar qual opção um usuário selecionou para seu aplicativo. Você pode saber qual opção o usuário selecionou verificando a propriedade verb dos argumentos de eventos de inicialização passados para o seu aplicativo. Você pode usar qualquer valor para a configuração Verbo, exceto open que é reservada.

  5. Na seção Ações de Início para o item Conteúdo da Reprodução Automática, clique em Adicionar Novo para adicionar uma segunda ação de início. Digite os seguintes valores para a segunda ação de lançamento.

    Definição Valor
    Verb copiar
    Nome de exibição da ação Copiar fotos na biblioteca
    Evento de conteúdo ShowPicturesOnArrival

     

  6. Na lista suspensa Declarações Disponíveis, selecione Associações de Tipo de Arquivo e clique em Adicionar. Nas Propriedades da nova declaração Associações de Tipo de Arquivo, defina o campo Nome de Exibição para AutoPlay Copy or Show Images e o campo Nome para image_association1. Na seção Tipos de Arquivos Suportados, clique em Adicionar Novo. Configure o campo Tipo de arquivo para .jpg. Na seção Tipos de arquivos suportados, clique em Adicionar novo novamente. Defina o campo Tipo de Arquivo da nova associação de arquivo como .png. Nos eventos de conteúdo, a Reprodução Automática filtra qualquer tipo de arquivo que não seja associado explicitamente ao aplicativo.

  7. Salve e feche o arquivo de manifesto.

2. Adicionar UI HTML

  • Abra o arquivo Default.html e coloque o seguinte HTML na seção <body> .

    <label>File List</label>
    <div id="files" style="position:fixed;top:30px;height:400px;width:600px" ></div>
    

3. Adicionar código de inicialização

O código nessa etapa verifica o valor do verbo na propriedade verb a partir dos argumentos transmitidos ao aplicativo. O código chama a função relacionada à opção que o usuário selecionou. No evento de memória de câmera, a Reprodução Automática transmite a pasta raiz do armazenamento de câmera nos argumentos de inicialização transmitidos ao aplicativo. Você pode recuperar essa pasta do primeiro elemento da propriedade detail.files.

  • Abra a pasta js. Abra o arquivo Default.js e substitua a função padrão onactivated pelo seguinte código.

    var filesDiv;
    
    app.onactivated = function (args) {
        if (args.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.file) {
            filesDiv = document.getElementById("files");
    
            if (args.detail.verb === "show") {
                // Call displayImages with root folder from camera storage.
                displayImages(args.detail.files[0]);
            }
            else if (args.detail.verb === "copy") {
                // Call copyImagesToLibrary with root folder from camera storage.
                copyImagesToLibrary(args.detail.files[0]);
            }
        }
        args.setPromise(WinJS.UI.processAll());
    };
    

4. Adicionar código para exibir imagens

  • No arquivo Default.js, adicione o código a seguir após a função onactivated.

    function displayImages(rootFolder) {
        // Display images from first folder in root\DCIM.
        rootFolder.getFolderAsync("DCIM").then(
        function (dcimFolder) {
            dcimFolder.getFoldersAsync().then(
            function (cameraFolders) {
                cameraFolders[0].getFilesAsync().then(
                function (files) {
                    files.forEach(function (file) {
                        filesDiv.innerHTML += file.name + "<br />";
                        displayImage(file);
                    });
                });
            });
        });
    }
    
    function displayImage(file) {
        try {
            var element = document.createElement("img");
            element.src = window.URL.createObjectURL(file, { oneTimeOnly: true });
            element.height = 100;
            element.width = 100;
            filesDiv.appendChild(element);
            filesDiv.innerHTML += "<br>";
        }
        catch (e) {
            filesDiv.innerHTML += e.message;
        }
    }
    

5. Adicionar código para copiar imagens

  • No arquivo Default.js adicione o seguinte código após a função displayImage.

    function copyImagesToLibrary(rootFolder) {
        try {
            var now = new Date();
            var folderName =
                "Images " + now.toDateString() + " " + now.getHours() +
                            now.getMinutes() + now.getSeconds();
    
            Windows.Storage.KnownFolders.
            picturesLibrary.createFolderAsync(folderName).then(
                    function (imageFolder) {
                        // Copy images from first folder in root\DCIM.
                        rootFolder.getFolderAsync("DCIM").then(
                    function (dcimFolder) {
                        dcimFolder.getFoldersAsync().then(
                    function (cameraFolders) {
                        cameraFolders[0].getFilesAsync().then(
                    function (files) {
                        files.forEach(function (file) {
                            copyImage(file, imageFolder);
                        });
                    });
                    });
                    });
                    });
        } catch (e) {
            filesDiv.innerHTML = "Failed copy images.<br />" + e.message;
        }
    }
    
    function copyImage(file, imageFolder) {
        try {
            file.copyAsync(
                imageFolder, file.fileName,
                    Windows.Storage.NameCollisionOption.replaceExisting).then(
                        function (newFile) {
                            filesDiv.innerHTML += file.name + " copied.<br />";
                        });
        } catch (e) {
            filesDiv.innerHTML += "Failed to copy image.<br />" + e.message;
        }
    }
    

6. Compilar e executar o aplicativo

  1. Pressione F5 para compilar e implantar o aplicativo (no modo de depuração).
  2. Para executar o aplicativo, insira um cartão de memória de câmera ou outro dispositivo de armazenamento de uma câmera no computador. Depois, selecione uma das opções de evento de conteúdo que você especificou no arquivo package.appxmanifest, na lista de opções de Reprodução Automática. Este código de exemplo só exibe copia imagens na pasta DCIM de um cartão de memória da câmera. Se seu cartão de memória de câmera armazena imagens em uma pasta AVCHD ou PRIVATE\ACHD, você deverá atualizar o código de acordo.Observação  Se você não tiver um cartão de memória de câmera, pode usar um pen drive contanto que tenha uma pasta chamada DCIM na raiz e a pasta DCIM tenha uma subpasta que contenha imagens.  

Resumo e próximas etapas

Neste tutorial, você criou um aplicativo que exibe arquivos de imagem ou copia esses arquivos para Imagens. Você registrou o aplicativo para o evento de conteúdo de Reprodução AutomáticaShowPicturesOnArrival.

A Reprodução Automática gera eventos de conteúdo para conteúdo compartilhado entre computadores usando a proximidade (toque). Você pode usar as etapas e o código que constam nesse guia rápido para manipular os arquivos compartilhados entre computadores que usam a proximidade. A tabela a seguir lista os eventos de conteúdo de Reprodução Automática que estão disponíveis para compartilhamento de conteúdo usando proximidade.

Ação Evento de conteúdo do AutoPlay
Compartilhamento de música PlayMusicFilesOnArrival
Compartilhamento de vídeos PlayVideoFilesOnArrival

 

Quando os arquivos forem compartilhados usando proximidade, a propriedade Files do objeto FileActivatedEventArgs contém uma referência para uma pasta raiz que contém todos os arquivos compartilhados.

Tópicos relacionados

Início automático com Reprodução Automática