Chatbot & Xamarin on 7 steps


Cuando escuche sobre bots utilizando el Microsoft Bot Framework, lo primero que se me vino a la mente fue el cómo hacer una integración de esto en una aplicación de Xamarin. Cuando busqué en línea, encontré que hay dos formas de hacerlo, ya sea Embed Code con WebView o Native con DirectLine.

Dado el proceso que he seguido, decidí probar la primera opción a través de hacer la inserción del código en una vista Web utilizando Xamarin.Forms. Y vaya que descubrí que la solución es bastante simple e interesante, por eso me gustaría compartir los pasos a realizar.

Requisitos previos

Una vez que contamos con todo y estamos listo, lo haremos en tan solo 7 pasos, si, solo 7 pasos.

Integrando un ChatBot en Xamarin

Paso 1

Primero, necesitamos crear una aplicación móvil (Xamarin.Forms) Cross Platform.

01

Paso 2

En segundo lugar, necesitaremos una Web App Bot en Azure

Paso 3

En nuestra aplicación deberemos crear una página de contenido (ContentPage) que represente un WebView con un bot incorporado. Para hacerlo, hacemos clic derecho en el proyecto Core -> Agregar -> Nuevo elemento.

02

Paso 4

Asignémosle a la ContentPage (C #) el nombre “WebPage” y luego hagamos clic en Agregar.

03

Paso 5

Reemplacemos todo el código dentro del Constructor WebPage() con el siguiente código:


var browser = new WebView();

            browser.Source = "https://webchat.botframework.com/embed/WebAppBotEx?s=Wg8eyyHzrnU.cwA.h-w.G6Vo4iJ1hSnBqZjZrzxN-a_FLqT_D2U0K_3224Mj044";

            this.Content = browser;

De tal forma que quede así:

04

Paso 6

Por último, pero no menos importante, debemos modificar la pantalla que ejecutara la aplicación, esto para cargar el bot una vez que se está iniciando. Por lo tanto, vayamos a App.cs -> al constructor App() -> y reemplacemos lo que se encuentra con la siguiente línea:

this.MainPage = new WebPage { Title = "Web Page" };

Paso 7

Ya con esto habremos terminado, guardemos y ejecutemos en el emulador o en algún dispositivo móvil.

XamBot

Realmente fueron 7 pasos ¿verdad? A pesar de que este Chatbot está construido con Xamarin ‘WebView”, todavía es personalizable en el backend alojado en Azure. Por lo tanto, te invito a que realices las modificaciones pertinentes para mejorar el Chatbot.

Descarga el código completo desde mi GitHub.

GitIronMan

¡Hasta la próxima!

Anuncios

Responder

Por favor, inicia sesión con uno de estos métodos para publicar tu comentario:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

w

Conectando a %s