2012-01-01 21 views
33

Soy nuevo en Android. Empecé a desarrollar una aplicación usando WebView. De hecho, estoy cargando una imagen con Webview (me gusta utilizar los controles de zoom integrados de la clase). Puedo cargar la imagen con éxito, pero puedo ver algunos espacios en blanco irritantes. No puedo encontrar la manera de eliminarlo. Mis imágenes tienen un tamaño de 750 * 1000. He adjuntado mis códigos a continuación, ¡Cualquier ayuda sería muy apreciada!Eliminar espacio en blanco no deseado en WebView Android

webview.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" > 
    <WebView 
     android:id="@+id/webView" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" /> 
</LinearLayout> 

ImageViewer.java

package com.android.test; 

import android.app.Activity; 
import android.os.Bundle; 
import android.webkit.WebView; 

public class ImageViewer extends Activity { 

    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.webview); 

     String loadUrl = "file:///android_res/drawable/splash_001.jpg"; 

     WebView image = (WebView) findViewById(R.id.webView); 
     image.clearView(); 
     image.clearCache(true); 
     image.getSettings().setBuiltInZoomControls(true); 
     image.getSettings().setSupportZoom(true); 
     image.getSettings().setLoadWithOverviewMode(true); 
     image.getSettings().setUseWideViewPort(true); 
     image.loadUrl(loadUrl); 
    } 

} 

por favor me ayude !!!

+0

¿Cuáles son las dimensiones del teléfono/ficha que está utilizando para la prueba? –

+0

Intenta cambiar tu layout_xx por 'fill parent' – Ghost

+1

Hola. tienes alguna solución sobre esto. Estoy aquí golpeado en el mismo problema. ¿Puedes ayudarme? –

Respuesta

0

no sé realmente a qué espacios en blanco se refiere (tal vez la imagen tenga relleno), pero normalmente si tiene algún problema de diseño en una WebView trataría de corregirlos proporcionando un adecuado (en línea) css-stylesheet.

47

Por defecto webview tiene algo de margen/relleno en el cuerpo. Si desea eliminar que el relleno/margen luego anular cuerpo etiqueta y añadir margen como:

<body style="margin: 0; padding: 0"> 
+0

Sí, eso lo hizo por mí. Tengo que asegurarme de que AMBOS el margen y el relleno son 0. – Richard

+1

no funciona para mí –

+0

@John: Su HTML puede tener algún otro margen/relleno. Mire en su interior HTML – Sandy

20

Si el espacio en blanco que está hablando es en el lado derecho, se puede añadir esto a la vista web.

mWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY); 

Eso debería hacer desaparecer el espacio en blanco, siempre que esté en el lado derecho donde estaría la barra de desplazamiento.

+0

THx, que funcionó bien para mí. Aparentemente, si su contenido es más grande que su vista web, y por lo tanto necesita una vista de desplazamiento, la vista de desplazamiento no tiene el contenido por defecto. Por lo tanto, necesita espacio en el borde derecho de la vista web –

+0

@Ben GRACIAS. Este problema me había estado volviendo loco durante meses. – hannebaumsaway

+1

Solo para agregar 'image' hay una instancia de' WebView' en caso de que alguien se lo haya preguntado – donturner

3

Utilice el método setScrollBarStyle de WebView y proporcione el parámetro como View.SCROLLBARS_INSIDE_OVERLAY.

14

Por Defualt Las páginas web HTML tienen un relleno y un margen de 10 px; Usted tiene que fijar en su archivo de sección de la cabeza o o CSS:

<style type="text/css"> 
html, body { 
width:100%; 
height: 100%; 
margin: 0px; 
padding: 0px; 
} 
</style> 

Que hizo el truco para mí.

+0

pero cómo aplicar este estilo a la vista web, por favor ayuda –

+1

@ShirishHerwade. Necesita modificar el html que llama a su vista web. –

+0

en realidad no llamo a ningún html, uso .loadUrl (String) para mostrar una imagen –

1

Este es un ejemplo que puede probar que utiliza una plantilla html, luego puede reemplazar el texto "cuerpo" con lo que desee ... en su caso, el html para una imagen. Puede usar el CSS para diseñar el html según sea necesario. Espero que esto te ayude a comprender más sobre cómo usar los activos locales. Publique un comentario si necesita más ayuda.

Una línea clave para no perderse es <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,target-densityDpi=device-dpi" />

