Incorporación de contenido web en tu app como contenido principal o complementario

Android te permite, como desarrollador, aprovechar la potencia de la Web en tu aplicación nativa, de modo que puedas beneficiarte de la flexibilidad y la eficiencia de mostrar ciertos tipos de contenido.

Cómo incorporar contenido con WebView

La API de WebView les brinda a los desarrolladores acceso a las capacidades de un mininavegador para mostrar contenido web en su aplicación. Esto te permite proporcionar experiencias potenciadas por la Web como parte principal o complementaria de tu aplicación, como se ve en la Figura 1.

App para Android abierta en Google Play, con la vista web principal destacada en un cuadro rojo App para Android abierta con texto de respaldo dentro de un cuadro rojo.
Figura 1. Contenido web incorporado en la app con WebViews como contenido principal (izquierda) y contenido complementario (derecha).

¿Qué puede hacer WebView?

Esto es lo que puedes hacer con WebView en tu aplicación:

Incorporación de contenido web: Un WebView se integra en la interfaz de usuario de una app como un componente, al igual que un botón o un campo de texto.

Carga contenido: WebView puede cargar contenido web desde varias fuentes:

  • URLs remotas: Pueden recuperar y mostrar páginas web de Internet, al igual que un navegador normal.
  • Archivos locales: Pueden cargar archivos HTML, CSS y JavaScript almacenados en los recursos de la app.
  • Contenido generado de forma dinámica: La app puede generar contenido HTML sobre la marcha y enviarlo a WebView.

Renderización: WebView usa su motor de navegador para analizar y renderizar el código HTML, CSS y JavaScript, y mostrar la página web resultante en el área designada de la IU de la app.

Ejecutar JavaScript: WebView puede ejecutar código JavaScript dentro del contexto de la página web cargada. Esto permite interacciones y actualizaciones dinámicas dentro de WebView.

Interacción con apps nativas: Aquí es donde WebView se vuelve más potente. Permite la comunicación bidireccional entre la página web y la app.

  • De JavaScript a nativo: El código JavaScript que se ejecuta en WebView puede llamar a las APIs de host de la app, lo que permite el acceso a funciones del dispositivo, como la cámara, el GPS o los sensores.
  • Nativo de JavaScript: La app también puede insertar código JavaScript en WebView, manipular el contenido de la página web o responder a eventos activados por la página web.

¿En qué se diferencia WebView de un navegador típico como Chrome?

WebView es un componente altamente personalizado que proporciona la funcionalidad principal de una ventana en la Web. A diferencia de un navegador, que proporciona gran parte de la barra de navegación y otras necesidades del usuario para navegar por la Web de forma más amplia, la experiencia general de WebView se define según el diseño y el propósito de tu app.

Para comprender mejor en qué se diferencia WebView de los navegadores estándar, consulta las siguientes explicaciones:

IU: WebView se usa para mostrar contenido web y no tiene su propio encabezado ni IU como la mayoría de los otros navegadores comunes (botón de inicio, barra de URL, navegación, configuración, etcétera).

Funciones: Muchos navegadores tienen funciones adicionales para mejorar la experiencia de navegación, como favoritos, permisos o historial.

Actualizaciones: Debido a que Android WebView es un servicio del sistema en Android, las actualizaciones se envían e integran en las apps automáticamente todos los meses. Los navegadores dependen de las actualizaciones de sus apps correspondientes y, luego, de que los usuarios finales apliquen la actualización en sus dispositivos.

¿Por dónde empezar?

Para obtener información sobre cómo usar WebView en tu app, consulta el artículo Cómo crear apps web en WebView.

Recursos adicionales

Para desarrollar páginas web destinadas a dispositivos con Android usando objetos WebView o pestañas personalizadas, consulta los siguientes documentos: