Hintergrundfarbe des Android WebView-Stils: transparent ignoriert auf Android 2.2

156

Ich habe Probleme, eine WebView mit transparentem Hintergrund zu erstellen.

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

Dann lade ich eine HTML-Seite mit 

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

Die Hintergrundfarbe von WebView ist transparent, aber sobald die Seite geladen ist, wird sie von einem schwarzen Hintergrund von der HTML-Seite überschrieben. Dies passiert nur auf Android 2.2, es funktioniert auf Android 2.1.

Gibt es also etwas, das dem HTML-Seitencode hinzugefügt werden muss, um ihn wirklich transparent zu machen?

android  background  webview  transparency  transparent 
— jptsetung
quelle
1
Es tut mir leid zu sagen, aber für mein Problem hat keine hier aufgeführte Lösung funktioniert ...: = (danke trotzdem .. die Webseite hat immer einen weißen Hintergrund verwendet ...
— cV2

Antworten:

291

Das hat bei mir funktioniert,

mWebView.setBackgroundColor(Color.TRANSPARENT);
— Scottyab
quelle
1
Haben Sie wirklich auf OS 2.2 getestet?
— Jptsetung
87
Ich fand , dass diese genannt werden muss NACH dem Laden der URL oder Daten.
— Mark
11
es funktioniert nicht in Android 3.x, wenn Sie verwendenandroid:hardwareAccelerated="true"
— Macarse
2
Beachten Sie, dass auf ICS (4.0.3) zusätzlich zu den obigen Kommentaren; Ich musste "Einstellungen -> Entwickleroptionen -> GPU-Rendering
— Aki
10
Eigentlich verstehe ich nicht, warum diese Antwort so viele Stimmen bekommt. webView.setBackgroundColor (0x00000000); ist genau das gleiche wie webView.setBackgroundColor (0x00FFFFFF); Der Alpha-Wert ist 0x00.
— Jptsetung
128

Am Ende dieses zuvor erwähnten Problems befindet sich eine Lösung. Es ist eine Kombination aus 2 Lösungen.

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

Beim Hinzufügen von Code zu dem WebViewer nach der URL geladen, es funktioniert (API 11+).

Es funktioniert sogar, wenn die Hardeware-Beschleunigung eingeschaltet ist

— Ceetn
quelle
2
Es funktioniert, solange die Webansicht nicht scrollbar ist.
— Rany Ishak
Ich musste die Hintergrundfarbe einstellen, nachdem ich das Rendern der Software auf Samsung S3
— erzwungen hatte
7
webView.setBackgroundColor (Color.argb (1, 0, 0, 0)); Wenn Sie nicht möchten, dass der Hintergrund auf der Schriftrolle flackert
— Trent Seed
@Trent Ich habe deine Methode ausprobiert und wenn ich das Flimmerproblem bei Jelly Bean behoben habe, zeigt es jetzt einen schwarzen Hintergrund bei Lebkuchen. Irgendein anderer Vorschlag?
— Tiago
2
Dies deaktiviert die Hardwarebeschleunigung für die Webansicht! ! Dies war für mich nicht offensichtlich (Schuld daran, dass ich es nicht nachgeschlagen habe, bevor ich D verwendet habe), und der letzte Satz der Antwort hinterlässt den gegenteiligen Eindruck. Dies betrifft tatsächlich viele Dinge, Videos, UI-Transformationen, Scrollen, Canvas usw. Eine mögliche Problemumgehung stackoverflow.com/a/17815574/2487876
— Kristjan Liiva
36

Ich hatte das gleiche Problem mit 2.2 und auch in 2.3. Ich habe das Problem gelöst, indem ich den alpa-Wert in HTML und nicht in Android angegeben habe. Ich habe viele Dinge ausprobiert und herausgefunden, dass setBackgroundColor();Farbe mit Alpha-Wert nicht funktioniert. webView.setBackgroundColor(Color.argb(128, 0, 0, 0));wird nicht funktionieren.

Also hier ist meine Lösung, die für mich gearbeitet hat.

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

Und in Java

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

Und hier ist der Screenshot der Ausgabe unten.Geben Sie hier die Bildbeschreibung ein

— osayilgan
quelle
Perfekt, danke !
— Ayman Mahgoub
22

Das ist wie man es macht:

Stellen Sie Ihr Projekt zunächst auf 11, aber setzen Sie in AndroidManifest minSdkVersion auf 8

android: hardwareAccelerated = "false" ist nicht erforderlich und mit 8 nicht kompatibel

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

Stellen Sie dies aus Sicherheitsgründen in Ihren Stil:

BODY, HTML {background: transparent}

arbeitete für mich am 2.2 und 4

— Ali
quelle
Das funktioniert bei mir: android: hardwareAccelerated = "false" BODY, HTML {Hintergrund: transparent}
— Jayellos
12

Das Wichtigste wurde nicht erwähnt.

Das HTML muss ein bodyTag haben, auf das background-colorgesetzt ist transparent.

Die vollständige Lösung wäre also:


HTML

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

Aktivität

    WebView wv = (WebView) findViewById(R.id.webView);
    wv.setBackgroundColor(0);
    wv.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
    wv.loadUrl("file:///android_asset/myview.html");
— Lilotop
quelle
Es wird in der Frage erwähnt. Aber dies scheint eine schöne Zusammenfassung dessen zu sein, was Sie tun müssen, wenn Sie möchten, dass es auf allen Android-Versionen funktioniert.
— Jptsetung
9

Der folgende Code funktioniert gut mit Android 3.0+, aber wenn Sie diesen Code unter Android 3.0 ausprobieren, wird Ihre App zwangsweise geschlossen.

webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Sie versuchen den folgenden Code auf Ihrer weniger als API 11 .

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

Oder

Sie können auch den folgenden Code ausprobieren, der für alle APIs geeignet ist.

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

oben Code voll für mich verwenden.

— Duggu
quelle
Ich empfehle nicht, LayerType auf LAYER_TYPE_SOFTWARE zu setzen. Dies verringert die Leistung drastisch, insbesondere beim Scrollen.
— Navarr
8

Versuchen webView.setBackgroundColor(0);

— Andrew Podkin
quelle
1
Es gibt keinen Unterschied zwischen webView.setBackgroundColor (0x00FFFFFF); und webView.setBackgroundColor (0x00); Beide sollen transparente Farben haben.
— jptsetung
7

Das Befolgen von Code funktioniert für mich, obwohl ich mehrere Webansichten habe und das Scrollen zwischen ihnen etwas träge ist.

v.setBackgroundColor(Color.TRANSPARENT);
Paint p = new Paint();
v.setLayerType(LAYER_TYPE_SOFTWARE, p);
— Umair
quelle
3
Dies funktioniert auf Honeycomb, aber leider nicht auf ICS. Verdammt. Wenn Sie es jedoch verwenden, ist es einfacher, es in der Layoutdatei mithilfe der Eigenschaft "android: layerType" anzugeben, da dies auch bei älteren Versionen gut funktioniert, bei denen das Tag einfach ignoriert wird.
— Sven
2
Selbst unter ICS funktioniert das Deaktivieren der Hardwarebeschleunigung für die gesamte Aktivität android:hardwareAccelerated="false"im AndroidManifest für das activityElement.
— Sven
1
Es ist unnötig, ein Paint-Objekt zu erstellen. v.setLayerType(LAYER_TYPE_SOFTWARE, null);wird auch funktionieren.
— Sergey Glotov
6
  • Nachdem Sie alles versucht haben, was oben angegeben wurde. Ich fand, dass es egal ist, ob Sie
    webView.setBackgroundColor(Color.TRANSPARENT)vor oder nach loadUrl()/ angeben loadData().
  • Entscheidend ist, dass Sie dies android:hardwareAccelerated="false"im Manifest ausdrücklich deklarieren .

Getestet auf IceCream Sandwich

— Gaurav Arora
quelle
3

Verwenden Sie einfach diese Zeilen .....

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

Und denken Sie an einen Punkt, bei dem die Hintergrundfarbe nach dem Laden von Daten in der Webansicht immer festgelegt wird.

— Atul Bhardwaj
quelle
3 
webView.setBackgroundColor(0x00000000);
webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Dies wird definitiv funktionieren. Setzen Sie den Hintergrund in XML mit Editbackground. Nun wird dieser Hintergrund angezeigt

— Shivendra
quelle
2

Stellen Sie die BG nach dem Laden des HTML ein (nach schnellen Tests scheint das Laden des HTML die BG-Farbe zurückzusetzen. Dies ist für 2.3).

Wenn Sie das HTML aus Daten laden, die Sie bereits erhalten haben, reicht es aus, nur eine .postDelayed-Datei zu erstellen, in der Sie nur die BG (zum Beispiel transparent) einstellen.

— Lassi Kinnunen
quelle
2

Wenn die Webansicht scrollbar ist:

  1. Fügen Sie dies dem Manifest hinzu:

    android:hardwareAccelerated="false"

ODER

  1. Fügen Sie WebView im Layout Folgendes hinzu:

    android:background="@android:color/transparent"
android:layerType="software"

  2. Fügen Sie der übergeordneten Bildlaufansicht Folgendes hinzu:

    android:layerType="software"
— Taktstock
quelle
0

Versuchen Sie es mit webView.setBackgroundColor (Color.parseColor ("# EDEDED")).

— Raja
quelle
0

Ich habe versucht, ein transparentes HTML-Overlay über meine GL-Ansicht zu legen, aber es flackert immer schwarz, was meine GL-Ansicht abdeckt. Nachdem ich einige Tage lang versucht hatte, dieses Flackern loszuwerden, fand ich diese Problemumgehung, die für mich akzeptabel ist (aber eine Schande für Android).

Das Problem ist, dass ich Hardwarebeschleunigung für meine netten CSS-Animationen benötige und daher webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);für mich keine Option ist.