utilizar esto como una plantilla: (activos/template.html)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,target-densityDpi=device-dpi" /> 
    <link rel="stylesheet" type="text/css" href="style.css" /> 
</head> 
<body> 
[CONTENT] 
</body> 
</html> 

utilizar CSS como esto: (activos/style.css)

@font-face { 
    font-family: Roboto; 
    src: url(file:///android_asset/fonts/Roboto.ttf); 
} 

html, div { 
    margin: 0; 
    padding: 0; 
} 

body { 
    font-family: Roboto; 
    font-size: 1.0em; 
    color: rgb(61,61,61); 
    text-align: left; 
    position:relative; 
    padding: 40px; 
    background-color: #eeeeee; 
} 

Luego, en su clase de vista Web: (su clase que se extiende WebView)

public void setText(CharSequence text, int color){ 

     try { 

      InputStream is = getResources().getAssets().open("article_view.html"); 
      int size = is.available(); 
      byte[] buffer = new byte[size]; 
      is.read(buffer); 
      is.close(); 

      loadDataWithBaseURL("file:///android_asset/", 
       new String(buffer).replace("[CONTENT]", text.toString()), 
       "text/html", "UTF-8", null); 

     } catch (IOException e) { 
      e.printStackTrace(); 
     } 

} 
0

Establezca el relleno en su vista web.xml para 0DP

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" > 
<WebView 
    android:id="@+id/webView" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:paddingBottom="0dp" 
    android:paddingLeft="0dp" 
    android:paddingRight="0dp" 
    android:paddingTop="0dp" /> 

+0

Hay propiedad 'android: relleno ', no es necesario especificarlos por separado. Y, por cierto, eliminar todas las propiedades de relleno tendrá el mismo efecto que establecerlas en 0dp. – ccpizza

7

tuve irritante espacio en blanco que bordea el contenido HTML representado en mi WebView (no hay imágenes en que el contenido aunque). Al principio pensé que estaba relacionado con los problemas de CSS como se mencionó anteriormente. Pero al usar una hoja de estilos para cambiar el fondo de HTML, BODY, etc. parecía cada vez más como un relleno alrededor de WebView.

user3241873 muestra cómo ajustar el relleno en WebView, pero lo que encontré fue que cuando la aplicación predeterminada de Android creada por Eclipse generaba el archivo de diseño (RelativeLayout "contenedor" en lugar de "LinearLayout"), agregaba estos atributos a la RelativeLayout:

android:paddingBottom="@dimen/activity_vertical_margin" 
android:paddingLeft="@dimen/activity_horizontal_margin" 
android:paddingRight="@dimen/activity_horizontal_margin" 
android:paddingTop="@dimen/activity_vertical_margin" 

Si miras hacia arriba esos valores de relleno en res/valores/dimens.xml, verá que se ha establecido que 16DP. Cuando cambié a 0dp, eliminó el antiestético espacio en blanco :)

Si alguien reemplaza el predeterminado (Hello World) TextView con un WebView, el relleno del RelativeLayout padre se queda como un pariente detestable en la casa.

+0

Esto me ayudó. ¡Gracias! –

1

Tenía esta [este es mi activity.xml]

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" 
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" 
android:paddingRight="@dimen/activity_horizontal_margin" 
android:paddingTop="@dimen/activity_vertical_margin" 
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity"> 

simplemente he eliminado el relleno en el RelativeLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" 
android:layout_height="match_parent" 
tools:context=".MainActivity"> 

Probé todas las soluciones anteriores pero no lo hicieron va muy bien para mi éste trabajó para mí.

-1

Ya lo tengo.

aquí mi código de la lógica, cuando la aplicación abre el sitio web debe obtener el tamaño de su vistaweb luego otra vez en la altura

aquí mi código

ViewGroup.MarginLayoutParams p = (ViewGroup.MarginLayoutParams) webpage.getLayoutParams(); 
     p.height = webpage.getHeight(); 
     Log.e(" webpage.getHeight()", String.valueOf(webpage.getHeight())); 
     webpage.setLayoutParams(p); 

Esperamos que se tome mi código y mi respuesta a :) funciona en cualquier dispositivo incluso pestañas también :)

-1

Mi caso, la parte superior de mi página web tiene un gran relleno. Por lo tanto, establezca scrollbarSize = "0dp". En AS 2.2.3

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" > 

<WebView 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:id="@+id/webView" 
android:scrollbarSize="0dp" 
/> 
Cuestiones relacionadas