WebView de Android cargando en blanco al ver listas anidadas html
Estoy intentando cargar una lista anidada html razonablemente clasificada en un WebView usando Android. El problema es que cuando intento cargar el html, parece estar en blanco.
Ahora he intentado esto de un par de maneras diferentes. Primero probé el código dentro del W3Schools "Try It Yourself" cuadro – W3Schools . De aquí, una vez que consigo a cierto tamaño, exhibe un error. Así que a partir del código de abajo, si te deshaces de los últimos títulos, se muestra fino hasta un tamaño determinado.
- ¿Qué significa "instalar plugin de Flash" en WebView?
- Android: cómo seleccionar textos de la vista web
- ¿Hay alguna forma de detectar errores en la consola Web?
- ¿Cómo acceder a los activos locales desde una URL remota en Android WebView?
- Los identificadores de selección no aparecen en WebView (Android 4.0-4.3)
He puesto el código html en un archivo html local, y todos los navegadores lo hacen bien.
He colocado este archivo en mi carpeta de activos dentro de Android, y trató de cargar el archivo en el WebView, y es la misma historia. Llego a un cierto tamaño en la lista y no muestra nada. He cargado esto con el siguiente código:
wv_content.loadUrl("file:///android_asset/test.html"); También he cargado el código html directamente, y es la misma historia. Una vez que llega a cierto tamaño, no muestra nada. He cargado este contenido html mediante el siguiente código:
wv_content.loadDataWithBaseURL(null, htmlData, "text/html", "utf-8", null);
He intentado reemplazar los nulos con cadenas vacías, y urls, pero aún no hay diferencia.
Así que lo curioso es que un archivo local con los datos se procesará perfectamente a través del navegador de escritorio. El contenido html no se procesará cuando se ingrese usando las W3Schools Try It Yourself. Android no mostrará el archivo o el contenido html. Sin embargo, en el iOS, el código muestra muy bien.
Estoy realmente atascado a cómo puedo proceder, ¿alguien tiene alguna idea sobre cuál es el problema o se han encontrado con algo similar?
El siguiente es el código html que estoy usando:
<!DOCTYPE html> <html> <body> <ol type='I'> <li>Heading 1</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 2</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 3</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 4</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 5</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 6</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 7</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 8</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 9</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 10</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 11</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 12</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 13</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 14</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 15</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> </ol> </body> </html>
- Las imágenes se cargan más rápido en la vista web
- Establecer el color del cursor en una vista web de Android
- WebView de Android ignorando target = "_ blank" cuando se agrega WebViewClient
- El teclado flexible de Android oculta las entradas de CordovaWebView cuando está en pantalla completa
- El tamaño de las fronteras en WebView se representa de forma diferente
- ¿El método loadUrl de WebView se ejecuta en un subproceso de UI?
- La vista web de Android conserva los datos del formulario cuando cambia la orientación
- Llamar a métodos Android desde JavaScript
(Reescribiendo este post como por la solicitud de @ Graham, con la esperanza de que podría ayudar a resumir el problema, y también con el fin de obtener la recompensa.
Dado que el título se trata de listas anidadas HTML, primero debemos asegurarnos de que el código fuente HTML sea correcto, así que comprobé que tanto con W3Schools como con Android Browser.
-
W3Schoolsno permite la presentación de código que exceda una cierta longitud, como 5000, en"Try It Yourself". Simplemente comprueba esto en JS cuando haces clic en el botón Enviar código. Así que mostrar "error" en W3Schools no significa necesariamente algo malo en su código HTML. Además, si desea validar su código HTML, puede consultar W3 Validator . -
La página HTML de ejemplo funciona correctamente en mi dispositivo con Android Browser de existencias. Si imprime el árbol DOM y el árbol de renderización del motor de webkit, también encontrará los dos correctos.
Entonces finalmente @Graham identificar el problema, que se relaciona con la configuración de Android HW aceleración:
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
En cuanto a este tema hay una explicación muy detallada en Android Doc , tal como @ ZalaJanaksinh indicado en otro post.
Espero que ayude…
No sé por qué se enfrenta a problemas He intentado el mismo código y está funcionando bien, por favor, compruebe esto-
public class MainActivity extends Activity { WebView webView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); webView=(WebView)findViewById(R.id.web); webView.loadUrl("file:///android_asset/test.html"); } }
Y esta es la captura de pantalla adjunta-
Este es el dispositivo problema para procesar el texto html. Este es el mismo problema que se producen cuando el usuario cargar imagen grande (tamaño) de sdcard, etc Nada cambie en su código sólo tiene que añadir la siguiente propiedad en el archivo de manifiesto de Android.
android:hardwareAccelerated="false"
Por defecto es cierto. En la comunidad de desarrolladores debate muy fuerte sobre el uso de Android: hardwareAccelerated o no! Compruebe este enlace – Cómo utilizar el android: hardwareAccelerated. Cómo utilizar. Otra cosa link Utilizar o no
Por favor, consulte el código escrito a continuación y encontrar la salida ….
public class MainActivity extends Activity { private WebView webview; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); webview = (WebView)findViewById(R.id.webview); webview.getSettings().setJavaScriptEnabled(true); webview.loadUrl("file:///android_asset/test.html"); } } <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/relativeLayout" android:layout_width="match_parent" android:layout_height="match_parent" > <WebView android:id="@+id/webview" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout> <!DOCTYPE html> <html> <body> <ol type='I'> <li>Heading 1</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 2</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 3</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 4</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 5</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 6</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 7</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 8</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 9</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 10</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 11</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 12</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 13</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 14</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> <li>Heading 15</li> <ol type='a'> <li>Sub Heading 1</li> <li>Sub Heading 2</li> <li>Sub Heading 3</li> <li>Sub Heading 4</li> <li>Sub Heading 5</li> </ol> </ol> </body> </html>
Tuve el mismo problema – Incluso podía ver la salida de cromo javascript consola en logcat. Resulta que el diseño era el problema.
He utilizado el diseñador de diseño para arrastrar una webview en mi actividad y se agregó automáticamente a los layouts de archivo xml:
<WebView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/webView" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_alignParentStart="true" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_alignParentEnd="true" />
Estaba mirando el post de Manish Srivastava y vi que su diseño webview era diferente. Cambié la mía por:
<WebView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/webView" />
Y todo funcionó muy bien. Espero que esto ayude a alguien en el futuro!
- Orden de la inyección de dependencia al usar los alcances
- Los usuarios de Android sin cámaras en sus dispositivos no pueden descargar mis aplicaciones de Google Play. ¿Por qué?