Der Trick bestand darin, eine Sekunde (leer) WebViewzwischen meine GL-Ansicht und das HTML-Overlay zu setzen. DiesdummyWebView ich angewiesen, im SW-Modus zu rendern, und jetzt werden meine HTML-Overlays in HW glatt und kein schwarzes Flackern mehr.

Ich weiß nicht, ob dies auf anderen Geräten als My Acer Iconia A700 funktioniert, aber ich hoffe, ich könnte jemandem dabei helfen.

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);
    }
}
— Ingemar
quelle
Ich habe dies auf einem Galaxy Nexus getestet und das Flackern blieb leider bestehen.
— Navarr
0

Das hat bei mir funktioniert. Versuchen Sie, die Hintergrundfarbe einzustellen, nachdem die Daten geladen wurden. für diesen setWebViewClient auf Ihrem Webview-Objekt wie:

    webView.setWebViewClient(new WebViewClient(){

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

Ausprobieren:

myWebView.setAlpha(0.2f);
— ABN
quelle
0

Wenn nichts hilft, haben Sie höchstwahrscheinlich eine feste Größe webView, ändern Sie die Breite und Höhe in wrap_content oder match_parentes sollte funktionieren. Das hat bei mir funktioniert, als ich versucht habe, ein Gif zu laden.

— Hayk
quelle
0

Sie können BindingAdapter folgendermaßen verwenden:

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>

Ressourcen

<color name="grey_10_transparent">#11e6e6e6</color>
— Ahmad Aghazadeh
quelle
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.