Android WebView style background-color: transparente ignorado no android 2.2


156

Estou lutando para criar um WebView com fundo transparente.

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

Então eu carrego uma página html com

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

A cor de plano de fundo do WebView é transparente, mas, assim que a página é carregada, ela é substituída por um plano de fundo preto da página html. Isso só acontece no android 2.2, funciona no android 2.1.

Então, há algo a acrescentar no código da página html para torná-lo realmente transparente?


1
Lamento dizer, mas para o meu problema sem solução aqui funcionou ...: = (thx qualquer maneira .. o site sempre usado um fundo branco ...
CV2

Respostas:


291

Isso funcionou para mim,

mWebView.setBackgroundColor(Color.TRANSPARENT);

1
Você realmente testou no OS 2.2?
8132 jjsetung

87
Descobri que isso deve ser chamado DEPOIS de carregar o URL ou os dados.
Mark

11
ele não funciona no Android 3.x se você estiver usandoandroid:hardwareAccelerated="true"
Macarse

2
Observe que no ICS (4.0.3), além dos comentários acima; Eu tive que desativar "Configurações -> Opções do desenvolvedor -> Força GPU Processamento" para obter transparência ao trabalho com nível API 10.
Aki

10
Na verdade, eu não entendo por que essa resposta gera tantos votos positivos. webView.setBackgroundColor (0x00000000); é exatamente o mesmo que webView.setBackgroundColor (0x00FFFFFF); o valor alfa é 0x00.
precisa saber é o seguinte

128

No final desta questão mencionada anteriormente, há uma solução. É uma combinação de 2 soluções.

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

Ao adicionar esse código ao WebViewer após carregar o URL, ele funciona (API 11+).

Até funciona quando a aceleração do hardeware está ativada


2
Funciona desde que a Webview não seja rolável.
precisa

Eu precisava conjunto cor de fundo após o processamento de software vigor no Samsung S3
Neworld

7
webView.setBackgroundColor (Color.argb (1, 0, 0, 0)); se você quiser sem fundo piscando no rolo
Trent Semente

@ Trent Tentei o seu método e, se corrigido o problema de cintilação no Jelly Bean, mas agora ele exibe um fundo preto no pão de gengibre. Alguma outra sugestão?
Tiago

2
Isso desativa a aceleração de hardware para a visualização na web! ! Isso não era óbvio para mim (culpe-me por não procurá-lo antes de usar: D), e a última frase da resposta deixa a impressão oposta. Isso realmente afeta um monte de coisas, vídeos, transformações de interface do usuário, rolagem, lona etc. Uma solução possível stackoverflow.com/a/17815574/2487876
Kristjan Liiva

36

Eu tive o mesmo problema com o 2.2 e também no 2.3. Eu resolvi o problema, dando o valor de alpa em html, não no android. Eu tentei muitas coisas e descobri que a setBackgroundColor();cor não funciona com valor alfa. webView.setBackgroundColor(Color.argb(128, 0, 0, 0));não funciona.

então aqui está a minha solução, funcionou para mim.

      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 em Java,

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

E aqui está a captura de tela de saída abaixo.insira a descrição da imagem aqui


Perfeito, obrigado!
Ayman Mahgoub


22

É assim que se faz:

Primeiro, faça sua base do projeto em 11, mas no AndroidManifest defina minSdkVersion como 8

android: hardwareAccelerated = "false" é desnecessário e é incompatível com 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 segurança, coloque isso no seu estilo:

BODY, HTML {background: transparent}

trabalhou para mim em 2.2 e 4


Isso funciona para mim: android: hardwareAccelerated = "false" corpo, HTML {background: transparente}
jayellos

12

A coisa mais importante não foi mencionada.

O html deve ter uma bodymarca background-colordefinida como transparent.

Portanto, a solução completa seria:


HTML

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

Atividade

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

É mencionado na pergunta. Mas este parece ser um bom resumo do que você deve fazer se quiser que ele funcione em todas as versões do Android.
jptsetung

9

o código abaixo funciona bem no Android 3.0 ou superior, mas quando você tenta esse código abaixo do android 3.0, seu aplicativo é fechado à força.

webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Você tenta o código abaixo na sua API menor que a 11 .

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

Ou

você também pode tentar o código abaixo, que funciona com toda a API .

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

código acima usar completo para mim.


Não recomendo que você definaLayerType como LAYER_TYPE_SOFTWARE. Diminui drasticamente o desempenho, especialmente ao rolar.
Navarr

8

Experimentar webView.setBackgroundColor(0);


1
Não há diferença entre webView.setBackgroundColor (0x00FFFFFF); e webView.setBackgroundColor (0x00); Ambos devem ser de cor transparente.
precisa saber é o seguinte

7

O código a seguir funciona para mim, embora eu tenha várias visualizações da web e a rolagem entre elas seja um pouco lenta.

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

3
Isso funciona no Honeycomb, mas infelizmente não no ICS. Droga. Mas se você usá-lo, é mais fácil especificá-lo no arquivo de layout usando a propriedade "android: layerType", pois isso também funcionará bem em versões mais antigas, nas quais a tag será simplesmente ignorada.
sven

2
O que funciona mesmo no ICS é desativar a aceleração de hardware para toda a atividade usando android:hardwareAccelerated="false"o AndroidManifest para o activityelemento.
sven

1
Não é necessário criar objeto de pintura. v.setLayerType(LAYER_TYPE_SOFTWARE, null);também vai funcionar.
Sergey Glotov 12/03/2012


6
  • Depois de tentar tudo o que foi mencionado acima. Descobri que não importa se você especificar
    webView.setBackgroundColor(Color.TRANSPARENT)antes ou depois de loadUrl()/ loadData().
  • O que importa é que você deve declarar explicitamente android:hardwareAccelerated="false"no manifesto.

Testado no IceCream Sandwich


3

Basta usar estas linhas .....

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

E lembre-se de um ponto que sempre define a cor do plano de fundo após carregar os dados na visualização na web.


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

isso definitivamente funcionará .. definir plano de fundo em XML com Editbackground. Agora esse plano de fundo será mostrado


2

defina a BG após o carregamento do html (a partir de testes rápidos, parece que o carregamento do html redefine a cor da BG. isto é para 2.3).

se você estiver carregando o html dos dados que já obteve, basta fazer um .postDelayed no qual você acabou de definir o bg (por exemplo, transparente) é suficiente.


2

Se a visualização na web for rolável:

  1. Adicione isso ao manifesto:

    android:hardwareAccelerated="false"

OU

  1. Adicione o seguinte ao WebView no layout:

    android:background="@android:color/transparent"
    android:layerType="software"
  2. Adicione o seguinte à exibição de rolagem dos pais:

    android:layerType="software"

0

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


0

Eu estava tentando colocar uma sobreposição HTML transparente na minha visão GL, mas ela sempre piscava em preto, cobrindo minha visão GL. Depois de vários dias tentando me livrar dessa tremulação, encontrei essa solução alternativa que é aceitável para mim (mas é uma pena para o Android).

O problema é que preciso de aceleração de hardware para minhas animações CSS agradáveis ​​e, portanto, webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);não é uma opção para mim.

O truque foi colocar um segundo (vazio) WebViewentre a minha visão GL e a sobreposição HTML. Isso dummyWebVieweu disse para renderizar no modo SW, e agora minhas sobreposições de HTML ficam suaves em HW e não mais tremeluzem em preto.

Não sei se isso funciona em outros dispositivos além do My Acer Iconia A700, mas espero poder ajudar alguém com isso.

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

Testei isso em um Galaxy Nexus e a cintilação permaneceu, infelizmente.
Navarr

0

Isso funcionou para mim. tente definir a cor do plano de fundo após o carregamento dos dados. para esse setWebViewClient no seu objeto de visualização na web, como:

    webView.setWebViewClient(new WebViewClient(){

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

0

Tente:

myWebView.setAlpha(0.2f);

0

Se nada ajudar, provavelmente você tem um tamanho fixo webView, altere a largura e a altura para wrap_content ou match_parent, deve funcionar. Isso funcionou para mim quando tentei carregar um GIF.


0

Você pode usar o BindingAdapter como este:

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>

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.