Ejemplo manejo request con App Inventor


Al igual que usted puede acceder a páginas Web desde el teléfono – por ejemplo, para buscar un precio de las acciones – por lo que puede App Inventor. Esta aplicación permite al usuario introducir un símbolo de cotización, luego mira el precio de la acción en Yahoo! Finance y muestra el precio por teléfono.

En este post  se supone que está familiarizado con los conceptos básicos de la aplicación Inventor – utilizando el Diseñador de componentes para construir una interfaz de usuario y utilizando el Editor de bloques para especificar controladores de eventos. Si usted no está familiarizado con los conceptos básicos, intente pasar a través de algunos de los tutoriales básicos antes de continuar.

En primer lugar ,conéctese al sitio Web App Inventor y empezar un nuevo proyecto. Nombre que StockQuotes, y también le da título a “Cotización de Acciones” de la pantalla.Abra el Editor de bloques y conectarlo al teléfono.

Para configurar los componentes,utilice el diseñador de componentes para crear la interfaz de usuario. Cuando haya terminado, debería parecerse a la siguiente imagen. Instrucciones adicionales están por debajo de la imagen.

Hecho esto ,cree los siguientes componentes arrastrándolos desde la paleta en el Visor.

Tipo de componente Grupo de paletas Lo que usted lo nombra Propósito de componentes
TextBox Interfaz de usuario StockSymbolTextBox Cuando el usuario entra en el símbolo de cotización
Botón Interfaz de usuario GetQuoteButton Para solicitar la cotización de bolsa
Etiqueta Interfaz de usuario ValueLabel Para mostrar la cotización de bolsa
Web Conectividad Web1 Solicitar y recibir la cotización de bolsa

Seguidamente  con las propiedades predeterminadas a excepción de los siguientes cambios:

Componente Acción
StockSymbolTextBox Establezca su propiedad Hint “Introducir un símbolo de cotización”.
GetQuoteButton Establezca su propiedad Text en “Obtener Cotización”.
ValueLabel Desactive su propiedad Text.

El API Finanzas Yahoo!

Muchos de los servicios web ofrecen un interfaz del programador de aplicaciones (API) para los desarrolladores para que sus programas para acceder al servicio. Algunas maneras de descubrir las API son a través de la página web http://programmableweb.com o simplemente haciendo una búsqueda en Internet para el nombre de servicio y el “API”.

La API de Yahoo! Finanzas está documentado en detalles sangrientos en http://www.gummy-stuff.org/Yahoo-data.htm . Los aspectos más destacados son que usted puede conseguir el último precio de la acción con el símbolo “GOOG”, por ejemplo, con la URL http://finance.yahoo.com/d/quotes.csv?f=l1&s=GOOG

.La sección “f = l1” (letra minúscula L, seguido por el número 1) dice nos gustaría que el último precio, y la sección “s = GOOG”, dice nos gustaría información acerca de las acciones cuyo símbolo es “GOOG” . El resultado se devuelve en valores separados por comas (CSV), que usted puede estar familiarizado con las hojas de cálculo. Dado que sólo un valor se devolverá a nuestra consulta, el resultado será un número viejo y simple, como “511.5”, sin ninguna coma. (Las comas se utilizaría si lo solicitamos múltiples piezas de datos de Yahoo!, como el nombre de la empresa y el volumen de comercio diario.)

Añadir comportamientos a los Componentes

Los bloques para hacer la solicitud web se muestran aquí y se detallan a continuación:

Tipo de bloque Cajón Propósito
GetQuoteButton.Click GetQuoteButton Manejar un clic del botón “Get Quote”.
establecer Web1.Url a Web1 Especifique la dirección URL a la solicitud.
unirse Texto Concatenar las partes de la dirección URL.
“” ( http://finance.yahoo.com/d/quotes.csv?f=l1&s =

External Links icon

 )

Texto Especifique la primera parte inmutable de la URL.
StockSymbolTextBox.Text StockSymbolTextBox Obtener el símbolo de la acción en el cuadro de texto.
llamar Web1.Get Web1 Hacer la solicitud Web.

El significado es: Cuando se hace clic en GetQuoteButton:

  1. Construir URL del componente Web concatenando ” http://finance.yahoo.com/d/quotes.csv?f=l1&s =
    External Links icon

     “(que debe copiar y pegar en el bloque de texto) y el símbolo que se introdujo por el usuario (StockSymbolTextBox . Texto).

  2. Solicite la página especificada por el URL. (Esto es como pulsar retorno después de introducir una URL en su navegador web.)

Cuando la respuesta a la solicitud Web llega, el evento Web.GotText se eleva con cuatro parámetros (sólo algunos de los cuales vamos a utilizar en esta aplicación):

  1. url: la URL de la solicitud original (lo cual es útil si las solicitudes se hacen con muchas URLs diferentes).
  2. responseCode: el código de estado HTTP , que indica si la solicitud Web sucedió o cómo falló; por ejemplo, 200 significa que la solicitud se realizó correctamente, 404 que la página no se ha encontrado, etc
  3. responseType: el tipo MIME de la respuesta, como por ejemplo “text / csv” en esta aplicación, “image / jpeg”, etc
  4. responseContent: los datos que se devuelven, como “511.5”.

Aquí hay una imagen y la tabla de los bloques que necesita para crear:

Tipo de bloque Cajón Propósito
Web1.GotText Web1 Especifique qué hacer cuando la respuesta vuelve de la web.
Si, pues, Control Proporcionar un comportamiento diferente dependiendo de si la solicitud se realizó correctamente. Utilice el mutador para agregar una sentencia else.
conseguir responseCode Variables Obtiene el código de respuesta devuelto por la solicitud web, que …
= (Igual) bloque Lógica … Está marcada por la igualdad con …
número (200) Matemáticas … 200, el código para las respuestas de web válidos.
establecer ValueLabel.Text a ValueLabel Mostrar el resultado en la pantalla.
unirse Texto Construir el resultado concatenando …
“” (“Valor actual”) Texto … El texto “Valor actual:” y …
get responseContent Variables Obtiene el valor devuelto por la web.
establecer ValueLabel.Text a ValueLabel Mostrar un mensaje de error.
“” (“Error al obtener Cotización”) Texto El mensaje de error

He aquí una descripción del comportamiento del bloque:

  1. Si el código de respuesta indica que la solicitud Web sucedió (= 200), establece la etiqueta para la concatenación de “valor actual” y los datos devueltos (por ejemplo, 511.5).
  2. De lo contrario, establecer la etiqueta de “Error al obtener cotización de bolsa”.

Si desea trabajar con este ejemplo en App Inventor,pude  descargar el código fuente (External Links icon de su equipo, a continuación, abra la aplicación Inventor, haga clic enProyectos, seleccione Importar proyecto (. aia) de mi computadora … y seleccione el código fuente que acaba de descargar.)

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. 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 )

Google+ photo

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

Conectando a %s