programacion - manual de android en pdf
¿Puede WebView de Android cambiar automáticamente el tamaño de imágenes enormes? (7)
En algunos navegadores web, las imágenes enormes se redimensionan automáticamente para adaptarse a la pantalla.
¿Es posible hacer lo mismo en Android WebView?
La página web solo contiene la imagen, ¿tal vez agregar algo de JavaScript podría hacer el truco?
¿Alguien ya ha hecho esto?
Nota: no sé el tamaño de la imagen de antemano.
Mis favoritos :
String data = "<html><body ><img id=/"resizeImage/" src=/""+PictureURL+"/" width=/"100%/" alt=/"/" align=/"middle/" /></body></html>";
webview.loadData(data, "text/html; charset=UTF-8", null);
Puede enviar el tamaño que desee en los parámetros de solicitud y dejar que el servidor configure el ancho / alto en el elemento img por usted.
Puede hacer que el navegador cambie el tamaño de la imagen para que se ajuste al ancho máximo de la pantalla:
<img src="huge-image.jpg" width="100%" />
También es posible cambiar el tamaño de su altura a la ventana gráfica de WebView:
<img src="huge-image.jpg" height="100%" />
Sin embargo, cambiar el tamaño del ancho y la altura daría como resultado una imagen estirada. Para cambiar el tamaño del ancho o alto dependiendo de qué lado se ajuste mejor, puedes considerar un poco de JavaScript, como este:
<img src="huge-image.jpg" onload="resize(this);" />
<script type="text/javascript">
function resize(image)
{
var differenceHeight = document.body.clientHeight - image.clientHeight;
var differenceWidth = document.body.clientWidth - image.clientWidth;
if (differenceHeight < 0) differenceHeight = differenceHeight * -1;
if (differenceWidth < 0) differenceWidth = differenceWidth * -1;
if (differenceHeight > differenceWidth)
{
image.style[''height''] = document.body.clientHeight + ''px'';
}
else
{
image.style[''width''] = document.body.clientWidth + ''px'';
}
// Optional: remove margins or compensate for offset.
image.style[''margin''] = 0;
document.body.style[''margin''] = 0;
}
</script>
Puedes usar esto:
WebView webView = (WebView) findViewById(R.id.myWebView);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
Encontré esta solución aquí: Cómo establecer el zoom / ancho inicial para una vista web
Si su ancho de WebView
es fill_parent
, puede usar este código:
Display display=getWindowManager().getDefaultDisplay();
int width=display.getWidth();
String data="<img src=''http://example.com/image.jpg'' style=''width:"+width+"px'' />";
webView.loadData(data, "text/html", "utf-8");
¡Y el zoom sigue funcionando!
Mismo método si la height
es fill_parent
.
Si es posible. Puede probar configurando WebView usando el siguiente código. Cambia el tamaño de todas las imágenes (mayor que el Device Screen Width
de la pantalla del Device Screen Width
) al Device Screen Width
de la pantalla. Esto funciona para ambas orientaciones (vertical y horizontal)
webview.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
Puede agregar márgenes extra / relleno más adelante para obtener el espaciado correcto.
webview.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
funciona, pero está en deprecated . Esta es otra solución sin LayoutAlgorithm.SINGLE_COLUMN, usando CSS:
@SuppressLint("NewApi")
private openWebView() {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.TEXT_AUTOSIZING);
} else {
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.NORMAL);
}
String data = "<div> your HTML content </div>";
webView.loadDataWithBaseURL("file:///android_asset/", getHtmlData(data), "text/html", "utf-8", null);
}
private String getHtmlData(String bodyHTML) {
String head = "<head><style>img{max-width: 100%; width:auto; height: auto;}</style></head>";
return "<html>" + head + "<body>" + bodyHTML + "</body></html>";
}