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

Android te permite aprovechar el poder de la Web en tu app para que puedas beneficiarte de la flexibilidad y la eficiencia de mostrar ciertos tipos de contenido.

Incorpora contenido con WebView

La API de WebView te brinda acceso a las funciones de un navegador en miniatura para mostrar contenido web dentro de tu app. Esto te permite proporcionar experiencias basadas en la Web como una 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 apoyo dentro de un cuadro rojo.
Figura 1. Contenido web incorporado en la app con objetos `WebView` como contenido principal (izquierda) y complementario (derecha)

Qué puede hacer WebView

Puedes hacer lo siguiente con WebView en tu app:

  • Incorporación de contenido web: Un WebView se integra en la interfaz de usuario de una app como un componente, de forma similar a un botón o un campo de texto.

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

    • URLs remotas: Puede recuperar y mostrar páginas web de Internet, como 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 al WebView.

  • Renderización: WebView usa su motor de navegador para analizar y renderizar el HTML, el CSS y el JavaScript, y muestra la página web resultante dentro de su área designada en 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 la WebView.

  • Interactúa 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.

    • De JavaScript al 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 acceder 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 de 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 forma más amplia, la experiencia general de un WebView está determinada 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: Se usa un WebView 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, una barra de direcciones o un menú de configuración.

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

Actualizaciones: Como Android WebView es un servicio del sistema en Android, las actualizaciones se envían y se integran en las apps automáticamente de forma mensual. Los navegadores dependen de las actualizaciones de las 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 Compila apps web en WebView.

Recursos adicionales

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