¿Cómo manejar páginas web "infinitas"?
Érase una vez, la vida era simple: todas las páginas web tenían una longitud finita y si no encajaban en el tamaño actual de las ventanas / vistas, simplemente se desplazaría hacia abajo hasta llegar a la parte inferior de la página.
Pero recientemente he notado que hay una nueva tendencia en el mundo del diseño web: páginas web sin fondo .
- Cargando el archivo html local en webView android
- Flash dentro de Android WebView - ¿Cómo configuro la pantalla completa de forma automática?
- Codificación UTF-8 en WebView e ICS
- Fuentes hebreas de Android 2.3 en Webview
- Obtener valor href de la etiqueta de anclaje en Android WebView cuando se hace clic en el enlace
Probablemente los ejemplos más conocidos de los sitios que utilizan estas páginas son Facebook y Twitter: se desplaza hasta el "fondo", sólo para activar alguna actualización que añade contenido a la página, por lo que el "fondo antiguo" ya no es un fondo y, hay un nuevo "fondo".
En un WebView de Android, necesito poder capturar todo el contenido actualmente disponible en esa "página", pero no estoy seguro de cómo abordar esto:
Simular el desplazamiento del usuario hacia abajo a través de View.scrollBy (int x, int y) , pageDown () o window.scrollTo () ?
¿O hay un método API que hace esto automáticamente para mí?
¿O me estoy acercando a esto completamente mal y no debería intentar llegar al "fondo real" en una captura (si es posible en absoluto)?
EDIT : Parece que el etiquetado de esta pregunta javascript
comunicó el mensaje opuesto. Estoy interesado en capturar (procesar) esas páginas sin fondo en la WebView de Android, usando Java .
- Deje de cargar en webViewClient
- Enlaces que no funcionan dentro de un WebView debido a 'X-Frame-Options' establecido en 'SAMEORIGIN'
- Las actualizaciones de la caché de la aplicación se bloquean en el estado CHECKING
- LocalStorage html5 no funciona en WebView en el dispositivo Samsung Android
- SIGSEGV cargando HTML + Flash en un WebView
- Android webview y loadData, ¿puedo obtener el botón de regreso para volver al contenido generado?
- El video de Android no se reanuda en la vista web
- ¿Cómo puedo descargar el archivo mediante webview? (Este caso es raro)
Editar: ignorar esta respuesta, he malinterpretado la pregunta. Dejando la respuesta en caso de que otros malinterpreten la pregunta también.
Puede utilizar el complemento jQPageFlow jQuery o basarse en su documentación.
El desplazamiento infinito es otra gran opción.
Este plugin jQuery hace exactamente eso: http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/
Otro, con jQuery un PHP: http://www.9lessons.info/2009/07/load-data-while-scroll-with-jquery-php.html
Independientemente de qué idioma se utiliza, la solución es bastante simple. Usted acaba de captar la capacidad del usuario (mediante la captura de y actual y compararlo a max y od la página), a continuación, Usted tiene que añadir alguna nueva información a usted contenido, por conexión asíncrona. Eso es todo. No sé muy bien Java por lo que sólo puedo dar una pista, pero la idea es la misma en todas las tecnologías / idiomas.
Dada la siguiente página web:
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!-- website code --> <!-- The endless articles you want to process --> <div class="article"> </div> <div class="article"> </div> <div class="article"> </div> <!-- ... --> </body> </html>
Aquí sería el código a utilizar:
(function($) { // closure $(function() { // when the document is ready var height = $(this).height(), // get initial height lastEl = null, // track last element processed getData = // this function will process the data as it comes in function() { var $elements = $(".article"); // don't reprocess data if(lastEl) { $elements = $elements .slice($elements.index(lastEl)+1); } lastEl = $elements .each(function() { // do what you want with the element }) // save the last element processed .get(-1) || lastEl; // finally, scroll to the bottom of the page $(window).scrollTop($(document).height()); }; $(document).bind('DOMSubtreeModified', function() { var newHeight = $(this).height(); if(newHeight != height) { height = newHeight; getData(); } }); getData(); }); })(jQuery));
Simplemente cambia el selector $ elements a lo que quieres buscar. Entonces, deberías estar bien. Es verbosa, pero también de rendimiento-luz.
- Lanzar la compilación Android de Gradle personalizada en Android Studio
- Utilice la aplicación para calificarla en el mercado