2013-04-22 13 views
9

file HTML (test.html) èTwitter Bootstrap non funziona in Android WebView

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <link href="bootstrap.css" rel="stylesheet" type="text/css"/> 
    <link href="bootstrap-responsive.css" rel="stylesheet" type="text/css"/> 
</head> 
<body> 
<h1>Hello World!!!</h1> 
<a class="btn btn-primary btn-large"> 
    Learn more 
</a> 
</body> 
</html> 

HTML e file CSS bootstrap vengono inseriti nella cartella asset. Se apro il file HTML in IE/Firefox, viene visualizzato correttamente. Ma Android WebView non rende correttamente questo

Codice in WebView è

WebView webView = (WebView) findViewById(R.id.webview); 
webView.getSettings().setJavaScriptEnabled(true); 
String url = "file:///android_asset/test.html"; 
webView.loadUrl(url); 

IE lo rende in questo modo

IE Renders it like this

WebView rende in questo modo

WebView Renders it like this

Cosa c'è di sbagliato?

+1

ti conquisterà il dispositivo fino al vostro pc per vedere se i file css si caricano (cioè non 404'ing). – munch1324

+1

ho impostato un progetto di test con il codice e non sono in grado di riprodurre questo problema, né su emulatore né su dispositivo. Puoi approfondire il tuo ambiente, il livello Android, la versione di bootstrap, ecc.? – Philzen

+0

il css potrebbe essere (anche se improbabile) utilizzando le importazioni da fonti esterne - se '\t ' non è stato impostato nel Manifest che potrebbe essere la tua spiegazione. – Philzen

risposta

2

Aggiungere questa linea

webView.getSettings().setDomStorageEnabled(true); 
+0

Non è necessario, non è in corso l'accesso alla memoria. setJavaScriptEnabled (true) non è necessario per questo particolare esempio, sebbene non sia il problema e sono sicuro che è previsto che venga utilizzato in seguito. –

1

provata su emulatore - Android versione 4.2 con Bootstrap v2.3.2

file nella cartella Assets del mio app:

bootstrap-responsive.css 
bootstrap.css 
test.html 

Non c'è bisogno di aggiungere "Android .permission.INTERNET "nel manifest Android poiché i file css sono disponibili localmente nella cartella delle risorse dell'app.

Ecco uno screenshot di come viene visualizzato. Non c'è motivo per cui non si possa vederlo a meno che non ci siano problemi con i file CSS (il che è ancora improbabile dal momento che è possibile vedere i risultati sul browser).

enter image description here

Problemi correlati