Warna latar belakang gaya WebView Android: transparan diabaikan di android 2.2

157

Saya berjuang untuk membuat WebView dengan latar belakang transparan.

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

Lalu saya memuat halaman html dengan 

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

Warna latar belakang WebView transparan tetapi segera setelah halaman dimuat, itu ditimpa oleh latar belakang hitam dari halaman html. Ini hanya terjadi di Android 2.2, berfungsi di Android 2.1.

Jadi apakah ada sesuatu untuk ditambahkan dalam kode halaman html untuk membuatnya benar-benar transparan?

android  background  webview  transparency  transparent 
— jptsetung
sumber
1
Saya minta maaf untuk mengatakan, tetapi untuk masalah saya tidak ada solusi yang tercantum di sini bekerja ...: = (thx anyways .. halaman web selalu menggunakan latar belakang putih ...
— cV2

Jawaban:

292

Ini berhasil untuk saya,

mWebView.setBackgroundColor(Color.TRANSPARENT);
— scottyab
sumber
1
Sudahkah Anda benar-benar diuji pada os 2.2?
— jptsetung
87
Saya menemukan bahwa ini harus disebut SETELAH memuat url atau data.
— Tandai
11
itu tidak berfungsi di android 3.x jika Anda menggunakanandroid:hardwareAccelerated="true"
— Macarse
2
Perhatikan bahwa pada ICS (4.0.3), di samping komentar di atas; Saya harus menonaktifkan "Pengaturan -> Opsi Pengembang -> Force GPU Rendering" untuk mendapatkan transparansi agar bekerja dengan API level 10.
— Aki
10
Sebenarnya saya tidak mengerti mengapa jawaban ini mendapatkan begitu banyak suara. webView.setBackgroundColor (0x00000000); persis sama dengan webView.setBackgroundColor (0x00FFFFFF); nilai alfa adalah 0x00.
— jptsetung
128

Di bagian bawah masalah yang disebutkan sebelumnya ada solusi. Ini kombinasi dari 2 solusi.

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

Saat menambahkan kode ini ke WebViewer setelah memuat url, ia berfungsi (API 11+).

Bahkan bekerja ketika akselerasi perangkat keras AKTIF

— Ceetn
sumber
2
Ini berfungsi selama Webview tidak dapat digulir.
— Rany Ishak
Saya perlu mengatur warna latar belakang setelah rendering perangkat lunak paksa di samsung S3
— neworld
7
webView.setBackgroundColor (Color.argb (1, 0, 0, 0)); jika Anda tidak ingin latar belakang berkedip pada gulir
— Trent Seed
@ Trik Saya mencoba metode Anda dan jika memperbaiki masalah flicker pada Jelly Bean, tapi sekarang ini menampilkan latar belakang hitam pada Gingerbread. Ada saran lain?
— Tiago
2
Ini menonaktifkan akselerasi perangkat keras untuk tampilan web! ! Ini tidak jelas bagi saya (menyalahkan saya karena tidak mencari sebelum menggunakan: D), dan kalimat terakhir dari jawaban meninggalkan kesan sebaliknya. Ini sebenarnya memengaruhi banyak hal, video, transformasi UI, pengguliran, kanvas, dll. Kemungkinan pemecahan masalah stackoverflow.com/a/17815574/2487876
— Kristjan Liiva
36

Saya memiliki masalah yang sama dengan 2.2 dan juga di 2.3. Saya memecahkan masalah dengan memberikan nilai alpa dalam html bukan di android. Saya mencoba banyak hal dan apa yang saya temukan adalah setBackgroundColor();warna tidak bekerja dengan nilai alpha. webView.setBackgroundColor(Color.argb(128, 0, 0, 0));tidak akan berfungsi.

jadi inilah solusi saya, berhasil untuk saya.

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

Dan di Jawa,

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

Dan inilah screenshot Output di bawah ini.masukkan deskripsi gambar di sini

— osayilgan
sumber
Sempurna, terima kasih !
— Ayman Mahgoub
22

Inilah cara Anda melakukannya:

Pertama-tama, buat proyek Anda berdasarkan 11, tetapi di AndroidManifest atur minSdkVersion ke 8

android: hardwareAccelerated = "false" tidak perlu, dan tidak kompatibel dengan 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);
    }
});

Untuk keamanan, letakkan ini sesuai gaya Anda:

BODY, HTML {background: transparent}

bekerja untuk saya pada 2.2 dan 4

— Ali
sumber
ini berfungsi untuk saya: android: hardwareAccelerated = "false" BODY, HTML {background: transparent}
— jayellos
12

Yang paling penting tidak disebutkan.

Html harus memiliki bodytag dengan background-colorset ke transparent.

Jadi solusi lengkapnya adalah:


HTML

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

Aktivitas

    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
sumber
Itu disebutkan dalam pertanyaan. Tapi ini sepertinya resume yang bagus dari apa yang harus kamu lakukan jika kamu ingin itu bekerja pada semua versi android.
— jptsetung
9

kode di bawah ini berfungsi dengan baik Android 3.0+ tetapi ketika Anda mencoba kode ini di bawah Android 3.0 maka aplikasi Anda ditutup dengan paksa.

webView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

Anda mencoba kode di bawah ini pada API Anda kurang dari 11 .

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

Atau

Anda juga dapat mencoba kode di bawah ini yang berfungsi pada semua denda API .

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

penggunaan kode di atas penuh untuk saya.

— Duggu
sumber
Saya tidak menyarankan Anda mengaturLayerType ke LAYER_TYPE_SOFTWARE. Ini secara drastis menurunkan kinerja terutama ketika menggulir.
— Navarr
8

Mencoba webView.setBackgroundColor(0);

— Andrew Podkin
sumber
1
Tidak ada perbedaan antara webView.setBackgroundColor (0x00FFFFFF); dan webView.setBackgroundColor (0x00); Keduanya seharusnya berwarna transparan.
— jptsetung
7

Kode berikut berfungsi untuk saya, meskipun saya memiliki beberapa tampilan web dan menggulir di antara keduanya agak lambat.

v.setBackgroundColor(Color.TRANSPARENT);
Paint p = new Paint();
v.setLayerType(LAYER_TYPE_SOFTWARE, p);
— Umair
sumber
3
Ini berfungsi pada Honeycomb, tetapi sayangnya tidak pada ICS. Sial. Tetapi jika Anda menggunakannya, lebih mudah untuk menentukannya di file tata letak menggunakan properti "android: layerType" karena ini juga akan bekerja dengan baik pada rilis yang lebih lama di mana tag hanya akan diabaikan.
— sven
2
Apa yang bekerja bahkan pada ICS adalah untuk menonaktifkan akselerasi perangkat keras untuk seluruh aktivitas yang digunakan android:hardwareAccelerated="false"di AndroidManifest untuk activityelemen tersebut.
— sven
1
Tidak perlu untuk membuat objek Paint. v.setLayerType(LAYER_TYPE_SOFTWARE, null);juga akan bekerja.
— Sergey Glotov
6
  • Setelah mencoba semua yang diberikan di atas. Saya menemukan itu tidak masalah apakah Anda menentukan
    webView.setBackgroundColor(Color.TRANSPARENT)sebelum atau sesudah loadUrl()/ loadData().
  • Yang penting adalah Anda harus secara eksplisit menyatakan android:hardwareAccelerated="false"dalam manifes.

Diuji pada IceCream Sandwich

— Gaurav Arora
sumber
3

Cukup gunakan baris ini .....

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

Dan ingat titik yang selalu mengatur warna latar belakang setelah memuat data di tampilan web.

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

ini pasti akan berfungsi .. mengatur latar belakang dalam XML dengan Editbackground. Sekarang latar belakang itu akan ditampilkan

— Shivendra
sumber
2

atur bg setelah memuat html (dari tes cepat sepertinya memuat html me-reset warna bg .. ini untuk 2.3).

jika Anda memuat html dari data yang sudah Anda dapatkan, cukup lakukan .postDelay di mana Anda baru saja mengatur bg (misalnya transparan) sudah cukup ..

— Lassi Kinnunen
sumber
2

Jika tampilan web dapat digulir:

  1. Tambahkan ini ke Manifest:

    android:hardwareAccelerated="false"

ATAU

  1. Tambahkan berikut ini ke WebView di tata letak:

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

  2. Tambahkan yang berikut ke tampilan gulir orang tua:

    android:layerType="software"
— Tongkat
sumber
0

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

— raja
sumber
0

Saya mencoba untuk meletakkan overlay HTML transparan di atas tampilan GL saya tetapi selalu berkedip hitam yang mencakup pandangan GL saya. Setelah beberapa hari mencoba untuk menyingkirkan kerlipan ini saya menemukan solusi yang dapat diterima bagi saya (tetapi memalukan untuk android).

Masalahnya adalah saya perlu akselerasi perangkat keras untuk animasi CSS saya yang bagus dan karenanya webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);bukan pilihan bagi saya.

Caranya adalah dengan meletakkan kedua (kosong) WebViewantara tampilan GL saya dan overlay HTML. Ini dummyWebViewsaya katakan untuk me-render dalam mode SW, dan sekarang overlay HTML saya menjadikannya mulus di HW dan tidak ada lagi flickering hitam.

Saya tidak tahu apakah ini berfungsi pada perangkat lain selain My Acer Iconia A700, tapi saya harap saya bisa membantu seseorang dengan ini.

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
sumber
Saya menguji ini pada Galaxy Nexus dan masih berkedip, sayangnya.
— Navarr
0

Ini berhasil untuk saya. coba atur warna latar belakang setelah data dimuat. untuk itu setWebViewClient pada objek tampilan web Anda seperti:

    webView.setWebViewClient(new WebViewClient(){

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

Jika tidak ada yang membantu, maka kemungkinan besar Anda telah memperbaiki ukuran webView, mengubah lebar dan tinggi menjadi wrap_content atau match_parent, itu seharusnya berfungsi. Itu bekerja untuk saya ketika saya mencoba memuat Gif.

— Hayk
sumber
0

Anda dapat menggunakan BindingAdapter seperti ini:

Jawa

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

Sumber daya

<color name="grey_10_transparent">#11e6e6e6</color>
— Ahmad Aghazadeh
sumber
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.