अपने PWA को एक ऐप्लिकेशन जैसा बनाने के लिए, विंडो कंट्रोल के बगल में मौजूद टाइटल बार वाले हिस्से का इस्तेमाल करें.
अगर आपको मेरा लेख याद है, तो अपने PWA को ऐप्लिकेशन जैसा महसूस कराएं, आपको याद होगा कि कैसे मैंने अपने ऐप्लिकेशन के टाइटल बार को पसंद के मुताबिक बनाने की रणनीति के बारे में बताया था. यहां एक उदाहरण में बताया गया है कि macOS Podcasts ऐप्लिकेशन में यह कैसा दिख सकता है.
आप शायद यह कहना चाहें कि Podcasts एक प्लैटफ़ॉर्म पर काम करने वाला एक macOS ऐप्लिकेशन है, जो किसी ब्राउज़र पर नहीं चलता. इसलिए, ब्राउज़र के नियमों का पालन किए बिना, यह किया जा सकता है. यह सही है, लेकिन अच्छी खबर यह है कि इस लेख का विषय विंडो कंट्रोल ओवरले सुविधा से, जल्द ही आपको अपने PWA के लिए मिलते-जुलते यूज़र इंटरफ़ेस बनाने की सुविधा मिलेगी.
विंडो कंट्रोल ओवरले के कॉम्पोनेंट
विंडो कंट्रोल ओवरले में चार सब-सुविधाएं होती हैं:
- वेब ऐप्लिकेशन मेनिफ़ेस्ट में
"display_override"फ़ील्ड के लिए"window-controls-overlay"वैल्यू. - सीएसएस एनवायरमेंट वैरिएबल
titlebar-area-x,titlebar-area-y,titlebar-area-width, औरtitlebar-area-height. - पहले के मालिकाना हक वाली सीएसएस प्रॉपर्टी
-webkit-app-regionकोapp-regionप्रॉपर्टी के तौर पर तय करना. इससे वेब कॉन्टेंट में, खींचने और छोड़ने लायक जगहें तय की जाती हैं. - यह
window.navigatorकेwindowControlsOverlayसदस्य के ज़रिए, विंडो को कंट्रोल करने वाले क्षेत्र के लिए क्वेरी करने और उस पर काम करने का तरीका है.
विंडो कंट्रोल ओवरले क्या है
टाइटल बार वाला हिस्सा, विंडो कंट्रोल के बाईं या दाईं ओर मौजूद स्पेस के बारे में बताता है. इसमें अक्सर ऐप्लिकेशन का टाइटल शामिल होता है. इसमें विंडो को छोटा करने, बड़ा करने, बंद करने वगैरह के लिए बटन मौजूद होते हैं. विंडो कंट्रोल ओवरले की मदद से, प्रोग्रेसिव वेब ऐप्लिकेशन (PWA) को पूरी चौड़ाई वाले मौजूदा टाइटल बार की जगह, विंडो कंट्रोल वाले छोटे ओवरले से ऐप्लिकेशन जैसा अनुभव मिलता है. इससे डेवलपर पसंद के मुताबिक कॉन्टेंट को उस टाइटल बार एरिया में डाल सकते हैं जिसे पहले ब्राउज़र से कंट्रोल किया जाता था.
मौजूदा स्थिति
| चरण | स्थिति |
|---|---|
| 1. जानकारी बनाएं | पूरा हुआ |
| 2. खास जानकारी का शुरुआती ड्राफ़्ट बनाएं | पूरा हुआ |
| 3. लोगों की राय जानें और डिज़ाइन को बेहतर बनाएं | प्रोसेस जारी है |
| 4. ऑरिजिन ट्रायल | पूरा जवाब |
| 5. लॉन्च करें | पूरा हुआ (Chromium 104 में) |
विंडो कंट्रोल ओवरले को इस्तेमाल करने का तरीका
वेब ऐप्लिकेशन मेनिफ़ेस्ट में window-controls-overlay को जोड़ा जा रहा है
प्रोग्रेसिव वेब ऐप्लिकेशन, वेब ऐप्लिकेशन मेनिफ़ेस्ट में "window-controls-overlay" को "display_override" के मुख्य सदस्य के तौर पर जोड़कर, विंडो कंट्रोल ओवरले में ऑप्ट-इन कर सकता है:
{
"display_override": ["window-controls-overlay"]
}
नीचे दी गई सभी शर्तें पूरी होने पर ही, विंडो कंट्रोल ओवरले दिखेगा:
- ऐप्लिकेशन को ब्राउज़र में नहीं, बल्कि किसी अलग PWA विंडो में खोला गया है.
- मेनिफ़ेस्ट में
"display_override": ["window-controls-overlay"]शामिल है. (बाद में, अन्य वैल्यू की भी अनुमति दी जाती है.) - PWA, डेस्कटॉप ऑपरेटिंग सिस्टम पर चल रहा है.
- मौजूदा ऑरिजिन, उस ऑरिजिन से मेल खाता है जिसके लिए PWA इंस्टॉल किया गया था.
इसकी वजह से टाइटल बार खाली होता है. इसमें ऑपरेटिंग सिस्टम के हिसाब से, बाईं या दाईं ओर सामान्य विंडो कंट्रोल होते हैं.
कॉन्टेंट को टाइटल बार में ले जाना
अब टाइटल बार में खाली जगह बची है, तो कोई भी कॉन्टेंट वहां पर ले जाया जा सकता है. इस लेख के लिए, मैंने Wikimedia के चुनिंदा कॉन्टेंट का PWA बनाया है. इस ऐप्लिकेशन के लिए एक उपयोगी सुविधा यह हो सकती है कि लेख के टाइटल में शब्दों की खोज की जाए. खोज की सुविधा के लिए एचटीएमएल ऐसा दिखता है:
<div class="search">
<img src="logo.svg" alt="Wikimedia logo." width="32" height="32" />
<label>
<input type="search" />
Search for words in articles
</label>
</div>
इस div को टाइटल बार में ले जाने के लिए, कुछ सीएसएस की ज़रूरत होती है:
.search {
/* Make sure the `div` stays there, even when scrolling. */
position: fixed;
/**
* Gradient, because why not. Endless opportunities.
* The gradient ends in `#36c`, which happens to be the app's
* `<meta name="theme-color" content="#36c">`.
*/
background-image: linear-gradient(90deg, #36c, #131313, 33%, #36c);
/* Use the environment variable for the left anchoring with a fallback. */
left: env(titlebar-area-x, 0);
/* Use the environment variable for the top anchoring with a fallback. */
top: env(titlebar-area-y, 0);
/* Use the environment variable for setting the width with a fallback. */
width: env(titlebar-area-width, 100%);
/* Use the environment variable for setting the height with a fallback. */
height: env(titlebar-area-height, 33px);
}
नीचे दिए गए स्क्रीनशॉट में, इस कोड का असर देखा जा सकता है. टाइटल बार पूरी तरह से रिस्पॉन्सिव है. जब PWA विंडो का साइज़ बदला जाता है, तो टाइटल बार इस तरह प्रतिक्रिया देता है जैसे वह सामान्य एचटीएमएल कॉन्टेंट से बना हो.
यह तय करना कि टाइटल बार के किन हिस्सों को खींचा जा सकता है
ऊपर दिए गए स्क्रीनशॉट से पता चलता है कि आपका काम हो गया है, लेकिन आपको अभी तक पूरा नहीं हुआ है. PWA विंडो को अब खींचा जा सकता है (बहुत छोटे इलाके के अलावा), क्योंकि विंडो कंट्रोल बटन, ड्रैग एरिया नहीं होते हैं. साथ ही, बाकी के टाइटल बार में खोज विजेट शामिल होता है. इसे ठीक करने के लिए, drag की वैल्यू वाली app-region सीएसएस प्रॉपर्टी का इस्तेमाल करें. कंक्रीट के मामले में, input एलिमेंट के अलावा, हर चीज़ को खींचकर छोड़ा जा सकता है.
/* The entire search `div` is draggable… */
.search {
-webkit-app-region: drag;
app-region: drag;
}
/* …except for the `input`. */
input {
-webkit-app-region: no-drag;
app-region: no-drag;
}
इस सीएसएस के साथ, उपयोगकर्ता div, img या label को खींचकर ऐप्लिकेशन विंडो को हमेशा की तरह खींच सकता है. सिर्फ़ input एलिमेंट इंटरैक्टिव है, इसलिए खोज क्वेरी डाली जा सकती है.
सुविधा की पहचान करने की सुविधा
जांच करके, विंडो कंट्रोल ओवरले के साथ काम करने की सुविधा का पता लगाया जा सकता है, ताकि यह पता लगाया जा सके कि
windowControlsOverlay:
if ('windowControlsOverlay' in navigator) {
// Window Controls Overlay is supported.
}
विंडो को क्वेरी करने पर, windowControlsOverlay के साथ इलाके को कंट्रोल किया जाता है
अब तक कोड में एक समस्या है: कुछ प्लैटफ़ॉर्म पर विंडो कंट्रोल दाईं ओर हैं, दूसरे प्लैटफ़ॉर्म पर वे बाईं ओर हैं. मामलों को बदतर बनाने के लिए, "तीन बिंदु वाला" Chrome मेन्यू की जगह भी
प्लैटफ़ॉर्म के हिसाब से बदल जाएगी. इसका मतलब है कि लीनियर ग्रेडिएंट बैकग्राउंड की इमेज को
#131313→maroon या maroon→#131313→maroon से अपनी पसंद के मुताबिक बनाना चाहिए, ताकि यह
<meta name="theme-color" content="maroon"> से तय किए गए टाइटल बार के maroon बैकग्राउंड के रंग से जुड़ जाए. इसके लिए, navigator.windowControlsOverlay प्रॉपर्टी पर getTitlebarAreaRect() एपीआई से क्वेरी करें.
if ('windowControlsOverlay' in navigator) {
const { x } = navigator.windowControlsOverlay.getTitlebarAreaRect();
// Window controls are on the right (like on Windows).
// Chrome menu is left of the window controls.
// [ windowControlsOverlay___________________ […] [_] [■] [X] ]
if (x === 0) {
div.classList.add('search-controls-right');
}
// Window controls are on the left (like on macOS).
// Chrome menu is right of the window controls overlay.
// [ [X] [_] [■] ___________________windowControlsOverlay [⋮] ]
else {
div.classList.add('search-controls-left');
}
} else {
// When running in a non-supporting browser tab.
div.classList.add('search-controls-right');
}
.search क्लास सीएसएस के नियमों में सीधे तौर पर (पहले की तरह) बैकग्राउंड इमेज होने के बजाय, बदला गया कोड अब दो क्लास का इस्तेमाल करता है जिन्हें ऊपर दिया गया कोड डाइनैमिक तौर पर सेट करता है.
/* For macOS: */
.search-controls-left {
background-image: linear-gradient(90deg, #36c, 45%, #131313, 90%, #36c);
}
/* For Windows: */
.search-controls-right {
background-image: linear-gradient(90deg, #36c, #131313, 33%, #36c);
}
यह तय किया जा रहा है कि विंडो कंट्रोल ओवरले दिख रहा है या नहीं
सभी स्थितियों में, टाइटल बार वाले हिस्से में विंडो कंट्रोल ओवरले नहीं दिखेगा. यह सुविधा,
उन ब्राउज़र में उपलब्ध नहीं होगी जिन पर विंडो कंट्रोल ओवरले की सुविधा काम नहीं करती.
हालांकि, ऐसा तब भी नहीं होगा,
जब PWA किसी टैब में चलाया जाएगा. इस स्थिति का पता लगाने के लिए, windowControlsOverlay की visible प्रॉपर्टी में क्वेरी करें:
if (navigator.windowControlsOverlay.visible) {
// The window controls overlay is visible in the title bar area.
}
इसके अलावा, JavaScript और/या सीएसएस में display-mode मीडिया क्वेरी का इस्तेमाल भी किया जा सकता है:
// Create the query list.
const mediaQueryList = window.matchMedia('(display-mode: window-controls-overlay)');
// Define a callback function for the event listener.
function handleDisplayModeChange(mql) {
// React on display mode changes.
}
// Run the display mode change handler once.
handleDisplayChange(mediaQueryList);
// Add the callback function as a listener to the query list.
mediaQueryList.addEventListener('change', handleDisplayModeChange);
@media (display-mode: window-controls-overlay) {
/* React on display mode changes. */
}
ज्यामिति में बदलाव के बारे में सूचना मिलना
getTitlebarAreaRect() के साथ विंडो कंट्रोल ओवरले एरिया को क्वेरी करने से, एक बार में काफ़ी हो सकता है. जैसे, विंडो कंट्रोल की जगह के मुताबिक सही बैकग्राउंड इमेज सेट करना. हालांकि, अन्य मामलों में ज़्यादा बेहतर कंट्रोल की ज़रूरत होती है. उदाहरण के लिए, उपलब्ध जगह के आधार पर विंडो कंट्रोल ओवरले को अपनाया जा सकता है. साथ ही, ज़रूरत के मुताबिक जगह होने पर विंडो कंट्रोल ओवरले में चुटकुला जोड़ा जा सकता है.
navigator.windowControlsOverlay.ongeometrychange की सदस्यता लेकर या geometrychange इवेंट के लिए, इवेंट लिसनर सेट करके, ज्यामिति में होने वाले बदलावों के बारे में सूचना पाई जा सकती है. यह इवेंट सिर्फ़ तब ट्रिगर होगा, जब विंडो कंट्रोल ओवरले दिखे. इसका मतलब है कि जब navigator.windowControlsOverlay.visible true हो, तब ही चालू होगा.
const debounce = (func, wait) => {
let timeout;
return function executedFunction(...args) {
const later = () => {
clearTimeout(timeout);
func(...args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
};
if ('windowControlsOverlay' in navigator) {
navigator.windowControlsOverlay.ongeometrychange = debounce((e) => {
span.hidden = e.titlebarAreaRect.width < 800;
}, 250);
}
ongeometrychange को कोई फ़ंक्शन असाइन करने के बजाय, windowControlsOverlay में इवेंट लिसनर को जोड़ें. इसका तरीका नीचे बताया गया है. इन दोनों के बीच के अंतर के बारे में जानने के लिए,
एमडीएन पर जाएं.
navigator.windowControlsOverlay.addEventListener(
'geometrychange',
debounce((e) => {
span.hidden = e.titlebarAreaRect.width < 800;
}, 250),
);
किसी टैब में और काम नहीं करने वाले ब्राउज़र पर चलते समय संगतता
यहां दो बातों पर गौर किया जा सकता है:
- ऐसा ऐप्लिकेशन जो ऐसे ब्राउज़र में चल रहा है जिस पर विंडो कंट्रोल ओवरले काम करता है, लेकिन ब्राउज़र टैब में इस ऐप्लिकेशन का इस्तेमाल कहां किया जा रहा है.
- ऐसा तब होता है, जब ऐप्लिकेशन ऐसे ब्राउज़र में चल रहा हो जो विंडो कंट्रोल ओवरले पर काम नहीं करता.
दोनों मामलों में, डिफ़ॉल्ट रूप से विंडो कंट्रोल ओवरले के लिए बनाया गया एचटीएमएल, सामान्य एचटीएमएल कॉन्टेंट की तरह इनलाइन दिखेगा. साथ ही, env() वैरिएबल की फ़ॉलबैक वैल्यू, पोज़िशनिंग के लिए चालू होंगी. साथ काम करने वाले ब्राउज़र पर, आप यह भी तय कर सकते हैं कि विंडो कंट्रोल ओवरले के लिए तय किया गया एचटीएमएल, ओवरले न किया जाए. इसके लिए, ओवरले की visible प्रॉपर्टी देखें. अगर यह false रिपोर्ट करता है, तो उस एचटीएमएल कॉन्टेंट को छिपाएं.
आपको याद दिला दें कि काम न करने वाले ब्राउज़र या तो
"display_override" वेब ऐप्लिकेशन मेनिफ़ेस्ट प्रॉपर्टी को शामिल नहीं करेंगे या
"window-controls-overlay" को नहीं पहचानेंगे. इसलिए, फ़ॉलबैक चेन के मुताबिक अगली संभावित वैल्यू का इस्तेमाल करेंगे,
उदाहरण के लिए, "standalone".
यूज़र इंटरफ़ेस (यूआई) के बारे में जानकारी
हालांकि, यह आपको लुभाने वाला लग सकता है, लेकिन हम विंडो कंट्रोल ओवरले वाले इलाके में क्लासिक ड्रॉपडाउन मेन्यू बनाने का सुझाव नहीं देते. ऐसा करने से, macOS पर डिज़ाइन से जुड़े दिशा-निर्देशों का उल्लंघन होगा. यह ऐसा प्लैटफ़ॉर्म है जिस पर उपयोगकर्ता को स्क्रीन के सबसे ऊपर, मेन्यू बार (सिस्टम से मिले दोनों बार और पसंद के मुताबिक बनाए गए बार) की उम्मीद होती है.
अगर आपका ऐप्लिकेशन फ़ुलस्क्रीन पर दिखता है, तो इस बात पर ध्यान से विचार करें कि आपके विंडो कंट्रोल ओवरले को फ़ुलस्क्रीन व्यू में शामिल करना सही है या नहीं. ऐसा हो सकता है कि onfullscreenchange इवेंट के आग लगने पर, अपने लेआउट को फिर से व्यवस्थित किया जाए.
डेमो
मैंने एक डेमो बनाया है, जिसे अलग-अलग समर्थित और गैर-सहायक ब्राउज़र ब्राउज़र के साथ-साथ इंस्टॉल और इंस्टॉल न होने की स्थिति में भी देखा जा सकता है. विंडो कंट्रोल ओवरले का असल अनुभव पाने के लिए, आपको ऐप्लिकेशन इंस्टॉल करना होगा. नीचे इस बात के दो स्क्रीनशॉट देखे जा सकते हैं कि आपको क्या करना है. ऐप्लिकेशन का सोर्स कोड Glitch पर उपलब्ध है.
विंडो कंट्रोल ओवरले में, खोजने की सुविधा पूरी तरह से काम कर रही है:
सुरक्षा से जुड़ी बातें
Chromium की टीम ने विंडो कंट्रोल ओवरले एपीआई को डिज़ाइन करने और उसे लागू करने के लिए, वेब प्लैटफ़ॉर्म की बेहतर सुविधाओं का ऐक्सेस कंट्रोल करना सेक्शन में बताए गए मुख्य सिद्धांतों का पालन किया है. इन सिद्धांतों में, उपयोगकर्ता कंट्रोल, पारदर्शिता, और एल्गोरिदम की जानकारी शामिल है.
स्पूफ़िंग
साइटों को टाइटल बार का कुछ हिस्सा कंट्रोल करने की सुविधा देने से, डेवलपर के लिए उस कॉन्टेंट को धोखा देने की जगह मिल जाती है जो पहले एक भरोसेमंद और ब्राउज़र-कंट्रोल वाला इलाका था. फ़िलहाल, Chromium ब्राउज़र में, स्टैंडअलोन मोड में एक टाइटल बार शामिल होता है, जो शुरुआती लॉन्च पर बाईं ओर वेबपेज का टाइटल और दाईं ओर पेज का ऑरिजिन दिखाता है. इसके बाद, "सेटिंग और ज़्यादा" बटन और विंडो कंट्रोल दिखते हैं. कुछ सेकंड के बाद, मूल टेक्स्ट गायब हो जाता है. अगर ब्राउज़र को दाईं-से-बाईं (आरटीएल) भाषा पर सेट किया गया है, तो इस लेआउट को इस तरह फ़्लिप किया जाता है कि ऑरिजिन टेक्स्ट बाईं ओर दिखता है. इससे ऑरिजिन को धोखा देने के लिए विंडो कंट्रोल ओवरले खुल जाता है. अगर ओवरले के ऑरिजिन और दाएं किनारे के बीच ज़रूरत के मुताबिक पैडिंग नहीं है, तो. उदाहरण के लिए, ऑरिजिन "evil.ltd" को किसी भरोसेमंद साइट "google.com" के साथ जोड़ा जा सकता है. इससे उपयोगकर्ताओं को ऐसा लगेगा कि सोर्स भरोसेमंद है. हमारा प्लान है कि इस ऑरिजिन टेक्स्ट को मिटाया जाए, ताकि उपयोगकर्ताओं को पता चल सके कि ऐप्लिकेशन का ऑरिजिन क्या है. साथ ही, वे यह पक्का कर सकें कि ऐप्लिकेशन उनकी ज़रूरतों के हिसाब से है. RTL से कॉन्फ़िगर किए गए ब्राउज़र के लिए, ऑरिजिन टेक्स्ट के दाईं ओर ज़रूरत के मुताबिक पैडिंग (जगह) होनी चाहिए, ताकि नुकसान पहुंचाने वाली वेबसाइट को असुरक्षित ऑरिजिन में, भरोसेमंद ऑरिजिन के साथ जोड़ने से रोका जा सके.
फ़िंगरप्रिंटिंग
विंडो कंट्रोल ओवरले और ड्रैग किए जा सकने वाले इलाके की सुविधा चालू करने से, सुविधा का पता लगाने के अलावा, निजता से जुड़ी कोई अहम समस्या पैदा नहीं होती. हालांकि, सभी ऑपरेटिंग सिस्टम में विंडो कंट्रोल बटन के साइज़ और पोज़िशन अलग-अलग होने की वजह से, navigator. तरीका एक DOMRect दिखाता है. इसकी पोज़िशन और डाइमेंशन से यह पता चलता है कि ब्राउज़र किस ऑपरेटिंग सिस्टम पर चल रहा है. फ़िलहाल, डेवलपर उपयोगकर्ता एजेंट स्ट्रिंग से ओएस का पता
पहले से ही लगा सकते हैं. हालांकि, फ़िंगरप्रिंट की सुविधा से जुड़ी समस्याओं की वजह से, UA स्ट्रिंग को फ़्रीज़ करने और ओएस वर्शन को एक साथ जोड़ने के बारे में चर्चा हो रही है. ब्राउज़र कम्यूनिटी में यह समझने की लगातार कोशिश की जा रही है कि
अलग-अलग प्लैटफ़ॉर्म पर विंडो कंट्रोल ओवरले का साइज़ कितनी बार बदलता है. ऐसा इसलिए है, क्योंकि मौजूदा अनुमान के हिसाब से ये ओएस वर्शन पर काफ़ी स्थिर हैं और इसलिए माइनर ओएस वर्शन देखने के लिए काम की नहीं हैं. हालांकि, यह फ़िंगरप्रिंटिंग की एक समस्या है, लेकिन यह सिर्फ़ इंस्टॉल किए गए उन PWA पर लागू होती है जो पसंद के मुताबिक बनाए गए टाइटल बार की सुविधा का इस्तेमाल करते हैं. यह ब्राउज़र के सामान्य इस्तेमाल पर लागू नहीं होता. इसके अलावा,
navigator. एपीआई, PWA में एम्बेड किए गए
iframe के लिए उपलब्ध नहीं होगा.
नेविगेशन
किसी PWA में किसी अलग ऑरिजिन पर जाने पर, यह सामान्य स्टैंडअलोन टाइटल बार पर वापस चला जाएगा. भले ही, वह ऊपर दी गई शर्तों को पूरा करता हो और उसे विंडो कंट्रोल ओवरले के साथ लॉन्च किया गया हो. ऐसा इसलिए है, ताकि नेविगेशन पर किसी अलग ऑरिजिन पर दिखने वाले काले रंग के बार को अडजस्ट किया जा सके. ओरिजनल ऑरिजिन पर वापस जाने के बाद, विंडो कंट्रोल ओवरले का फिर से इस्तेमाल किया जाएगा.
सुझाव/राय दें या शिकायत करें
Chromium की टीम, Window Controls Overlay API इस्तेमाल करने के आपके अनुभवों के बारे में जानना चाहती है.
हमें इस एपीआई के डिज़ाइन के बारे में बताएं
क्या एपीआई में ऐसा कुछ है जो आपकी उम्मीद के मुताबिक काम नहीं करता? या ऐसा नहीं है कि अपना आइडिया लागू करने के लिए, ऐसे तरीके या प्रॉपर्टी मौजूद नहीं हैं जिनकी ज़रूरत आपको है? क्या सुरक्षा मॉडल के बारे में आपका कोई सवाल या टिप्पणी है? इससे जुड़े GitHub रेपो के बारे में कोई खास समस्या दर्ज करें या किसी मौजूदा समस्या पर अपने विचार जोड़ें.
लागू करने से जुड़ी समस्या की शिकायत करें
क्या आपको Chromium को लागू करने में कोई गड़बड़ी मिली? या क्या इसे लागू करने की प्रक्रिया खास जानकारी से अलग है?
new.crbug.com पर गड़बड़ी की शिकायत करें. जितना हो सके ज़्यादा से ज़्यादा जानकारी शामिल करें, सामग्री को फिर से बनाने के आसान निर्देश दें और घटक बॉक्स में UI>Browser>WebAppInstalls डालें. Glitch का इस्तेमाल करके, तुरंत और आसान तरीकों को शेयर किया जा सकता है.
एपीआई के साथ काम करता है
क्या आपको Window Controls Overlay API इस्तेमाल करना है? आपकी सार्वजनिक मदद से, Chromium की टीम को सुविधाओं को प्राथमिकता देने में मदद मिलती है. साथ ही, इससे दूसरे ब्राउज़र वेंडर को पता चलता है कि उनकी मदद करना कितना ज़रूरी है.
#WindowControlsOverlay हैशटैग के साथ @ChromiumDev को एक ट्वीट भेजें. साथ ही, हमें बताएं कि इसका इस्तेमाल कहां और कैसे किया जा रहा है.
मददगार लिंक
- पूरी जानकारी
- खास जानकारी वाला ड्राफ़्ट
- Chromium की गड़बड़ी
- Chrome Platform का स्टेटस एंट्री
- टैग की समीक्षा
- Microsoft Edge से मिलते-जुलते दस्तावेज़
स्वीकार हैं
विंडो कंट्रोल ओवरले को लागू किया गया. यह Microsoft Edge की टीम की अमैंडा बेकर ने तय की है. इस लेख की समीक्षा जो मेडली और केनेथ रोह्ड क्रिश्चनसन ने की है. Unsplash पर सिगमुंड की हीरो इमेज.