On some Android Oreo devices, when I load an url on webview for the first time, the URL page loads properly. However, when I load the URL again, the page is zoomed out. On devices lower than android oreo, the page loads properly for all devices.
Also, when you kill the app on the background and load again, the URL loads properly. On the second and succeeding tries, it shows the zoomed out version again. I attached the images of loaded URL below
Below is the correct loading of webpage on the webview
Below is the small display of webpage on webview webview
Android XML Code:
<WebView
android:id="#+id/content_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
Java Code:
private WebView mWebView;
mWebView = (WebView) view.findViewById(R.id.content_view);
mWebView.loadUrl("https://policies.google.com/");
URL: https://policies.google.com/
Take note that this happen in other URLs too. https://policies.google.com/ is just an example
It works on the following:
Huawei nova 2i RNE-L22, Android 8.0.0
It DOES NOT work on the following
Android 8.1.0; Pixel 2
Android 8.0.0; Samsung SM-G950FD
Android 8.0.1; Huawei P20 EML-L29
Any suggestions or reasons as why this happens? How to fix this?
Thanks in advance.
if you have problems related to zoom in webview
try to add zoom in and zoom out functions to your webview
you can add these lines to your java code, to implement zooming in and out
mWebView.loadUrl(url);
//code for zooming functions
webview.getSettings().setBuiltInZoomControls(true);
webview.getSettings().setSupportZoom(true);
//for javascript
webView.getSettings().setJavaScriptEnabled(true);
After asking google team about this issue,
the said that it's probably some viewport layout settings. Webview has some unfortunate defaults due to legacy issues.,
Adding webview.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING); fixed the issue.
Related
Is there any equivalent function in XWalkView for setLoadWithOverviewMode?
I am working on a Android application that load a website in a XWalkView. The view zooms in the top left corner of the website when it loaded. I couldn't find anyway to set the initial zoom level of the XWalkView. As for the android webview, i used setLoadWithOverviewMode for the job, but the xwalk 11 library does not support getSetting() method anymore.
Help would be very much appreciated.
Sorry for my bad english.
In latest versions (I'm on 20.50.529) you can use this to get an initial zoom of 100%
XWalkView webView=new XWalkView(this);
webView.getSettings().setInitialPageScale(100);
webview.loadUrl("http://example.com/image.gif");
loads an animated gif
webview.loadData("<img src='http://example.com/image.gif'/>","text/html", "UTF-8");
loads a static image
webview.loadUrl("http://example.com/gif.html");
loads a page where every gif is not animated.
i've tested this on the emulator and on my galaxy tab 10.1 running 4.0.4. I've seen some apps that load a webview with a page and they have animated gifs soo i must be missing something.
webview.getSettings().setJavaScriptEnabled(true);
doesn't change anything and i've tried http://code.google.com/p/slidetypekeyboard/source/browse/trunk/assets/index.html but it wont animate the gif either
what i'm asking : how to enable gif animation with .loadData() ? To expand, i want
webview.loadData("<center><img src='http://example.com/image.gif'/><center>","text/html", "UTF-8");
to display the animated gif.
I had the same problem. This answer helps me. It has a different theme, but main trick is that
"For some reason loadDataWithBaseURL and loadData functions have completely different implementation."
Try this:
webview.loadDataWithBaseURL(null, "<center><img src='http://example.com/image.gif'/><center>", "text/html", "utf-8", null);
I Want to Show WebPage Inside WebView. Up to this it is fine.
But I have WebPage (As Given Below) and I want Certain Part of it. I mean just Top Left Corner should be visible in fit to screen mode in all the devices.
I'm resolving this Problem since last two three days.
What I want : I want to Show Top Left Corner of webpage to show inside Webview by Whatever the Stratergy May be with zoom or any other Option but it Should be fit to screen for all the device.
One More thing I can't change the Source Code of Webpage, because it is fixed.
I have to manage by code itself.
What I have Tried : I have refer Stackoverflow links but no luck.
Here is my Code. :
WebView wv;
wv = (WebView) findViewById(R.id.webview_MyPoops);
wv.getSettings().setJavaScriptEnabled(true);
// wv.setInitialScale(185);
// wv.setInitialScale(30);
String URL = "MY_LINK";
wv.loadUrl(URL);
WebSettings webSettings = wv.getSettings();
webSettings.setSavePassword(false);
webSettings.setSaveFormData(false);
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportZoom(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setUseWideViewPort(true);
I'm getting complete webpage shown in devices.
It Works fine in My LG Device(Which has Resolution of 480*800) but in big device or tabs like Galaxy Tab2, I'm getting very small image of Top Left Corner and all other Area of screen are just background of WebPage.
Below is the screenshot of Galaxy Tab2 after Running the above code.
Please have you Any suggestion where I am lacking. Thanks in Advance.
try with this code hop this work for u.
webview.setInitialScale(getScale());
private int getScale(){
Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
int width = display.getWidth();
Double val = new Double(width)/new Double(200);
Log.e("hh", "** "+val);
val = val * 100d;
Log.e("hh", "** "+val);
return val.intValue();
}
You could try using HtmlCleaner (examples of how to use it here) to get the html from the webpage, then extract the part you want to display and load it into the WebView using: WebView.loadData();.
I used this method in one of my apps to reformat a page so that it would be easier to use on a mobile device.
On the HTML page you can have something like target-densitydpi=240;
depending on device type just set this parameter from your Java code, the page will automatically fit to target density.
I believe the fix should be done only at the web page level and ideally WebView cannot do any tricks here. WebView is simply a browser(to be specific chromium browser) which should just do rendering as instructed by the web page.
In order to actually fix your issue, you should try modifying the CSS of the web page.
WebView x;
x.setInitialScale(1);
This is the furtheset zoom possible. But for some sites it just looks pure UGLY.
This was the second version I found
test1.getSettings().setDefaultZoom(ZoomDensity.FAR);
Thats a nice all rounder than seems to just zoom out far enough for a lot but still not what I was looking for.
And now here is the final solution I have.
x.getSettings().setLoadWithOverviewMode(true);
x.getSettings().setUseWideViewPort(true);
Basically what these do is answered in another question like this.
setLoadWithOverviewMode(true)
Loads the WebView completely zoomed out
setUseWideViewPort(true)
I am using web view to load HTML page which as background image (827 x 1102), I trying to wrap the content within the given height and width of the webView and I don't want to scroll the content at initial stage by exploring regarding this I came to know about below lines of code
mwebview.getSettings().setLoadWithOverviewMode(true);
mwebview.getSettings().setUseWideViewPort(true);
The above code is working fine on 2.2, 2.3.3 but it is adding extra space on 3.0 and higher version, you can check the attached images on different version.
I even tried by appending
<head><meta name=viewport content=target-densitydpi=device-dpi/></head>
In html file but no luck.
Motorla Xoom 3.0
Samsugn Tab 2.3.3
Any help will be appreciated
Thank you in Advance
in my app i am trying to load a webpage. The webpage contains an image. I want the image to be exactly within the android device screen size. I want the image to be fitted to the evice.
In the web contents we have added the view port tag. I have loaded the URL in default browser of the device,the web page looked to be fitted in 2.1 but in 2.2 version the image seems to be very large. So i loaded the URL in a web view as follows
webView = (WebView)findViewById(R.id.webView1);
WebSettings webSettings = webView.getSettings();
webSettings.setUseWideViewPort(true);
webView.setInitialScale(30);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl("http://xxxxxxxxxxx/get_ban/3");
Now the image is looking good in 2.2 version and in 2.1 it looks very small.
I want the image to be fitted to the screen size common for all the os version, how to do this......
try to use this
setLoadWithOverviewMode(true);
Is it the effect?
Try to use it with
setUseWideViewPort(true);