2

i am loading html file from sdcard to webview but when i load html from sdcard to webview it will not load properly css and images and video is not loading in webview.

Work With 4.4 kitkat and chrome version
Not Work With below 4.4 kitkat version

I have tried both way direct pass url in loadUrl and loadDatawithBaseurl but nothing properly work for me.

    mWebview=(WebView)findViewById(R.id.webview);
    mWebview.getSettings().setJavaScriptEnabled(true);
    mWebview.setWebChromeClient(new WebChromeClient());
    mWebview.setWebViewClient(new WebViewClient());
    mWebview.loadUrl("file:///storage/emulated/0/13119/news66.html");

also try with this 

 data=getHTMLDataBuffer("file:///storage/emulated/0/13119/news66.html");
 mWebview.loadDataWithBaseURL("file://"+Environment.getExternalStorageDirectory().getAbsolutePath().toString()+"/13119/",data,"text/html","UTF-8", null);

Chrome ScreenShot enter image description here

Webview ScreenShot

enter image description here

Mahesh
  • 1,559
  • 6
  • 27
  • 57

2 Answers2

1

It looks like your webpage has some media in it (Video, image) which is not being loaded.

Try:

  • Add internet permission for your app. It is possible that the media is not loading because it is coming from the internet, but you don't have internet permission, so the webview does not load it (That would explain why it loads OK in Chrome)

  • Does it happen with all HTML files? There are some new standards which the webview does not support, but chrome does, which may explain why it does not work.

  • Try loading your HTML file in a different browser and see if it works.

  • You could upload your HTML file somewhere (Zip it first), and ill have all look at it.

EDIT: your HTML is bad. In news66 I see:

body { margin:0;background: url("TS-INFO-16-9-HD.png") no-repeat scroll center center / 1920px 100% rgba(0, 0, 0, 0); height:100% important; overflow:hidden; }

Change to:

body { margin:0;background: url("TS-INFO-16-9-HD.png") no-repeat scroll center center; height: 100%; }

And it works. Similar for all the others.

Jonas Czech
  • 12,018
  • 6
  • 44
  • 65
  • (1) i am load html from sdcard so internet permission not required but i already give that permission (2) it is not happen with all html files this will happen with only used html files (3 ) i tried with firefox it was working (4) i will give you file give me minute – Mahesh Feb 05 '15 at 10:58
  • you can check html file from here – Mahesh Feb 05 '15 at 11:35
  • Your HTML fie has html5 video content in it, which is not properly supported by webView. See [here](https://github.com/cprcrack/VideoEnabledWebView) for a video library for webview, and [here](http://stackoverflow.com/questions/3815090/webview-and-html5-video) for a related SO question. – Jonas Czech Feb 05 '15 at 12:03
  • but also the background image still not coming in news33.html – Mahesh Feb 05 '15 at 12:08
  • news33 not have video in html – Mahesh Feb 05 '15 at 12:10
  • It seems that your file also has some text in it which is not rendering, not quite shure why... could be a bug in WebView, badly designed webpage, or other things. EDIT: try enabling JavaScript in your webview (See the other answer above) – Jonas Czech Feb 05 '15 at 12:12
  • Figured it out. See answer. – Jonas Czech Feb 05 '15 at 15:48
  • thanks it is work for me jut because of css issue but one question still in my mind chrome and firefox how load this before changes if you have any idea – Mahesh Feb 06 '15 at 05:43
  • Chrome / Firefox are smart enough to properly render bad HTML, the WebView is more basic and cannot do it. – Jonas Czech Feb 06 '15 at 10:07
0

Problem may be your background image is too big or "not supporting" type. your chrome browser has fully setup-ed webview where your webview may not. so to make webview rendering process easier. Use some web view functions like

webView = (WebView) findViewById(R.id.webView1);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setDisplayZoomControls(false);
webView.getSettings().setPluginsEnabled(true);
webView.getSettings().setJavaScriptEnabled(true);
webView.setHorizontalScrollBarEnabled(false);
webView.getSettings().setDomStorageEnabled(true);

do some searching about webview setup. there are more.

Prabhu Vignesh Rajagopal
  • 1,028
  • 10
  • 19
  • Since your page is working fine in browsers, you don't have problem in it so what you need to do is to check your java code whether it fulfilled all setups you need to do. Look at this way you will find it. for more reference follow this [link](http://stackoverflow.com/a/19023236/4269160) – Prabhu Vignesh Rajagopal Feb 05 '15 at 11:33