Colore di sfondo in stile Android WebView: trasparente ignorato su Android 2.2


157

Sto lottando per creare un WebView con sfondo trasparente.

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

Quindi carico una pagina html con

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

Il colore di sfondo di WebView è trasparente ma non appena la pagina viene caricata, viene sovrascritta da uno sfondo nero dalla pagina html. Questo succede solo su Android 2.2, funziona su Android 2.1.

Quindi c'è qualcosa da aggiungere nel codice della pagina HTML per renderlo davvero trasparente?


1
Mi dispiace dirlo, ma per il mio problema nessuna soluzione elencata qui ha funzionato ...: = (grazie comunque .. la pagina web ha sempre usato uno sfondo bianco ...
cV2

Risposte:


292

Questo ha funzionato per me,

mWebView.setBackgroundColor(Color.TRANSPARENT);

1
Hai davvero testato su OS 2.2?
jptsetung

87
Ho scoperto che questo deve essere chiamato DOPO aver caricato l'URL o i dati.
Segna il

11
non funziona in Android 3.x se stai usandoandroid:hardwareAccelerated="true"
Macarse

2
Si noti che su ICS (4.0.3), oltre ai commenti sopra; Ho dovuto disabilitare "Impostazioni -> Opzioni sviluppatore -> Forza rendering GPU" per far funzionare la trasparenza con il livello API 10.
Aki,

10
In realtà non capisco perché questa risposta ottenga così tanti voti positivi. webView.setBackgroundColor (0x00000000); è esattamente lo stesso di webView.setBackgroundColor (0x00FFFFFF); il valore alfa è 0x00.
jptsetung,

128

Alla base di questo problema precedentemente citato c'è una soluzione. È una combinazione di 2 soluzioni.

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

Quando si aggiunge questo codice a WebViewer dopo aver caricato l'URL, funziona (API 11+).

Funziona anche quando l'accelerazione di hardeware è attiva


2
Funziona finché la visualizzazione Web non è scorrevole.
Rany Ishak,

Avevo bisogno di impostare il colore di sfondo dopo il rendering forzato del software su Samsung S3
Neworld,

7
webView.setBackgroundColor (Color.argb (1, 0, 0, 0)); se non vuoi sfarfallio di sfondo sulla pergamena
Trent Seed

@Trent Ho provato il tuo metodo e se risolto il problema dello sfarfallio su Jelly Bean, ma ora mostra uno sfondo nero su Gingerbread. Qualche altro suggerimento?
Tiago,

2
Ciò disabilita l'accelerazione hardware per la visualizzazione Web! ! Questo non era ovvio per me (incolpare me per non averlo cercato prima di usare: D), e l'ultima frase della risposta lascia l'impressione opposta. Questo in realtà influisce su un sacco di cose, video, trasformazioni dell'interfaccia utente, scorrimento, tela, ecc. Una possibile soluzione alternativa stackoverflow.com/a/17815574/2487876
Kristjan Liiva

36

Ho avuto lo stesso problema con 2.2 e anche con 2.3. Ho risolto il problema dando il valore alpa in HTML non in Android. Ho provato molte cose e quello che ho scoperto è che il setBackgroundColor();colore non funziona con il valore alfa. webView.setBackgroundColor(Color.argb(128, 0, 0, 0));non funzionerà.

quindi ecco la mia soluzione, ha funzionato per me.

      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>");

E in Java,

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

Ed ecco lo screenshot di output qui sotto.inserisci qui la descrizione dell'immagine


Perfetto, grazie !
Ayman Mahgoub,


22

Ecco come lo fai:

Per prima cosa rendi base il tuo progetto su 11, ma in AndroidManifest imposta minSdkVersion su 8

android: hardwareAccelerated = "false" non è necessario ed è incompatibile 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);
    }
});

Per sicurezza mettilo nel tuo stile:

BODY, HTML {background: transparent}

ha lavorato per me su 2.2 e 4


questo funziona per me: android: hardwareAccelerated = "false" BODY, HTML {background: transparent}
jayellos

12

La cosa più importante non è stata menzionata.

L'html deve avere un bodytag con background-colorimpostato su transparent.

Quindi la soluzione completa sarebbe:


HTML

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

Attività

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

È menzionato nella domanda. Ma questo sembra essere un bel riassunto di ciò che devi fare se vuoi che funzioni su tutte le versioni di Android.
jptsetung,

9

sotto il codice funziona bene Android 3.0+ ma quando provi questo codice sotto Android 3.0, la tua app viene chiusa con forza.

webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Provi sotto il codice sul tuo meno di API 11 .

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

O

puoi anche provare sotto il codice che funziona bene su tutte le API .

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

sopra il codice uso pieno per me.


Non ti consiglio di impostareLayerType su LAYER_TYPE_SOFTWARE. Riduce drasticamente le prestazioni soprattutto durante lo scorrimento.
Navarr,

8

Provare webView.setBackgroundColor(0);


1
Non vi è alcuna differenza tra webView.setBackgroundColor (0x00FFFFFF); e webView.setBackgroundColor (0x00); Entrambi dovrebbero essere di colore trasparente.
jptsetung

7

Il seguente codice funziona per me, anche se ho più visualizzazioni Web e scorrere tra loro è un po 'lento.

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

3
Funziona su Honeycomb, ma sfortunatamente non su ICS. Dannazione. Ma se lo usi, è più facile specificarlo nel file di layout usando la proprietà "android: layerType" poiché funzionerà bene anche su versioni precedenti in cui il tag verrà semplicemente ignorato.
sabato

2
Ciò che funziona anche su ICS è disattivare l'accelerazione hardware per l'intera attività utilizzando android:hardwareAccelerated="false"in AndroidManifest per l' activityelemento.
sabato

1
Non è necessario creare oggetti Paint. v.setLayerType(LAYER_TYPE_SOFTWARE, null);funzionerà anche.
Sergey Glotov,


6
  • Dopo aver provato tutto quanto sopra. Ho scoperto che non importa né specificato
    webView.setBackgroundColor(Color.TRANSPARENT)prima o dopo loadUrl()/ loadData().
  • L'importante è dichiarare esplicitamente android:hardwareAccelerated="false"nel manifest.

Testato su IceCream Sandwich


3

Usa queste righe .....

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

E ricorda un punto che imposta sempre il colore di sfondo dopo aver caricato i dati in visualizzazione Web.


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

questo funzionerà sicuramente .. imposta lo sfondo in XML con Editbackground. Ora verrà mostrato quello sfondo


2

impostare il bg dopo aver caricato l'html (dai test rapidi sembra che il caricamento dell'html reimposti il ​​colore bg .. questo è per 2.3).

se stai caricando l'html dai dati che hai già, basta fare un .postDelayed in cui hai appena impostato il bg (ad esempio trasparente) ..


2

Se la visualizzazione Web è scorrevole:

  1. Aggiungi questo al manifest:

    android:hardwareAccelerated="false"

O

  1. Aggiungere quanto segue a WebView nel layout:

    android:background="@android:color/transparent"
    android:layerType="software"
  2. Aggiungi quanto segue alla vista di scorrimento dei genitori:

    android:layerType="software"

0

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


0

Stavo cercando di mettere un overlay HTML trasparente sulla mia vista GL ma ha sempre uno sfarfallio nero che copre la mia vista GL. Dopo diversi giorni cercando di sbarazzarmi di questo sfarfallio ho trovato questa soluzione alternativa che è accettabile per me (ma è un peccato per Android).

Il problema è che ho bisogno di accelerazione hardware per le mie belle animazioni CSS e quindi webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);non è un'opzione per me.

Il trucco era mettere un secondo (vuoto) WebViewtra la mia vista GL e l'overlay HTML. Questo dummyWebViewho detto di eseguire il rendering in modalità SW, e ora i miei overlay HTML sono uniformi in HW e non più sfarfallio nero.

Non so se funziona su altri dispositivi diversi dal mio Acer Iconia A700, ma spero di poter aiutare qualcuno con questo.

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);
    }
}

L'ho provato su un Galaxy Nexus e sfarfallio è rimasto, purtroppo.
Navarr,

0

Questo ha funzionato per me. prova a impostare il colore di sfondo dopo aver caricato i dati. per quel setWebViewClient sull'oggetto webview come:

    webView.setWebViewClient(new WebViewClient(){

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

0

Provalo:

myWebView.setAlpha(0.2f);

0

Se nulla aiuta, probabilmente hai dimensioni fisse webView, modifica la larghezza e l'altezza in wrap_content o match_parent, dovrebbe funzionare. Ha funzionato per me quando ho provato a caricare una GIF.


0

Puoi utilizzare BindingAdapter in questo modo:

Giava

@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>

risorse

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

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.