different behavior between webview's loadUrl() and loadData() - android

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);

Related

Android 13 webview change images to obj on the edit click

I have issue.
I'm using webview for html loading. Webview contains contenteditable="true" for editing.
Html can be with img and blockquote tag.
In android till 12 webview all img show fine, but in android 13, then you click in webview for editing, webview change real images to obj as shown in screen:
It seems like webview applies some resizing or scaling.

Android Oreo WebView renders layout too small after 2nd loading

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.

How to show Certain Part of WebPage inside Webview With Fit Screen to All Devices

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)

WebView to be exact to the screen size in android app

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);

Android WebView.loadDataWithBaseURL first page load is a mess. How to fix it?

I use WebView.loadDataWithBaseURL for loading my help page from internal resources of my application.
I have help.html and a few images located in the assets directory. The page loads and shows with images, but the text around image is a mess. It did not show on the right side of the image, instead the image overlaps the text.
This happens only on first loading of the page. If I close the WebView and open it again, then everything is fine.
It seems that at first loading WebView spends some time for loading images and does not reformat page after that. On the second attempt images are cached and displayed together with text and properly formatted.
What is the solution for this problem?
Did anyone face this problem too?
Here is my code:
app.setContentView(R.layout.help);
final WebView web = (WebView) app.findViewById(R.id.helpWebView);
web.setBackgroundColor(0);
web.loadDataWithBaseURL("file:///android_asset/", helpHtml, "text/html", "utf-8", null);
Web page is inside the helpHtml string with the code:
<html><head></head><body><img src="html/flddesc.png" align="left"/>this should be my long long text...</body></html>
P.S: html/flddesc.png is a PNG8 image 180x200 ~20kb of size
Try this function:
webview.loadUrl("file:///android_asset/your_html.html");

Categories

Resources