Color de fondo del estilo Android WebView: transparente ignorado en Android 2.2


157

Estoy luchando por crear un WebView con fondo transparente.

webView.setBackgroundColor(0x00FFFFFF);
webView.setBackgroundDrawable(myDrawable);

Luego cargo una página html con

<body style="background-color:transparent;" ...

El color de fondo de WebView es transparente, pero tan pronto como se carga la página, se sobrescribe con un fondo negro de la página html. Esto solo ocurre en Android 2.2, funciona en Android 2.1.

Entonces, ¿hay algo que agregar en el código de la página html para que sea realmente transparente?


1
Siento decirlo, pero para mi problema sin solución señaladas aquí trabajé ...: = (gracias de todos modos .. la página web siempre se utiliza un fondo blanco ...
CV2

Respuestas:


292

Esto funcionó para mí

mWebView.setBackgroundColor(Color.TRANSPARENT);

1
¿Realmente has probado en os 2.2?
jptsetung

87
Descubrí que esto debe llamarse DESPUÉS de cargar la URL o los datos.
Mark

11
no está funcionando en Android 3.x si está utilizandoandroid:hardwareAccelerated="true"
Macarse

2
Tenga en cuenta que en ICS (4.0.3), además de los comentarios anteriores; Tuve que deshabilitar "Configuración -> Opciones de desarrollador -> Forzar procesamiento de GPU" para que la transparencia funcione con el nivel 10 de API.
Aki

10
En realidad, no entiendo por qué esta respuesta obtiene tantos votos. webView.setBackgroundColor (0x00000000); es exactamente lo mismo que webView.setBackgroundColor (0x00FFFFFF); El valor alfa es 0x00.
jptsetung

128

Al final de este tema mencionado anteriormente hay una solución. Es una combinación de 2 soluciones.

webView.setBackgroundColor(Color.TRANSPARENT);
webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Al agregar este código al WebViewer después de cargar la url, funciona (API 11+).

Incluso funciona cuando la aceleración del hardware está activada


2
Funciona siempre que la vista web no sea desplazable.
Rany Ishak

Necesitaba establecer el color de fondo después de forzar la representación del software en el Samsung S3
neworld

77
webView.setBackgroundColor (Color.argb (1, 0, 0, 0)); si no desea que el fondo parpadee en desplazamiento
Trent Seed

@Trent Probé su método y si solucionó el problema de parpadeo en Jelly Bean, pero ahora muestra un fondo negro en Gingerbread. ¿Alguna otra sugerencia?
Tiago

2
¡Esto deshabilita la aceleración de hardware para la vista web! ! Esto no era obvio para mí (culparme por no buscarlo antes de usar: D), y la última oración de la respuesta deja la impresión opuesta. Esto realmente afecta muchas cosas, videos, transformaciones de UI, desplazamiento, lienzo, etc. Una posible solución stackoverflow.com/a/17815574/2487876
Kristjan Liiva el

36

Tuve el mismo problema con 2.2 y también en 2.3. Resolví el problema dando el valor alpa en html no en android. Intenté muchas cosas y descubrí que el setBackgroundColor();color no funciona con el valor alfa. webView.setBackgroundColor(Color.argb(128, 0, 0, 0));no trabajará.

Así que aquí está mi solución, funcionó para mí.

      String webData = StringHelper.addSlashes("<!DOCTYPE html><head> <meta http-equiv=\"Content-Type\" " +
      "content=\"text/html; charset=utf-8\"> </head><body><div style=\"background-color: rgba(10,10,10,0.5); " +
      "padding: 20px; height: 260px; border-radius: 8px;\"> $$$ Content Goes Here ! $$$ </div> </body></html>");

Y en Java

    webView = (WebView) findViewById(R.id.webview);
    webView.setBackgroundColor(0);
    webView.loadData(webData, "text/html", "UTF-8");

Y aquí está la captura de pantalla de Salida a continuación.ingrese la descripción de la imagen aquí


Perfecto, gracias !
Ayman Mahgoub


22

Así es como lo haces:

Primero haga que su proyecto se base en 11, pero en AndroidManifest establezca minSdkVersion en 8

android: hardwareAccelerated = "false" es innecesario y es incompatible con 8

wv.setBackgroundColor(0x00000000);
if (Build.VERSION.SDK_INT >= 11) wv.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

this.wv.setWebViewClient(new WebViewClient()
{
    @Override
    public void onPageFinished(WebView view, String url)
    {
        wv.setBackgroundColor(0x00000000);
        if (Build.VERSION.SDK_INT >= 11) wv.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);
    }
});

