I'd like to use a WebView for displaying images potentially big (in order to seize it memory management). For the test i'm loading this code in the WebView
<head></head>
<body>
<img alt="test" src="file:///android_asset/cute-cat-sleeping.jpg">
</body>
The problem is that if I load it in a web "as is". The WebView only allow to zoom out until the first dimension of the image is fit in screen. In this example the image height is totally shown into the WebView and then no more zoom allowed:
As you can see this mode doesn't allow a correct display of the global image despite that when the image is zoomed the behaviour in the right and bottom corners are correct as you can see here
So I tried the (WebView).getSettings().setUseWideViewPort(true) and the result is that I can zoom out more than the image's width
and the zoomed behaviour is not correct in the bottom-right borders:
Summarizing: I'd like the max zoom out possible to be imageWidth=webview width and zoom behaviour like in the second image:
Complete and/or usefull answers will be bountied
EDIT: Bounty opened for Vinayak.B
Using Viewport Metadata may help you to do this
The viewport is the area in which your web page is drawn. Although the viewport's visible area matches the size of the screen, the viewport has its own dimensions that determine the number of pixels available to a web page
Also try below
WebSettings settings = webView.getSettings();
settings.setUseWideViewPort(true);
settings.setLoadWithOverviewMode(true);
Load Html file in Webview and put your image in asset folder and read that image file using Html.
<htm>
<table>
<tr>
<td>
<img src="cat.gif" width="100%" alt="Hello">
</td>
</tr>
</table>
</html>
Now Load that Html file in Webview
webview.loadUrl("file:///android_asset/abc.html");
Or another way
if you use LinearLayout, can take a background parameter that can be a colour or a resource.
So in main.xml file contains webview. you simply added a
android:background="@+drawable/backgroundmain"
and use
web.setBackgroundColor(0);
To make the webview transparent to see the background image behind.
here is the solution set the img tag width to 100% in HTML code and then load it in your webview using loadDataWithBaseURL(null, htnlString, "text/html", "UTF-8", null);
method
try this code
String htnlString = "<!DOCTYPE html><html><body style = \"text-align:center\"><img src=\"http://shiaislamicbooks.com/books_snaps/UR335/1.jpg\" alt=\"pageNo\" width=\"100%\"></body></html>";
yourWebView.loadDataWithBaseURL(null, htnlString, "text/html", "UTF-8", null);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With