Wie füge ich CSS in eine Website ein, die in einem Android WebView angezeigt wird?

Injizieren von CSS in eine Website über WebView in Android

Beim Versuch, das Erscheinungsbild einer in einem WebView geladenen Website zu ändern, z. B. durch Ändern Wenn Sie die Hintergrundfarbe von Google.com auf Rot ändern, kann es durch das Einfügen einer style.css-Datei aus dem Assets-Ordner zu unvorhergesehenen Fehlern kommen.

Der bereitgestellte Code kann die style.css-Datei nicht einfügen, da WebView nicht direkt darauf zugreifen kann CSS-Dateien.

Lösung:

Um CSS in eine in einem WebView angezeigte Website einzufügen, muss ein JavaScript-basierter Ansatz verwendet werden:

<code class="java">public class MainActivity extends ActionBarActivity {

  // Initialize WebView
  private WebView webView;

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

    // Create WebView and enable JavaScript
    webView = new WebView(this);
    setContentView(webView);
    webView.getSettings().setJavaScriptEnabled(true);

    // Set WebViewClient for page load handling
    webView.setWebViewClient(new WebViewClient() {

      @Override
      public void onPageFinished(WebView view, String url) {
        // Inject CSS after page load
        injectCSS();
        super.onPageFinished(view, url);
      }
    });

    // Load the website
    webView.loadUrl("https://www.google.com");
  }

  // Inject CSS method
  private void injectCSS() {
    try {
      // Retrieve style.css from assets folder
      InputStream inputStream = getAssets().open("style.css");
      byte[] buffer = new byte[inputStream.available()];
      inputStream.read(buffer);
      inputStream.close();

      // Encode and insert CSS into HTML document head
      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';" +
          "style.innerHTML = window.atob('" + encoded + "');" +
          "parent.appendChild(style)" +
          "})()");
    } catch (Exception e) {
      e.printStackTrace();
    }
  }

  // ... (Other methods and menus)
}</code>

Dieser verbesserte Code ermöglicht die Einfügung von CSS mithilfe von JavaScript. Es liest die style.css-Datei aus dem Assets-Ordner, kodiert sie in Base64 und bettet sie in den HTML-Dokumentkopf ein, was die Manipulation von Website-Stilen ermöglicht.

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