Guia de início rápido: usando Reproduzir em em aplicações
Idioma: HTML | XAML

Guia de início rápido: usando Reproduzir em nos aplicativos (XAML)

[ 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 usar Reproduzir em para permitir que os usuários transmitam áudio, vídeo ou imagens com facilidade de seus computadores para dispositivos eu suas redes domésticas. Este tópico lhe mostra como usar Reproduzir em em um aplicativo da Windows Store para permitir que usuários transmitam mídia para um dispositivo de destino.

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

Objetivo: Use Reproduzir em para realizar streaming de mídia em um dispositivo de destino.

Pré-requisitos

Microsoft Visual Studio

Instruções

1. Criar um novo projeto e permitir o acesso a bibliotecas de mídia

  1. Abra o Visual Studio e selecione Novo Projeto no menu Arquivo. Na seção Visual C# ou Visual Basic, selecione o Aplicativo. Dê ao aplicativo o nome de PlayToSample e clique em OK.
  2. Abra o arquivo package.appxmanifest e selecione a guia Recursos. Selecione os recursos Biblioteca de Música, Biblioteca de Imagens e Biblioteca de Vídeo para habilitar o seu aplicativo para o acesso às bibliotecas de mídia de um computador. Feche e salve o arquivo de manifesto.

2. Adicionar a interface do usuário XAML

  • Abra o arquivo MainPage.xaml e adicione a marcação a seguir no lugar do elemento <Grid> padrão.
    
            <Grid.RowDefinitions>
                <RowDefinition Height="40" />
                <RowDefinition Height="338" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Canvas x:Name="ButtonCanvas" Grid.Row="0">
                <Button x:Name="VideoButton" Click="VideoButtonClick" Content="Video" 
                        Margin="8,8,0,724" />
                <Button x:Name="AudioButton" Click="AudioButtonClick" Content="Audio" 
                        Margin="102,8,0,724" />
                <Button x:Name="ImageButton" Click="ImageButtonClick" Content="Image" 
                        Margin="196,8,0,724" />
            </Canvas>
            <Canvas x:Name="DisplayCanvas" Grid.Row="1" Height="338" VerticalAlignment="Top" 
                    HorizontalAlignment="Left" Width="600">
                <MediaElement x:Name="VideoPlayer" HorizontalAlignment="Left" Height="338" 
                              VerticalAlignment="Top" Width="600" />
                <MediaElement x:Name="AudioPlayer" HorizontalAlignment="Left" Height="338" 
                              VerticalAlignment="Top" Width="600" />
                <Image x:Name="ImagePlayer" HorizontalAlignment="Left" Height="338" 
                       VerticalAlignment="Top" Width="600" />
            </Canvas>
            <TextBlock x:Name="MessageBlock" Grid.Row="2" HorizontalAlignment="Left" 
                       Height="140" TextWrapping="Wrap" VerticalAlignment="Top" 
                       Width="600"/>
    
    
    

3. Adicione o código de inicialização

O código nesta etapa cria os manipuladores de eventos para os eventos de clique dos botões. A função ShowMedia alterna os elementos visíveis dentre vídeo, áudio e imagens. Ela também retém uma referência do elemento ativo. Essa referência é passada a PlayToManager para transmitir a origem do elemento ao destino de Reproduzir em.

  • Abra o arquivo MainPage.xaml.cs ou MainPage.xaml.vb adicione o código a seguir à classe MainPage.
    
    // Save a reference to the current media element for PlayTo.
    private FrameworkElement mediaElement;
    
    private void ShowMedia(string mediaName)
    {
        VideoPlayer.Visibility = Visibility.Collapsed;
        VideoPlayer.Pause();
        AudioPlayer.Visibility = Visibility.Collapsed;
        AudioPlayer.Pause();
        ImagePlayer.Visibility = Visibility.Collapsed;
    
        FrameworkElement f = (FrameworkElement)DisplayCanvas.FindName(mediaName);
        f.Visibility = Visibility.Visible;
    
        switch (mediaName)
        {
            case "VideoPlayer":
                mediaElement = VideoPlayer;
                break;
            case "AudioPlayer":
                mediaElement = AudioPlayer;
                break;
            case "ImagePlayer":
                mediaElement = ImagePlayer;
                break;
        }
    }
    
    private void VideoButtonClick(object sender, RoutedEventArgs e)
    {
        ShowMedia("VideoPlayer");
        LoadVideo();
    }
    
    private void AudioButtonClick(object sender, RoutedEventArgs e)
    {
        ShowMedia("AudioPlayer");
        LoadAudio();
    }
    
    private void ImageButtonClick(object sender, RoutedEventArgs e)
    {
        ShowMedia("ImagePlayer");
        LoadImage();
    }
    
    
    

4. Adicione código para obter a origem da mídia das bibliotecas de mídia locais.

O código nesta etapa é chamado durante os eventos de clique dos botões. Cada método pega o primeiro item encontrado na biblioteca de mídia selecionada e o reproduz ou exibe no elemento de mídia ou imagem relacionado. Por exemplo, se você clica no botão Vídeo do aplicativo, a função LoadVideo pega o primeiro vídeo da Biblioteca de Vídeos, define-o como a origem da marca <MediaElement> usada para vídeo e, então, reproduz o vídeo.

  • No arquivo MainPage.xaml.cs ou MainPage.xaml.vb adicione o código a seguir depois do código da etapa anterior.
    
    async private void LoadVideo()
    {
        try
        {
            IReadOnlyList<Windows.Storage.StorageFile> resultsLibrary =
                await Windows.Storage.KnownFolders.VideosLibrary.GetFilesAsync();
            MessageBlock.Text += "Play video: " + resultsLibrary[0].Name + "\n";
            Windows.Storage.Streams.IRandomAccessStream videoStream =
                await resultsLibrary[0].OpenAsync(Windows.Storage.FileAccessMode.Read);
            VideoPlayer.SetSource(videoStream, resultsLibrary[0].FileType);
            VideoPlayer.Play();
        }
        catch (Exception ex)
        {
            MessageBlock.Text += "Exception encountered: " + ex.Message + "\n";
        }
    }
    
    async private void LoadAudio()
    {
        try
        {
            IReadOnlyList<Windows.Storage.StorageFile> resultsLibrary =
                await Windows.Storage.KnownFolders.MusicLibrary.GetFilesAsync();
            MessageBlock.Text += "Play audio: " + resultsLibrary[0].Name + "\n";
            Windows.Storage.Streams.IRandomAccessStream audioStream =
                await resultsLibrary[0].OpenAsync(Windows.Storage.FileAccessMode.Read);
            AudioPlayer.SetSource(audioStream, resultsLibrary[0].FileType);
            AudioPlayer.Play();
        }
        catch (Exception ex)
        {
            MessageBlock.Text += "Exception encountered: " + ex.Message + "\n";
        }
    }
    
    async private void LoadImage()
    {
        try
        {
            IReadOnlyList<Windows.Storage.StorageFile> resultsLibrary =
                await Windows.Storage.KnownFolders.PicturesLibrary.GetFilesAsync();
            MessageBlock.Text += "Show image: " + resultsLibrary[0].Name + "\n";
            Windows.Storage.Streams.IRandomAccessStream imageStream =
                await resultsLibrary[0].OpenAsync(Windows.Storage.FileAccessMode.Read);
            Windows.UI.Xaml.Media.Imaging.BitmapImage imageBitmap =
                new Windows.UI.Xaml.Media.Imaging.BitmapImage();
            imageBitmap.SetSource(imageStream);
            ImagePlayer.Source = imageBitmap;
        }
        catch (Exception ex)
        {
            MessageBlock.Text += "Exception encountered: " + ex.Message + "\n";
        }
    }
    
    
    

5. Adicione o código de Reproduzir em

O código nesta etapa basta para que você consiga habilitar Reproduzir em no seu aplicativo. Ele envia uma referência ao PlayToManager para o aplicativo atual e associa o manipulador de eventos para o evento SourceRequested. No manipulador de eventos SourceRequested, você transmite a propriedade PlayToSource do elemento de mídia ou imagem para o método SetSource do PlayToManager. Em seguida, PlayToManager transmite a mídia para o destino de Reproduzir em selecionado pelo usuário.

  • No arquivo MainPage.xaml.cs ou MainPage.xaml.vb adicione o código a seguir depois do código da etapa anterior.
    
    private Windows.Media.PlayTo.PlayToManager ptm;
    
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        ptm = Windows.Media.PlayTo.PlayToManager.GetForCurrentView();
        ptm.SourceRequested += SourceRequested;
    
        ShowMedia("VideoPlayer");
        LoadVideo();
    }
    
    private Windows.UI.Core.CoreDispatcher dispatcher = Window.Current.CoreWindow.Dispatcher;
    
    async private void SourceRequested(Windows.Media.PlayTo.PlayToManager sender,
                                 Windows.Media.PlayTo.PlayToSourceRequestedEventArgs e)
    {
    
        await dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
        {
            try
            {
                Windows.Media.PlayTo.PlayToSourceRequest sr = e.SourceRequest;
                Windows.Media.PlayTo.PlayToSource controller = null;
                Windows.Media.PlayTo.PlayToSourceDeferral deferral =
                    e.SourceRequest.GetDeferral();
    
                try
                {
                    if (mediaElement is Image)
                    {
                        controller = ((Image)mediaElement).PlayToSource;
                    }
                    else
                    {
                        controller = ((MediaElement)mediaElement).PlayToSource;
                    }
    
                }
                catch (Exception ex)
                {
                    MessageBlock.Text += "Exception encountered: " + ex.Message + "\n";
                }
    
                sr.SetSource(controller);
                deferral.Complete();
            }
            catch (Exception ex)
            {
                MessageBlock.Text += "Exception encountered: " + ex.Message + "\n";
            }
        });
    }
    
    
    

