Interagir com javascript a partir de C# usando Xamarin.Forms

Como nós fizemos isso?
Traduzido por: Adriano D’lucca [Repost Traduzido]
Fonte: geeks.ms/xamarinteam/2019/02/28/interact-with-javascript-from-c-using-xamarin-forms

A ideia é:

  • Um Xamarin.Forms View que contém o Url da página da web para carregar, e o método que queremos chamar do Javascript.
  • Um renderizador para cada plataforma que fará a mágica em todas as plataformas.

 

Essa visão pode ser usada em torno do projeto Xamarin.Forms. O importante é o método RegisterAction , que conterá o código para executar a partir do JavaScrip. Para definir esse código:

 

hybridWebView.RegisterAction (data => DisplayAlert ("Alert", "Hello " + data, "OK"));

Este exemplo exibirá um popup modal com os dados que foram passados ​​do código Javascript.

Agora precisamos de um renderizador personalizado para cada projeto de aplicativo. O ponto é, o renderizador personalizado irá criar um controle web nativo e carregará a página HTML, insira uma função Javascript invokeCSSharpAction que invocará o método registrado do controle HybridWebView.

RENDERIZADOR PERSONALIZADO DO IOS


 

Este renderizador irá inserir a função Javascript invokeCSharpAction tornando-a disponível para o código na página web, se o método for invocado a partir de Javascript, o método DidReceiveScriptMessage  será executado e o show terminará.

RENDERIZADOR PERSONALIZADO ANDROID

 

Para atender a esse comportamento no Android, é necessário um pouco mais de código.

O renderizador se parece com:

Precisamos de um WebViewClient para injetar a função Javascript invokeCSharpAction, mas não podemos fazer isso depois que a página é carregada, portanto, o JavascriptWebViewClient que criaremos para isso é:

O método AddJavascriptInterface irá injetar uma “ponte” que permita que os métodos sejam acessados ​​a partir do Javascript. Esses métodos precisam dos atributos JavaScriptInterface e Export para torná-lo acessível a partir do Javascript:

E o show do Android terminou.

RENDERIZADOR PERSONALIZADO UWP

 

O cenário UWP é muito semelhante ao iOS:

 

Depois que a página da Web é carregada, a função Javascript invokeCSharpAction é injetada. Quando é chamado a partir da página da web, uma notificação é enviada ao representante que executará a ação registrada.

RESUMO

Nós aprendemos uma maneira de interagir entre Javascript e C#, para fazer uma página da web invocar o código C# em nossos aplicativos Xamarin.Forms.

Você pode encontrar uma amostra de código completa aqui: https://github.com/xamarin/xamarin-forms-samples/tree/master/CustomRenderers/HybridWebView

Espero que isso ajude!

Traduzido por: Adriano D’lucca [Repost Traduzido]
Fonte: geeks.ms/xamarinteam/2019/02/28/interact-with-javascript-from-c-using-xamarin-forms

RelatedPost

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *