Colocar una imagen dentro de una vista web y ajustarla al ancho

Me gustaría usar un WebView para mostrar las imágenes potencialmente grandes (con el fin de aprovechar la gestión de memoria). Para la prueba estoy cargando este código en el WebView

<head></head> <body> <img alt="test" src="file:///android_asset/cute-cat-sleeping.jpg"> </body> 

El problema es que si lo carga en una web "tal cual". El WebView sólo permite alejar el zoom hasta que la primera dimensión de la imagen se ajuste en la pantalla. En este ejemplo, la altura de la imagen se muestra totalmente en el WebView y, a continuación, no se permite ampliar el zoom:

Sin zoom no setUseWideViewPort

Como se puede ver este modo no permite una visualización correcta de la imagen global a pesar de que cuando la imagen se amplía el comportamiento en las esquinas derecha e inferior son correctas como se puede ver aquí

Pantalla de zoom correcta

Así que probé el (WebView) .getSettings (). SetUseWideViewPort (true) y el resultado es que puedo alejar más que el ancho de la imagen

Con setUseWideViewPort

Y el comportamiento ampliado no es correcto en los bordes inferior derecho:

Zoom con setUseWideViewPort

Resumiendo: Me gustaría que el zoom máximo posible fuera imageWidth = ancho de la webview y comportamiento de zoom como en la segunda imagen:

Introduzca aquí la descripción de la imagen

Las respuestas completas y / o útiles serán recompensadas

EDIT: Bounty abrió para Vinayak.B

Uso de Viewport Los metadatos pueden ayudarle a hacer esto

La ventana gráfica es el área en la que se dibuja su página web. Aunque el área visible del visor coincide con el tamaño de la pantalla, el visor tiene sus propias dimensiones que determinan el número de píxeles disponibles para una página web

También intenta abajo

 WebSettings settings = webView.getSettings(); settings.setUseWideViewPort(true); settings.setLoadWithOverviewMode(true); 

Cargar archivo Html en Webview y poner su imagen en la carpeta de activos y leer ese archivo de imagen utilizando Html.

 <htm> <table> <tr> <td> <img src="cat.gif" width="100%" alt="Hello"> </td> </tr> </table> </html> 

Ahora cargue ese archivo Html en Webview

 webview.loadUrl("file:///android_asset/abc.html"); 

O de otra manera

Si utiliza LinearLayout, puede tomar un parámetro de fondo que puede ser un color o un recurso.

Así que en el archivo main.xml contiene webview. Simplemente agregó un

 android:background="@+drawable/backgroundmain" 

y use

  web.setBackgroundColor(0); 

Para que la vista web sea transparente para ver la imagen de fondo detrás.

Aquí está la solución de establecer el ancho de la etiqueta img a 100% en código HTML y luego cargarlo en su webview usando loadDataWithBaseURL(null, htnlString, "text/html", "UTF-8", null); método

Prueba este código

 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); 
  • Vista web de Android cargando HTML desde strings.xml
  • ¿Por qué Android WebView muestra una pantalla en negro?
  • Cómo modificar el contenido antes de representar en Android WebView?
  • Acerca de WebView en RecyclerView?
  • Programmatic haga clic en Android WebView
  • Usando javascript en android webview
  • LoadData intenta utilizar datos como url en la vista web
  • Transmisión de datos desde JavaScript a Android WebView
  • La vista web de Android no puede convertir el video de youtube incrustado a través de iframe
  • WebView y localhost
  • Android Webview: Ejecución de javascript desde el método java llamado desde javascript
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.