Android WebView に表示される Web サイトに CSS を挿入するにはどうすればよいですか?

Android の WebView 経由で Web サイトに CSS を挿入する

WebView 内にロードされた Web サイトの外観を変更しようとするとき (変更など) Google.com の背景色を赤にすると、アセット フォルダーから style.css ファイルを挿入すると、予期せぬエラーが発生する可能性があります。

WebView が直接アクセスできないため、提供されたコードは style.css ファイルの挿入に失敗します。 CSS ファイル。

解決策:

WebView に表示される Web サイトに CSS を挿入するには、JavaScript ベースのアプローチを利用する必要があります:

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

この改良されたコードにより、JavaScript を利用して CSS を挿入できるようになります。これは、assets フォルダーから style.css ファイルを読み取り、Base64 にエンコードして、HTML ドキュメントのヘッドに埋め込み、Web サイトのスタイルの操作を可能にします。

以上がAndroid WebView に表示される Web サイトに CSS を挿入するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。