वेबव्यू में वेब कॉन्टेंट को गहरा बनाएं

Android 10 और उसके बाद के वर्शन में, ऐप्लिकेशन गहरे रंग वाली थीम और अपने-आप बदलने वाली थीम हल्के और गहरे रंग वाले ऐप्लिकेशन की थीम के बीच स्विच कर सकता है. मिलान करने के लिए ऐप्लिकेशन की मौजूदा थीम, वेबव्यू में वेब कॉन्टेंट हल्के, गहरे रंग या डिफ़ॉल्ट स्टाइलिंग का भी इस्तेमाल कर सकते हैं.

वेबव्यू का व्यवहार prefers-color-scheme और color-scheme वेब मानकों के मुताबिक होना चाहिए. अगर मुमकिन हो, तो अपनी पसंद का वेब कॉन्टेंट तैयार करने पर अगर आपको अपने ऐप्लिकेशन को वेबव्यू में दिखाना है, तो आपको अपने विज्ञापन के लिए गहरे रंग वाली थीम तय करनी होगी वेबसाइट और prefers-color-scheme लागू करें, ताकि वेबव्यू, वेब कॉन्टेंट के आपके ऐप्लिकेशन की थीम के हिसाब से.

नीचे दी गई टेबल में बताया गया है कि वेबव्यू आपके ऐप्लिकेशन में वेब कॉन्टेंट को कैसे रेंडर करता है, वेब कॉन्टेंट की स्टाइल और आपके ऐप्लिकेशन की शर्तों के हिसाब से:

कॉन्टेंट-ऑथर स्टाइलिंग

ऐप्लिकेशन की isLightTheme एट्रिब्यूट बताता है कि ऐप्लिकेशन की थीम हल्के रंग की है या गहरे रंग की. वेबव्यू हमेशा सेट करता है isLightTheme के अनुसार prefers-color-scheme. अगर isLightTheme, true है या तय नहीं किया गया है, तो prefers-color-scheme light है; नहीं तो, यह है dark.

इसका मतलब है कि अगर वेब कॉन्टेंट में prefers-color-scheme और कॉन्टेंट लेखक की अनुमति है. हल्के या गहरे रंग वाली थीम ऐप्लिकेशन की थीम से मेल खाने के लिए, वेब कॉन्टेंट पर अपने-आप लागू हो जाता है.

एल्गोरिदम पर आधारित गहरे रंग वाला मोड

ऐसे मामलों को कवर करने के लिए जहां वेब कॉन्टेंट का इस्तेमाल नहीं किया जाता prefers-color-scheme आपका ऐप्लिकेशन, ज़रूरत पड़ने पर वेबव्यू को एल्गोरिदम के ज़रिए डार्क मोड में डार्क मोड में जाने की अनुमति दे सकता है वेब कॉन्टेंट की ऐसी थीम जिसे वह रेंडर करता है.

अगर आपका ऐप्लिकेशन, ऐप्लिकेशन लेवल का इस्तेमाल कर रहा है एल्गोरिदम के इस्तेमाल के लिए, गहरे रंग वाली सेटिंग को ज़बरदस्ती लागू करें अपने ऐप्लिकेशन पर गहरे रंग वाली थीम लागू करें, तो नीचे दिया गया सेक्शन देखें. इसमें Force डार्क की मदद से, वेब कॉन्टेंट के लिए एल्गोरिदम की रोशनी को डार्क करने की अनुमति दें.

अगर आपका ऐप्लिकेशन फ़ोर्स डार्क का इस्तेमाल नहीं कर रहा है, तो आपका ऐप्लिकेशन यह कैसे तय करता है कि कब अनुमति देनी है वेबव्यू में एल्गोरिदम की रोशनी कम करने की प्रोसेस, आपके ऐप्लिकेशन की टारगेट एपीआई लेवल. Android 13 या इसके बाद के वर्शन को टारगेट करने वाले ऐप्लिकेशन और ज़्यादा जानकारी के लिए, Android 12 या इससे पहले के वर्शन को टारगेट करने वाले ऐप्लिकेशन.

Force डार्क की मदद से, वेब कॉन्टेंट के लिए एल्गोरिदम की रोशनी को डार्क करने की अनुमति दें

अगर आपका ऐप्लिकेशन, ऐप्लिकेशन लेवल का इस्तेमाल कर रहा है गहरे रंग वाला मोड लागू करें, वेबव्यू लागू होता है इन शर्तों के पूरा होने पर, एल्गोरिदम से वेब कॉन्टेंट को गहरे रंग में बदल दिया जाता है:

