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

Android te permite aprovechar la potencia de la Web en tu app. De esta manera, puedes beneficiarte de la flexibilidad y la eficiencia de mostrar ciertos tipos de contenido.

Cómo incorporar contenido con WebView

La API de WebView te brinda acceso a las capacidades de un mininavegador para mostrar contenido web en tu app. Esto te permite proporcionar experiencias basadas en la Web como parte principal o de apoyo dentro de tu app, como se muestra 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 asistencia dentro de un cuadro rojo.
Figura 1. Contenido web incorporado en la app con objetos `WebView` como contenido principal (izquierda) y de apoyo (derecha).

Qué puede hacer WebView

Puedes hacer lo siguiente con WebView en tu app:

  • Incorporar la Web: Un WebView se integra en la interfaz de usuario de una app como un componente, de manera similar a un botón o un campo de texto.

  • Cargar contenido: WebView puede cargar contenido web de varias fuentes:

    • URLs remotas: Puede recuperar y mostrar páginas web de Internet, al igual que un navegador normal.
    • Archivos locales: Puede 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 de forma dinámica y proporcionarlo a WebView.

  • Renderizar: 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 en el contexto de la página web cargada. Esto permite interacciones y actualizaciones dinámicas dentro de WebView.

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

    • JavaScript a código de la app: El código JavaScript que se ejecuta en un 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.

    • Código de la app a JavaScript: La app también puede insertar código JavaScript en un 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

Un WebView es un componente altamente personalizado que proporciona la funcionalidad principal de una ventana a la Web. A diferencia de un navegador, que proporciona una barra de navegación y otros elementos de la interfaz de usuario para navegar por la Web de manera más amplia, la experiencia general de un WebView se define por 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: Un WebView se usa para mostrar contenido web y no tiene su propio encabezado ni IU como la mayoría de los otros navegadores comunes, por ejemplo, un botón de inicio, barra de direcciones o un menú de configuración.

Funciones: Muchos navegadores tienen funciones integradas para aumentar la experiencia de navegación, como marcadores, permisos o historial.

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

Comenzar

Para obtener información sobre cómo usar WebView en tu app, consulta el documento Cómo compilar apps web en WebView.

Recursos adicionales

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