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

Injizieren Sie CSS in Websites mit WebView in Android

Bei der Android-Programmierung erfolgt die Anzeige von Webseiten innerhalb einer Anwendung mithilfe von WebView. Es kann jedoch Situationen geben, in denen Entwickler das Erscheinungsbild der angezeigten Seite ändern müssen, indem sie benutzerdefiniertes CSS einfügen.

Um dieses Problem zu beheben, kann man CSS nicht direkt mit einem WebView in die Webseite einfügen. Um dieses Problem zu umgehen, kann JavaScript verwendet werden, um das Document Object Model (DOM) der Seite zu manipulieren.

Beachten Sie den folgenden überarbeiteten Code für die Datei MainActivity.java:

public class MainActivity extends ActionBarActivity {

  WebView webView;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    webView = new WebView(this);
    setContentView(webView);

    // Enable JavaScript
    webView.getSettings().setJavaScriptEnabled(true);

    // Add a WebViewClient
    webView.setWebViewClient(new WebViewClient() {

        @Override
        public void onPageFinished(WebView view, String url) {

            // Inject CSS when page is done loading
            injectCSS();
            super.onPageFinished(view, url);
        }
    });

    // Load a webpage
    webView.loadUrl("https://www.google.com");
}

// Inject CSS method: read style.css from assets folder
// Append stylesheet to document head
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';" +
                // Tell the browser to BASE64-decode the string into your script !!!
                "style.innerHTML = window.atob('" + encoded + "');" +
                "parent.appendChild(style)" +
                "})()");
    } catch (Exception e) {
        e.printStackTrace();
    }
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();
    if (id == R.id.action_settings) {
        return true;
    }
    return super.onOptionsItemSelected(item);
  }
}

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