• वेबव्यू और इसके पैरंट एलिमेंट, फ़ोर्स डार्क को अनुमति देते हैं.
• गतिविधि की मौजूदा थीम को हल्के रंग के तौर पर मार्क किया गया है isLightTheme को इस पर सेट किया गया true.
• वेब कॉन्टेंट का लेखक, स्क्रीन पर दी गई जानकारी को धुंधला करने की सुविधा को साफ़ तौर पर बंद नहीं करता है.
• Android 13 (एपीआई लेवल 33) या उसके बाद के वर्शन को टारगेट करने वाले ऐप्लिकेशन के लिए, वेब कॉन्टेंट prefers-color-scheme का इस्तेमाल नहीं करता.
• Android 12 (एपीआई लेवल 32) या इससे पहले के वर्शन को टारगेट करने वाले ऐप्लिकेशन के लिए: ऐप्लिकेशन ने वेबव्यू की forceDarkMode सेटिंग से FORCE_DARK_AUTO साथ ही, ज़बरदस्ती डार्क मोड में अपनी रणनीति को DARK_STRATEGY_USER_AGENT_DARKENING_ONLY.

वेबव्यू और इसकी सभी पैरंट कंपनियां, ज़बरदस्ती डार्क मोड को ऐक्सेस करने की अनुमति दे सकती हैं. View.setForceDarkAllowed(). डिफ़ॉल्ट मान, डिफ़ॉल्ट मान की setForceDarkAllowed() विशेषता से लिया जाता है Android थीम, जिसे true पर भी सेट किया जाना चाहिए.

गहरे रंग वाला मोड ज़बरदस्ती इस्तेमाल करने की सुविधा, मुख्य रूप से उन ऐप्लिकेशन में पुराने सिस्टम के साथ काम करने की सुविधा के लिए दी गई है जिनमें गहरे रंग वाली थीम उपलब्ध न कराएं. अगर आपका ऐप्लिकेशन फ़ोर्स डार्क मोड का इस्तेमाल करता है, तो हमारा सुझाव है कि गहरे रंग वाली थीम की सुविधा जोड़ना.

एल्गोरिदम की मदद से गहरे रंग वाली सेटिंग को अनुमति दें (Android 13 या इसके बाद के वर्शन को टारगेट करने वाले ऐप्लिकेशन)

उन ऐप्लिकेशन के लिए जो ऐप्लिकेशन लेवल के Force डार्क का इस्तेमाल नहीं कर रहे हैं और Android 13 (एपीआई लेवल) को टारगेट करते हैं 33) या उसके बाद वाले वर्शन के लिए, AndroidX का इस्तेमाल करें setAlgorithmicDarkeningAllowed() विधि का इस्तेमाल करें और true में पास करें, ताकि यह तय किया जा सके कि वेबव्यू को एल्गोरिदम की अनुमति देनी चाहिए रंग गहरा करना. यह तरीका पिछले Android के साथ काम करता है वर्शन हैं.

इन शर्तों के पूरा होने पर, वेबव्यू तब एल्गोरिदम पर गहरे रंग का काम करता है, जब:

• वेब कॉन्टेंट में prefers-color-scheme का इस्तेमाल नहीं किया गया है.
• वेब कॉन्टेंट का लेखक, स्क्रीन पर मौजूद कॉन्टेंट को धुंधला करने की सुविधा को साफ़ तौर पर बंद नहीं करता है.

एल्गोरिदम की मदद से गहरे रंग वाली सेटिंग को अनुमति दें (Android 12 या इससे पहले के वर्शन को टारगेट करने वाले ऐप्लिकेशन)

उन ऐप्लिकेशन के लिए जो ऐप्लिकेशन-लेवल के Force डार्क का इस्तेमाल नहीं कर रहे हैं और Android 12 (एपीआई लेवल) को टारगेट करते हैं 32) या उससे कम, उपयोग करें FORCE_DARK_ON एल्गोरिदम की रोशनी कम करने के लिए किया जा सकता है.

FORCE_DARK_ON को इसके साथ इस्तेमाल करें FORCE_DARK_OFF अगर आपका ऐप्लिकेशन हल्के और गहरे रंग वाली थीम के बीच स्विच करने के लिए खुद का तरीका उपलब्ध कराता है, जैसे, यूज़र इंटरफ़ेस (यूआई) में टॉगल किए जा सकने वाले एलिमेंट या समय के हिसाब से अपने-आप चुने गए विकल्प.

यह देखने के लिए कि सुविधा काम करती है या नहीं, कोड की इन लाइनों को जोड़ें जहां भी आपका वेबव्यू ऑब्जेक्ट कॉन्फ़िगर किया जाए, जैसे कि Activity.onCreate में:

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    WebSettingsCompat.setForceDark(...)
}

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    WebSettingsCompat.setForceDark(...);
}

अगर आपका ऐप्लिकेशन, सिस्टम की सेटिंग में होने वाले बदलावों का पता लगाता है, तो आपके ऐप्लिकेशन को थीम में होने वाले बदलावों को साफ़ तौर पर सुनें और उन्हें FORCE_DARK_ON और FORCE_DARK_OFF राज्य.