Por seguridad pon esto en tu estilo:

BODY, HTML {background: transparent}

trabajó para mí en 2.2 y 4


esto funciona para mí: android: hardwareAccelerated = "false" BODY, HTML {background: transparent}
jayellos

12

Lo más importante no fue mencionado.

El html debe tener una bodyetiqueta con background-colorset to transparent.

Entonces la solución completa sería:


HTML

    <body style="display: flex; background-color:transparent">some content</body>

Actividad

    WebView wv = (WebView) findViewById(R.id.webView);
    wv.setBackgroundColor(0);
    wv.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
    wv.loadUrl("file:///android_asset/myview.html");

Se menciona en la pregunta. Pero esto parece ser un buen resumen de lo que tiene que hacer si desea que funcione en todas las versiones de Android.
jptsetung

9

el siguiente código funciona bien en Android 3.0+, pero cuando prueba este código debajo de Android 3.0, su aplicación se cierra por la fuerza.

webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Intenta el siguiente código en tu API inferior a 11 .

webview.setBackgroundColor(Color.parseColor("#919191"));

O

También puede probar el siguiente código que funciona en todas las API bien.

    webview.setBackgroundColor(Color.parseColor("#919191"));
    if (Build.VERSION.SDK_INT >= 11) {
        webview.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);
    }

uso del código anterior completo para mí.


No te recomiendo que configures el tipo de capa en LAYER_TYPE_SOFTWARE. Reduce drásticamente el rendimiento, especialmente al desplazarse.
Navarro

8

Tratar webView.setBackgroundColor(0);


1
No hay diferencia entre webView.setBackgroundColor (0x00FFFFFF); y webView.setBackgroundColor (0x00); Se supone que ambos son de color transparente.
jptsetung

7

El siguiente código funciona para mí, aunque tengo varias vistas web y el desplazamiento entre ellas es un poco lento.

v.setBackgroundColor(Color.TRANSPARENT);
Paint p = new Paint();
v.setLayerType(LAYER_TYPE_SOFTWARE, p); 

3
Esto funciona en Honeycomb, pero desafortunadamente no en ICS. Maldición. Pero si lo usa, es más fácil especificarlo en el archivo de diseño usando la propiedad "android: layerType", ya que esto también funcionará bien en versiones anteriores donde la etiqueta simplemente se ignorará.
sven

2
Lo que funciona incluso en ICS es desactivar la aceleración de hardware para toda la actividad usando android:hardwareAccelerated="false"el AndroidManifest para el activityelemento.
sven

1
Hay innecesariamente para crear el objeto Paint. v.setLayerType(LAYER_TYPE_SOFTWARE, null);También funcionará.
Sergey Glotov el


6
  • Después de probar todo lo anterior. Descubrí que no importa que especifiques
    webView.setBackgroundColor(Color.TRANSPARENT)antes o después de loadUrl()/ loadData().
  • Lo que importa es que debes declarar explícitamente android:hardwareAccelerated="false"en el manifiesto.

Probado en IceCream Sandwich


3

Solo usa estas líneas .....

webView.loadDataWithBaseURL(null,"Hello", "text/html", "utf-8", null);
webView.setBackgroundColor(0x00000000);

