Xamarin Forms - Carregando PDF em um WebView

 Neste artigo eu vou mostrar como podemos carregar arquivos PDF em uma view WebView em aplicações Xamarin Forms.

O componente WebView é uma view usada para a exibição de conteúdos web e HTML em seu aplicativo. O WebView é muito versátil e possui os seguintes recursos:

Para mais detalhes veja o meu artigo de apresentação do componente WebView : Xamarin Forms - Apresentando e usando a WebView

Hoje veremos como abrir arquivos PDF em uma WebView e fazer o download. Para isso vamos usar a seguinte abordagem:

Assim poderemos baixar arquivos PDF em páginas que contenham links para esses arquivos. É uma solução meio quebra-galho mas funciona neste cenário.

Recursos Usados

Criando o projeto Xamarin Forms

Abra o  VS 2017 Community e clique em New Project e a seguir escolha Cross Platform -> Cross Platform App (Xamarin.Forms) e informe o nome XF_WebViewPDF.

Ao criar um projeto Xamarin Forms em uma versão anterior à atualização 15.5, você tinha duas opções para compartilhar o código entre as plataformas:

  1. Shared Project
  2. Portable Class Library (PCL)

Pois a partir da versão 15.5 do Visual Studio(lançada em dezembro/2017) a opção Portable Class Library (PCL) foi substituida pela .NET Standard:

Marque as opções Android e/ou iOS, marque Xamarin Forms e a seguir marque .NET Standard e clique no botão OK.

Pronto nosso projeto já esta criado. (Verifique a necessidade de atualizar a versão do Xamarin Forms no seu projeto. Atualmente(06/2018) a versão mais atual é a 3.0.0)

Definindo o código da MainPage.xaml

Abra o arquivo MainPage.xaml e inclua no código abaixo: 

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:XF_WebViewPDF"
             x:Class="XF_WebViewPDF.MainPage">
    <StackLayout>
	<Label Text="WebView - PDF" 
           VerticalOptions="Center" 
           HorizontalOptions="Center" />
        <WebView x:Name="navegador" Source="http://www.pdfpdf.com/samples.html"  
                 Navigating="webOnNavigating"  
                 HorizontalOptions="FillAndExpand"  
                 VerticalOptions="FillAndExpand"/>
    </StackLayout>
</ContentPage>
  

Neste código temos:

Um controle StackLayout que esta empilhando os controles :

- 1 Label onde temos estamos exibindo o texto no topo da página

- 1 WebView onde definimos a propriedade Source para a URL onde teremos links para arquivos PDF

No arquivo MainPage.xaml.cs temo o código do evento webOnNavigating do botão de comando que é visto a seguir:
 
using System;
using Xamarin.Forms;
namespace XF_WebViewPDF
{
    public partial class MainPage : ContentPage
    {
	public MainPage()
	{
		InitializeComponent();
	}
        protected void webOnNavigating(object sender, WebNavigatingEventArgs e)
        {
            if (e.Url.Contains(".pdf"))
            {
                // retornando a URL
                var pdfUrl = new Uri(e.Url);
                // Abre a URL do PSD com o navegador para download
                Device.OpenUri(pdfUrl);
                // Cancela navegacao ao clicar
                // (reêm a mesma pagina.)  
                e.Cancel = true;
            }
        }
    }
}

Neste código verificamos se a URl contém um indicação da extensão '.pdf' e abrimos a url obtida no link clicado.

Executando o projeto usando o emulador Genymotion para o Android iremos obter o seguinte resultado:
 

Ao clicar no link a URL será extraída e o download iniciado.

Pegue o código do projeto compartilhado aqui :  XF_WebViewPDF.zip (sem as referências)

"E os que são de Cristo crucificaram a carne com as suas paixões e concupiscências.
Se vivemos em Espírito, andemos também em Espírito.
Não sejamos cobiçosos de vanglórias, irritando-nos uns aos outros, invejando-nos uns aos outros."
Gálatas 5:24-26
 

Veja os Destaques e novidades do SUPER DVD Visual Basic (sempre atualizado) : clique e confira !

Quer migrar para o VB .NET ?

Quer aprender C# ??

Quer aprender os conceitos da Programação Orientada a objetos ?

Quer aprender o gerar relatórios com o ReportViewer no VS 2013 ?

  Gostou ?   Compartilhe no Facebook   Compartilhe no Twitter

Referências:

José Carlos Macoratti