31

私は webview を使用する Android アプリを持っています。最近、新しい@media (prefers-color-scheme: dark)CSS 構文を使用して暗いテーマを追加する方法を見つけようとしています。ページに正しい CSS を記述しました。Chrome のダーク モードをオンにして Chrome で開くと、動作します。AppTheme継承もありTheme.AppCompat.DayNight、デバイスのOS全体でダークモードをオンにすると、アプリにダークロードダイアログなどが表示されます。要素のオートコンプリート オプションも<input>暗くなります。それでも、私の WebView をロードした Web ページは暗くなりません。このページによると、webviews はこの機能をサポートする必要がありますが、機能させることができません。ここで何が欠けていますか？

また、API 29 にこのWebSettings.setForceDark()メソッドがあることも知りました。それは私が探しているものでしょうか？ただし、より低い API レベルで機能するソリューションを見つけたいと考えています。

ちなみに、私の現在の回避策は、次のような JavaScript インターフェイスを挿入することです。

webView.addJavascriptInterface(new JSInterface(), "jsInterface");

...

public class JSInterface {
    @JavascriptInterface
    public boolean isNightMode() {
        int nightModeFlags = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
        return nightModeFlags == Configuration.UI_MODE_NIGHT_YES;
    }
}

次に、私の Web ページでjsInterface.isNightMode()メソッドを呼び出し、結果に基づいて別の CSS ファイルを動的に読み込みます。それは確かに機能し、グローバルなダークモード設定に希望どおりに応答しますが、それでも機能するかどうかは疑問ですprefers-color-scheme.

4

6 に答える 6