6. Crie um destino para Reproduzir em (opcional)

Para executar o aplicativo, você precisa de um dispositivo para o qual Reproduzir em possa transmitir mídia. Caso você não possua um dispositivo certificado Reproduzir em, é possível usar o Windows Media Player como dispositivo de destino. Para usar o Windows Media Player como dispositivo de destino, é necessário que o seu computador esteja conectado a uma rede privada.

  1. Inicie o Windows Media Player.
  2. Expanda o menu Transmissão e habilite a opção Permitir controle remoto do meu Player. Deixe o Windows Media Player aberto porque é necessário que ele esteja em execução para que fique disponível como o destino de Reproduzir em.
  3. Abra o painel de controle Dispositivos e Impressoras. Clique em Adicionar dispositivos e impressoras. No assistente Adicionar dispositivos e impressoras, na janela Escolha um dispositivo ou impressora para adicionar a este PC, localize o Renderizador de mídia digital para o seu PC. Esse é o Windows Media Player para o seu PC. Selecione o item e clique em Avançar. Quando o assistente for concluído, você verá a sua instância do Windows Media Player na lista de Dispositivos Multimídia.

7. Execute o aplicativo

  • No Visual Studio, pressione F5 (depurar) para executar o aplicativo. Você pode selecionar qualquer um dos botões de mídia para executar ou visualizar o primeiro item de mídia nas várias bibliotecas de mídia. Para transmitir mídia para o dispositivo de destino enquanto a mídia está em reprodução, abra o botão Dispositivos e selecione o destino de Reproduzir em.

Resumo

Neste guia de início rápido, você adicionou recursos de Reproduzir em a um aplicativo que reproduz conteúdo de áudio e vídeo e exibe imagens. O recurso Reproduzir em permite que usuários transmitam o conteúdo do aplicativo para um dispositivo certificado Reproduzir em sua rede.

Tópicos relacionados

Transmitindo mídia para dispositivos usando Reproduzir em
Exemplos
exemplo do botão Reproduzir em
exemplo de PlayToReceiver
exemplo de Servidor de Mídia

 

 

Mostrar:
© 2017 Microsoft