नीचे दिया गया कोड स्निपेट, थीम का फ़ॉर्मैट बदलने का तरीका बताता है:

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    when (resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK) {
        Configuration.UI_MODE_NIGHT_YES -> {
            WebSettingsCompat.setForceDark(myWebView.settings, FORCE_DARK_ON)
        }
        Configuration.UI_MODE_NIGHT_NO, Configuration.UI_MODE_NIGHT_UNDEFINED -> {
            WebSettingsCompat.setForceDark(myWebView.settings, FORCE_DARK_OFF)
        }
        else -> {
            //
        }
    }
}

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
    switch (getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK) {
        case Configuration.UI_MODE_NIGHT_YES:
            WebSettingsCompat.setForceDark(myWebView.getSettings(), FORCE_DARK_ON);
            break;
        case Configuration.UI_MODE_NIGHT_NO:
        case Configuration.UI_MODE_NIGHT_UNDEFINED:
            WebSettingsCompat.setForceDark(myWebView.getSettings(), FORCE_DARK_OFF);
            break;
    }
}

गहरे रंग वाली थीम को पसंद के मुताबिक मैनेज करें

Google आपके यूआरएल पैरामीटर को कैसे इस्तेमाल करेगा, यह तय करने के लिए ForceDarkStrategy एपीआई का इस्तेमाल किया जा सकता है. यह एपीआई यह सिर्फ़ तब लागू होता है, जब फ़ोर्स डार्क मोड को FORCE_DARK_ON या FORCE_DARK_AUTO पर सेट किया गया हो.

एपीआई का इस्तेमाल करके, आपका ऐप्लिकेशन वेब थीम की रोशनी को कम करने वाली सुविधा या उपयोगकर्ता एजेंट का इस्तेमाल कर सकता है रंग गहरा करना:

• वेब थीम को गहरे रंग में दिखाना: वेब डेवलपर इसे लागू कर सकते हैं इसमें वेब पेज के दिखने का तरीका कंट्रोल करने के लिए @media (prefers-color-scheme: dark) गहरे रंग वाला मोड. वेबव्यू इन सेटिंग के हिसाब से कॉन्टेंट रेंडर करता है. इसके बारे में ज़्यादा जानकारी वेब थीम की रोशनी कम करने के लिए, खास जानकारी.
• उपयोगकर्ता एजेंट का रंग गहरा करना: वेबव्यू अपने-आप वेब के रंग बदल देता है पेज. अगर उपयोगकर्ता एजेंट को डार्क करने के लिए इस्तेमाल किया जाता है, @media (prefers-color-scheme: dark) क्वेरी का आकलन false में होता है.

दो रणनीतियों में से चुनने के लिए, नीचे दिए गए एपीआई का इस्तेमाल करें:

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK_STRATEGY)) {
    WebSettingsCompat.setForceDarkStrategy(...)
}

if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK_STRATEGY)) {
    WebSettingsCompat.setForceDarkStrategy(...);
}

इस्तेमाल की जा सकने वाली रणनीति के विकल्प हैं:

• DARK_STRATEGY_PREFER_WEB_THEME_OVER_USER_AGENT_DARKENING: यह विकल्प डिफ़ॉल्ट तौर पर लागू रहता है ज़्यादातर ब्राउज़र नई साइट पर Android के लिए <meta name="color-scheme" content="dark light"> टैग को वैकल्पिक के तौर पर जोड़ें वेबव्यू के डिफ़ॉल्ट मोड को वेब पेज की prefers-color-scheme मीडिया क्वेरी. वेबव्यू का इस्तेमाल इनके साथ किया जा सकता है DARK_STRATEGY_WEB_THEME_DARKENING_ONLY मोड में बदल सकते हैं, जिसमें WebView हमेशा मीडिया क्वेरी लागू करता है, भले ही टैग छोड़ा गया.

  हालांकि, हमारा सुझाव है कि वेब डेवलपर को <meta name="color-scheme" content="dark light"> ने अपनी वेबसाइट पर, पक्का करें कि कॉन्टेंट, WebViews में ठीक से रेंडर हो रहा है डिफ़ॉल्ट कॉन्फ़िगरेशन.

• DARK_STRATEGY_USER_AGENT_DARKENING_ONLY: इसे "उपयोगकर्ता-एजेंट को गहरा करना" कहा गया, वेबव्यू किसी भी वेब पेज की चमक को अनदेखा कर देता है और अपने-आप गहरे रंग की सुविधा लागू हो जाती है.

अगर आपका ऐप्लिकेशन पहले-पक्ष का ऐसा वेब कॉन्टेंट दिखाता है जिसे आपने prefers-color-scheme मीडिया क्वेरी, हमारा सुझाव है कि DARK_STRATEGY_WEB_THEME_DARKENING_ONLY ताकि यह पक्का हो सके कि वेबव्यू में पसंद के मुताबिक बनाई गई थीम का इस्तेमाल किया गया है.

गहरे रंग वाली थीम के उदाहरण के लिए, यह देखें GitHub पर वेबव्यू डेमो