Y recuerde un punto que siempre establece el color de fondo después de cargar datos en la vista web.


3
webView.setBackgroundColor(0x00000000);
webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

esto definitivamente funcionará ... establecer fondo en XML con Editbackground. Ahora ese fondo se mostrará


2

configura el bg después de cargar el html (de las pruebas rápidas parece que cargar el html restablece el color bg ... esto es para 2.3)

si está cargando el html de los datos que ya tiene, basta con hacer un .postDelayed en el que simplemente establece el bg (por ejemplo, transparente) es suficiente ...


2

Si webview es desplazable:

  1. Agregue esto al manifiesto:

    android:hardwareAccelerated="false"

O

  1. Agregue lo siguiente a WebView en el diseño:

    android:background="@android:color/transparent"
    android:layerType="software"
  2. Agregue lo siguiente a la vista de desplazamiento de los padres:

    android:layerType="software"

0

Pruebe webView.setBackgroundColor (Color.parseColor ("# EDEDED"));


0

Estaba tratando de poner una superposición HTML transparente sobre mi vista GL pero siempre tiene un parpadeo negro que cubre mi vista GL. Después de varios días tratando de deshacerme de este parpadeo, encontré esta solución que es aceptable para mí (pero es una pena para Android).

El problema es que necesito aceleración de hardware para mis agradables animaciones CSS y, por webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);lo tanto, no es una opción para mí.

El truco consistía en poner un segundo (vacío) WebViewentre mi vista GL y la superposición HTML. Esto dummyWebViewme dijeron que la presentación en modo SW, y ahora mi HTML superposiciones renders suave en HW y el parpadeo no más negro.

No sé si esto funciona en otros dispositivos que no sean My Acer Iconia A700, pero espero poder ayudar a alguien con esto.

public class MyActivity extends Activity {

    @Override
    protected void onCreate(Bundle icicle) {
        super.onCreate(icicle);

        RelativeLayout layout = new RelativeLayout(getApplication());
        setContentView(layout);

        MyGlView glView = new MyGlView(this);

        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);

        dummyWebView = new WebView(this);
        dummyWebView.setLayoutParams(params);
        dummyWebView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        dummyWebView.loadData("", "text/plain", "utf8");
        dummyWebView.setBackgroundColor(0x00000000);

        webView = new WebView(this);
        webView.setLayoutParams(params);
        webView.loadUrl("http://10.0.21.254:5984/ui/index.html");
        webView.setBackgroundColor(0x00000000);


        layout.addView(glView);
        layout.addView(dummyWebView);
        layout.addView(webView);
    }
}

Probé esto en un Galaxy Nexus y, por desgracia, seguía parpadeando.
Navarro

0

Esto funcionó para mí. intente configurar el color de fondo después de cargar los datos. para ese setWebViewClient en su objeto webview como:

    webView.setWebViewClient(new WebViewClient(){

        @Override
        public void onPageFinished(WebView view, String url)
        {
            super.onPageFinished(view, url);
            webView.setBackgroundColor(Color.BLACK);
        }
    });

0

Poner a prueba o probar:

myWebView.setAlpha(0.2f);

0

Si nada ayuda, entonces lo más probable es que tenga un tamaño fijo webView, cambie el ancho y la altura a wrap_content o match_parent, debería funcionar. Eso funcionó para mí cuando intenté cargar un GIF.


0

Puede usar BindingAdapter así:

Java

@BindingAdapter("setBackground")
public static void setBackground(WebView view,@ColorRes int resId) {
        view.setBackgroundColor(view.getContext().getResources().getColor(resId));
        view.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);
}

XML:

<layout >

    <data>

        <import type="com.tdk.sekini.R" />


    </data>

       <WebView
            ...
            app:setBackground="@{R.color.grey_10_transparent}"/>

</layout>

Recursos

<color name="grey_10_transparent">#11e6e6e6</color>

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.