I encounter a problem of display with a webview i'm using in one of my application.
When I call loadData, the webview first display the text and then load the images of the page (standard behaviour).
Sometimes, if those images modify the text position, the old text position is not cleared and both old text and new text+image is displayed
Here a screenshot of what it looks like when the problem occurs:
It's like the webview do not redraw correctly it's content. Of course a simple invalidate() does not work...
It do no occur often but lets say one time over 20.
Code used to display the data (called outside Activity life cycle methods):
// Include the html headers to the content received from WS
String webtext = String.format(ConfigApp.HTML_BODY, wsdata.getText());
mWebView.setWebChromeClient(...);
mWebView.setWebViewClient(...);
mWebView.setBackgroundColor(0);
mWebView.loadDataWithBaseURL(null, webtext, "text/html", "UTF-8", null);
Any idea how to fix this?
I've finally found a way to fix the problem.
Remove the WebView transparent background:
String webtext = String.format(ConfigApp.HTML_BODY, wsdata.getText());
mWebView.setWebChromeClient(...);
mWebView.setWebViewClient(...);
// mWebView.setBackgroundColor(0);
mWebView.loadDataWithBaseURL(null, webtext, "text/html", "UTF-8", null);
Because my WebView has a blank background it's ok for me. Maybe it can be annoying for somebody else.
For sure it's a WebView bug.
I have frequently had sporadic problems with WebViews not displaying properly after having loaded content with loadDataWithBaseUrl. Although the WebView's height was set to wrap_content, the WebView wouldn't always resize to wrap the content. Instead the webview had a height of zero. Sometimes it would display fine and other times it would not. Sometimes the problem would only happen in a portrait orientation and landscape would work fine. I tried removing my setBackgroundColor call but that it did not help. However, I was able to get the problem to go away today by changing the layout that the WebView was in from a LinearLayout to a RelativeLayout.
If you set your WebView to a specific size, and not "wrap_content" , then after the data is loaded, the webview doesn't resize its content correctly.
I think it's a bug with the widget..
So..
Try to use "wrap_content" in the layout_height attribute.
Try
mWebView.setBackgroundColor(0x00ff0000);
You just have to call refreshDrawableState() method after calling loadDataWithBaseURL() method
and its will resolve your problem
mWebView.loadDataWithBaseURL(null, webtext, "text/html", "UTF-8", null);
mWebView.refreshDrawableState();
Related
I have done my research and I haven't found a suitable question for my problem. I got a WebView inside a ScrollView, and once I get the HTML from my service, I call
myWv.loadDataWithBaseURL(null,myHtml,"text/html","utf-8",null);
Nothing special there. The problem I'm having is that, when I run my Application in a 4.4.2 Android tablet, the WebView loads the HTML with the words split in lines, eg:
This
is
my
sentense
And after a second it renders the HTML correctly but the ScrollView's scroll is as big as the number of lines it rendered before loading the HTML correctly. I have tested in 3 different smartphones and everything is fine, only in the tablet it seems to happen, probably due to some performance issue since my HTML is huge.
Does any of you have have had this problem before and knows how to solve it? Thanks in advance.
Extend WebViewClient. And in your custom WebViewClient overload the method onPageFinished.
#Override
public void onPageFinished(WebView view, String url) {
// If you create a listener, here you can trigger it
// you can show the webview here as it will be already measured.
}
If you show the webview when the page is already entirely loaded there won't be any ugly animation.
Html content is overlapping when large content is loading in the web view. Is there a solution
for this problem?
reportView.setBackgroundColor(0);
reportView.getSettings().setBuiltInZoomControls(true);
reportView.setInitialScale(100);
reportView.getSettings().setUseWideViewPort(true);
reportView.clearView();
Try to use:
webSettings.setLayoutAlgorithm(LayoutAlgorithm.TEXT_AUTOSIZING);
in webview settings.
Fixed Html content is overlapping issue, when large content is loading in the web view.
webSettings.setLayoutAlgorithm(LayoutAlgorithm.TEXT_AUTOSIZING);
In addition to the above line, trying to reset webview instances every time
.
I have an android application that hits the WebView and displays the content. But as per the requirement initially I should hide the WebView and later on I should show it to the user.
So, initially I call setVisibility(View.GONE); and hide the visibility of the WebView. And, then I call setVisibility(View.VISIBLE); to show the WebView to the user.
1)When I am doing in this sequence, the size of the content(font and images) on the WebView are getting reduced.
2)If I don't call setVisibility(View.GONE); and directly show it to the user then size of the content(font and images) on the WebView is bigger.
I want to achieve 2 scenario by initially hiding the WebView. Means I want to hide the WebView initially, and then show to the user with bigger sized content on WebView.
How do I achieve this?
I have got this working finally!!!
Instead of using setVisibility(View.GONE); to make the webview invisible, I am using setVisibility(View.INVISIBLE);.
This way I was able to achieve the proper size of items on the webview. Dont know the exact reason for this mismatch, but it is working as expected with this change.
I can't tell just how much the sizes are changing, but have you tried using WebView.zoomIn/WebView.zoomOut? You can also set the default with WebView.getSettings().setDefaultZoom.
I'm developing an Android application and I'm loading one google maps iframe in a WebView, just like this one:
http://maps.google.es/maps/empw?url=http:%2F%2Fmaps.google.es%2Fmaps%3Ff%3Dq%26source%3Ds_q%26hl%3Des%26geocode%3D%26q%3Dmadrid%26aq%3D%26sll%3D40.396764,-3.713379%26sspn%3D11.856886,23.269043%26vpsrc%3D0%26ie%3DUTF8%26hq%3D%26hnear%3DMadrid,%2BComunidad%2Bde%2BMadrid%26t%3Dm%26z%3D10%26ll%3D40.416691,-3.700345%26output%3Dembed&hl=es&gl=es
It is showing correctly in Android emulator, but when I try in a real device a white space quite big appears at the bottom of the screen, so you can't see the whole iframe. I tried with two mobiles, one with android 2.2 and another one with android 2.3
I had a look to this one which sounds the same thing:
Problem with extra space at the bottom of android Webview
but it didn't work for me. Also tried some other things I read about like:
webView.getSettings().setUseWideViewPort(true);
webView.setWebViewClient(new WebViewClient() {
#Override
public boolean shouldOverrideUrlLoading (WebView view, String url) {
view.loadUrl(url);
return false;
}
});
but nothing worked. Any idea?
Thanks in advance.
I can see the <body> element at the link you posted has bottom margin of 14px - maybe that's it? You can eliminate it using a JavaScript snippet in your WebView after you have loaded the page, like this:
myWebView.loadUrl("javascript:document.getElementsByTagName('body')[0].style.marginBottom = '0px'");
also, there is a 44px margin on the right, if you wanna get rid of that one also, should be something like this:
myWebView.loadUrl("javascript:document.getElementsByTagName('body')[0].style.marginBottom = '0px';document.getElementsByTagName('body')[0].style.marginRight = '0px';");
Also, to future-proof your app, you may want to set all four margins to 0, just in case.
Set the bottom and right margins to 0:
webView.loadUrl("javascript:document.body.style.marginBottom=document.body.style.marginBottom= '0px'");
It could be the problem with your XML.
Can you check that your WebView is not inside the ScrollView or anything which is having its inbuilt scroll. It might result in extra white spaces.
The other answers didn't work for me but this did:
webView.loadUrl("javascript:(function () {document.getElementsByTagName('body')[0].style.marginBottom = '0'})()");
I am working on a webview with local html file as source.
I am trying to copy a Webview on to another webview.
If I do this.
WebView1.loadUrl(webView2.getUrl());
I works, but it is same as loading the webview again,which i dont want. If I do this
WebView1=WebView2;
It doesn't copy. The content of WebView1 doesn't change. Am I doing anything wrong.
You'll have to remove the current WebView from your Layout (by calling removeView(WebView1) on it's container) and then add the new WebView to it (addView(WebView2) on the same container). Obviously you'll have to take care that it gets inserted at the right place again. Easiest way would be to just wrap a FrameLayout around it and call said methods on it.
Can't promise you that this will work though, since I don't know how WebView behaves offscreen.