सूचना कार्ड, सिस्टम या किसी ऐप्लिकेशन से समय पर बहुत कम जानकारी देते हैं.
Android Automotive OS के लिए इन कार्ड का डिज़ाइन, ड्राइवर का ध्यान भटकने से रोकने के लिए बनाया गया है. ये कार्ड तीन बुनियादी वर्शन में आते हैं:
- अलर्ट करने की सुविधा (HUN) कार्ड: इसका इस्तेमाल उस सूचना के लिए किया जाता है जो मौजूदा स्क्रीन पर थोड़ी देर के लिए दिखती है
- सूचना केंद्र कार्ड: इसका इस्तेमाल सूचना केंद्र में दी गई सूचनाओं के लिए किया जाता है
- ग्रुप में शामिल की गई सूचना कार्ड: इसमें एक कार्ड में, कई सूचना केंद्र के कार्ड जोड़े जाते हैं
इन वर्शन में, मैसेज की कैटगरी के मुताबिक डिज़ाइन थोड़े अलग हो सकते हैं. उदाहरण के लिए, कॉल से जुड़ी सूचनाओं के बटन और आइकॉन, नेविगेशन सूचनाओं से अलग होते हैं.
शरीर रचना
सूचना कार्ड में कई तरह के एलिमेंट शामिल हो सकते हैं. इसके तीन मुख्य वर्शन हैं:
- HUN कार्ड: यह वर्शन, सूचना केंद्र के कार्ड की तुलना में ज़्यादा चौड़ा है. यह मौजूदा स्क्रीन पर तब तक सबसे ऊपर दिखता है, जब तक इसे खारिज नहीं किया जाता
- सूचना केंद्र कार्ड: यह वर्शन HUN कार्ड की तुलना में छोटा है और सूचना केंद्र में ऐसे दूसरे कार्ड के साथ वर्टिकल सूची में दिखाई देता है
- ग्रुप में शामिल की गई सूचना कार्ड: सूचना केंद्र कार्ड के इस वर्शन में, एक ही कार्ड में मिलती-जुलती एक से ज़्यादा सूचनाएं जोड़ी जाती हैं. साथ ही, अलग-अलग सूचनाओं को बड़ा करके दिखाने के लिए कंट्रोल होते हैं
मैसेज टाइप के हिसाब से, इन वर्शन के वैरिएंट स्टाइल में दिखाए जाते हैं.
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-anatomy-hun-std.png?hl=hi)
1. हेडर
2. कॉन्टेंट (ज़रूरी नहीं है और मैसेज की झलक के साथ, इसे कार चलाते समय छिपाया जा सकता है)
3. कार्रवाइयां
4. बड़ा आइकॉन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-anatomy-grouped.png?hl=hi)
1. हेडर
2. कॉन्टेंट
3. कार्रवाई को बड़ा/छोटा करें
4. बड़ा/छोटा करने वाला इंडिकेटर
खास जानकारी – HUN कार्ड
स्टैंडर्ड एचयूएन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-specs-standard-hun.png?hl=hi)
अवतार के साथ मस्ती करें
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-specs-standard-hunwavatar.png?hl=hi)
झलक के साथ मैसेज HUN
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-specs-hun-preview.png?hl=hi)
कई मैसेज की मदद से HUN को मैसेज भेजें
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-specs-hun-preview-multiple.png?hl=hi)
बड़ी इमेज वाला HUN
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-specs-hun-largeimg.png?hl=hi)
खास जानकारी – सूचना केंद्र का कार्ड
सामान्य सूचना
![](https://developers.google.cn/cars/design/automotive-os/components/images/standard-notification-card-avatar.png?hl=hi)
झलक के साथ मैसेज की सूचना
![](https://developers.google.cn/cars/design/automotive-os/components/images/standard-notification-card-msg-preview.png?hl=hi)
एक से ज़्यादा मैसेज वाली मैसेज सूचना
![](https://developers.google.cn/cars/design/automotive-os/components/images/standard-notification-card-msg-preview-multi.png?hl=hi)
एक कार्रवाई की सूचना
![](https://developers.google.cn/cars/design/automotive-os/components/images/standard-notification-card-onebutton.png?hl=hi)
खास जानकारी – ग्रुप किया गया सूचना कार्ड
ग्रुप की गई सूचना – छोटा किया गया
![](https://developers.google.cn/cars/design/automotive-os/components/images/grpd-notifications-collapsed.png?hl=hi)
ग्रुप की गई सूचना – बड़ा किया गया
![](https://developers.google.cn/cars/design/automotive-os/components/images/grpd-notifications-expanded.png?hl=hi)
स्केलिंग लेआउट
ये रेफ़रंस लेआउट, अलग-अलग चौड़ाई और ऊंचाई वाली स्क्रीन में बदलाव करने के लिए सूचनाएं पाने का तरीका दिखाते हैं. (चौड़ाई और ऊंचाई की कैटगरी लेआउट सेक्शन में बताई गई हैं.) ध्यान दें कि डाउन-सैंपलिंग या अप-सैंपलिंग शुरू होने से पहले, सभी पिक्सल वैल्यू रेंडर किए गए पिक्सल में होती हैं.
मानक-चौड़ाई वाली स्क्रीन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-hun-std.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-std-std.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-grp-collapsed-std.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-grp-std.png?hl=hi)
चौड़ी स्क्रीन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-hun-wide.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-std-wide.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-grp-collapsed-wide.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-grp-wide.png?hl=hi)
ज़्यादा चौड़ी और सुपर वाइड स्क्रीन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-hun-xwide.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-std-xwide.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-grp-collapsed-xwide.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-grp-xwide.png?hl=hi)
अलग-अलग ऊंचाई की स्क्रीन पर सूचनाओं के लिए वर्टिकल स्पेस
इस सेक्शन में वर्टिकल स्पेसिंग से जुड़ी जानकारी सिर्फ़ HUN कार्ड के लिए दी गई है. सूचना केंद्र में कार्ड की वर्टिकल दूरी के बारे में जानकारी के लिए, सूचना केंद्र से जुड़ी जानकारी देखें.
छोटी स्क्रीन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notifications-hun-short.png?hl=hi)
ऊंची और सामान्य ऊंचाई वाली स्क्रीन
![](https://developers.google.cn/cars/design/automotive-os/components/images/notifications-hun-stdtall.png?hl=hi)
स्टाइल
टाइपाेग्राफ़ी
टाइप करने का स्टाइल | टाइपफ़ेस | वज़न | साइज़ (dp) |
---|---|---|---|
मुख्य भाग एक | Roboto | सामान्य | 32 |
बॉडी 3 M | Roboto | मीडियम | 24 |
मुख्य भाग 3 | Roboto | सामान्य | 24 |
रंग
एलिमेंट | कलर(दिन मोड) | कलर (नाइट मोड) |
---|---|---|
मुख्य टाइप / आइकॉन | सफ़ेद | सफ़ेद @ 88% |
सेकंडरी टाइप | सफ़ेद @ 72% | सफ़ेद @ 60% |
सेकंडरी आइकॉन | तीसरे पक्ष का लहजा | तीसरे पक्ष का लहजा |
डिवाइडर हेयरलाइन | सफ़ेद 22% | सफ़ेद 12% |
कार्ड का बैकग्राउंड | स्लेटी 868 | स्लेटी 900 |
ग्रेडिएंट स्क्रिम | काला 100% - 0% | काला 100% - 20% |
साइज़ बदलना
एलिमेंट | साइज़ (dp) |
---|---|
प्राइमरी आइकॉन | 44 |
सेकंडरी आइकॉन | 36 |
मीडियम अवतार | 76 |
गोल कोने की रेडियस (R2) | 8 |
उदाहरण
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-hun-examples.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-card-examples.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-group-examples-messages-day.png?hl=hi)
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-group-examples-messages-night.png?hl=hi)
मोशन
ये मोशन, सूचना पाने की सुविधा का अहम हिस्सा हैं:
- HUN के पहुंचने की स्पीड
- सूचना को खारिज करने के लिए, स्वाइप करने का मोशन
- ग्रुप की गई सूचना, हलचल को बड़ा और छोटा करती है
HUN पर आने का समय
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-hud-auto-dismiss-new.gif?hl=hi)
खारिज करने के लिए स्वाइप करें
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-appear-dismiss-new.gif?hl=hi)
ग्रुप की गई सूचना को बड़ा और छोटा करें
![](https://developers.google.cn/cars/design/automotive-os/components/images/notification-expand-group-2.gif?hl=hi)