O X do Xamarin Forms — Videoconferência com Opentok

Thiago Bertuzzi

Fala galera,

tudo beleza?

Quem aqui ja precisou fazer um app de comunicação? Você esta falando de chat? Não só chat, mas utilizando a câmera e conversando por voz.

Existem diversas soluções que podemos utilizar, mas existe um serviço muito legal que utilizamos hoje na NESS e que pode ser extendido para Xamarin.Forms : A Plataforma OpenTok da tokbox!!

O Opentok utiliza o WebRTC :

WebRTC vem de Real Time Communications (RTC) e é um projeto OpenSource com alguns anos de existência (nasceu em maio de 2011). Seu objetivo é levar comunicações em tempo real para navegadores e aplicativos para dispositivos móveis. As comunicações em tempo real suportadas hoje são voz, texto e vídeo.
Já é uma tecnologia sólida e bem estabelecida, bastando dizer que é utilizada por ninguém menos que WhatsApp e Facebook Messenger.

Fonte : https://www.totalvoice.com.br/blog/introducao-ao-webrtc/

No caso o Opentok utiliza o WebRTC e o implementa, adicionando diversas funcionalidades simplificando a nossa utilização do mesmo.

Certo, mas tem suporte a Xamarin.Forms ? Então hoje a Opentok suporte as seguintes plataformas :

Ou seja nativamente não tem suporte a Xamarin.Forms… Porem, graças ao meu amigo Andrei Misiukevich agora é possível !! Graças ao Controle OpenTok-Xamarin.Forms ! E Hoje Vamos ver como utiliza-lo!

Configurando o Serviço

Antes de mais nada você vai precisar fazer um cadastro na tokbox . Este serviço é pago ( mas eu recomendo, é muito, mas muito bom!!!) , mas existe uma versão trial para você verificar como funciona

Com a conta criada basta criar um novo projeto :

Em seguida definir que quer utilizar uma API e adicionar um nome :

Eu utilizo o VP8 devido a compatibilidade com a maioria dos projetos/dispositivos.

Pronto! Agora é só guardar a APIKey e o Secret que utilizaremos mais para a frente :)

A tokbox disponibiliza um tutorial completo de como criar projetos, utilizar as apis e gerar sessions. Você pode ver clicando aqui.

Apenas para demonstrar como funciona no Xamarin, no painel do seu projeto vamos criar uma sessionid na mão :

Sem seguida com o SessionID vamos criar o Token :

Pronto! Com essas 3 informações, podemos seguir :D .

Claro que essas configurações você pode fazer tudo via API, integrando em seus sites ou outros apps. Esse painel é apenas para testar o SDK.

Configurando o controle

Vamos ao nuget adicionar o pacote Xamarin.Forms.OpenTok em todos os seus projetos :

Agora devemos adicionar a linha PlatformOpenTokService.Init(); nas duas plataformas :

No Android precisamos de mais um passo, vamos adicionar o plugin Plugin.CurrentActivity no projeto :

E inicializar a linha CrossCurrentActivity.Current.Activity = this;

https://gist.github.com/TBertuzzi/014252ae303520bcf2e8ab3aff5798ef

Agora precisamos dar as permissões por plataforma.

iOS : No arquivo Info.plist precisamos adicionar as linhas :

https://gist.github.com/TBertuzzi/b833f7feddc23e5e0abc4668f55193ea

Android: No Arquivo AndroidManifest.xml adicionar as linhas :

https://gist.github.com/TBertuzzi/ff0ff61d54a1b989190e8abfe33d7e8a

Pronto! tudo configurado agora podemos utilizar ;) .

Utilizando o Controle

Vamos usar como o base o exemplo do Andrei.

No App.Xaml.cs vamos inicializar as configurações :

https://gist.github.com/TBertuzzi/e253549ca9940bedd80709d9476f149d

Vamos criar uma pagina simples de inicio para chamar a pagina que vai executar o controle.

Mas porque ? Simples, podemos tratar antes de iniciar o chat se as permissões e todos os requisitos estão corretos para execução , para isto basta utilizar o código :

https://gist.github.com/TBertuzzi/01c8ed901dc03dc0de43715bc98c78ac

Agora vamos implementar nossa tela do Chat :

https://gist.github.com/TBertuzzi/bd4d4263d91051087008d3645c958185

E no código as suas funcionalidades :

https://gist.github.com/TBertuzzi/7b511459b09bae0b91322425531bf74e

Como vocês podem ver, existem eventos que nos permitem tratar o recebimento/envio de mensagens, quando a o call acaba e etc. É um controle muito completo.

Agora vamos executar:

https://vimeo.com/359530756

O Controle esta em constante atualização e sempre tem features novas, e aqui entre nós fica ligado nele que eu to sabendo que novidades incríveis estão por vir :O .

Sobre o OpenTok, eu recomendo demais o serviço. Utilizamos em muitos projetos da NESS e ele funciona extremamente bem, tanto video, chat e tudo que ele oferece.

Caso queira baixar o código utilizado no Exemplo: Clique aqui.

Quer ver outros artigos sobre Xamarin ? Clique aqui.

Espero ter ajudado!

Aquele abraço!

Thiago Bertuzzi

Written by

Microsoft MVP,Gamer, Desenvolvedor e apaixonado por tecnologia!

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade