Heim > Web-Frontend > CSS-Tutorial > Wie füge ich mithilfe von WebView in Android benutzerdefiniertes CSS in eine Website ein?

Wie füge ich mithilfe von WebView in Android benutzerdefiniertes CSS in eine Website ein?

Susan Sarandon
Freigeben: 2024-11-01 06:21:31
Original
193 Leute haben es durchsucht

How to Inject Custom CSS into a Website Using WebView in Android?

CSS mit WebView in Android in eine Website einfügen

CSS kann nicht direkt in eine Website eingefügt werden, die über WebView angezeigt wird, es besteht die Möglichkeit der Manipulation das DOM der Seite mithilfe von JavaScript. So geht's:

1. Aktivieren Sie JavaScript in WebView:

<code class="java">webView.getSettings().setJavaScriptEnabled(true);</code>
Nach dem Login kopieren

2. Fügen Sie einen WebViewClient hinzu:

<code class="java">webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageFinished(WebView view, String url) {
        // Inject CSS when page is done loading
        injectCSS();
        super.onPageFinished(view, url);
    }
});</code>
Nach dem Login kopieren

3. Laden Sie die Website:

<code class="java">webView.loadUrl("https://www.google.com");</code>
Nach dem Login kopieren

4. Injizieren Sie CSS mit JavaScript:

<code class="java">private void injectCSS() {
    try {
        InputStream inputStream = getAssets().open("style.css");
        byte[] buffer = new byte[inputStream.available()];
        inputStream.read(buffer);
        inputStream.close();
        String encoded = Base64.encodeToString(buffer, Base64.NO_WRAP);
        webView.loadUrl("javascript:(function() {" +
                "var parent = document.getElementsByTagName('head').item(0);" +
                "var style = document.createElement('style');" +
                "style.type = 'text/css';" +
                // Decode the CSS from BASE64
                "style.innerHTML = window.atob('" + encoded + "');" +
                "parent.appendChild(style)" +
                "})()");
    } catch (Exception e) {
        e.printStackTrace();
    }
}</code>
Nach dem Login kopieren

Hinweis:

  • Die style.css-Datei sollte sich im Assets-Ordner Ihres Projekts befinden.
  • Die webView.loadUrl()-Methode muss nach dem onPageFinished()-Rückruf aufgerufen werden, da das Einfügen von CSS vor dem Laden der Seite keine Auswirkung hat.

Das obige ist der detaillierte Inhalt vonWie füge ich mithilfe von WebView in Android benutzerdefiniertes CSS in eine Website ein?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage