ऐप्लिकेशन बार, स्क्रीन पर सबसे ऊपर या सबसे नीचे मौजूद कंटेनर होते हैं. इनसे आपके उपयोगकर्ताओं को मुख्य सुविधाओं और नेविगेशन आइटम का ऐक्सेस मिलता है:
टाइप |
थीम |
मकसद |
---|---|---|
ऐप्लिकेशन का टॉप बार | स्क्रीन पर सबसे ऊपर. |
इससे मुख्य टास्क और जानकारी को ऐक्सेस किया जा सकता है. आम तौर पर, इसमें टाइटल, मुख्य ऐक्शन आइटम, और कुछ नेविगेशन आइटम होते हैं. |
बॉटम ऐप्लिकेशन बार | स्क्रीन पर सबसे नीचे. |
आम तौर पर, इसमें मुख्य नेविगेशन आइटम शामिल होते हैं. अन्य कार्रवाइयों का ऐक्सेस दे सकता है. उदाहरण के लिए, फ़्लोटिंग ऐक्शन बटन का इस्तेमाल करके. |
वर्शन के साथ काम करना
इसे लागू करने के लिए, ज़रूरी है कि आपके प्रोजेक्ट का minSDK एपीआई लेवल 21 या उससे ज़्यादा पर सेट हो.
डिपेंडेंसी
टॉप ऐप्लिकेशन बार लागू करना
नीचे दिए गए कोड में, सबसे ऊपर मौजूद ऐप्लिकेशन बार के चार टाइप को लागू करने का तरीका बताया गया है. इसमें स्क्रोल करने के तरीके को कंट्रोल करने के अलग-अलग उदाहरण भी शामिल हैं.
- छोटा टॉप ऐप्लिकेशन बार
- ऐप्लिकेशन का टॉप बार, जो बीच में अलाइन किया गया हो
- मीडियम साइज़ का ऐप्लिकेशन टॉप बार
- सबसे ऊपर मौजूद बड़ा ऐप्लिकेशन बार
टॉप पर मौजूद छोटा ऐप्लिकेशन बार
सबसे ऊपर छोटा ऐप्लिकेशन बार बनाने के लिए, TopAppBar
कॉम्पोज़ेबल का इस्तेमाल करें. यह सबसे आसान टॉप ऐप्लिकेशन बार है. इस उदाहरण में सिर्फ़ एक टाइटल है.
इस उदाहरण में, TopAppBar
को scrollBehavior
के लिए कोई वैल्यू नहीं दी गई है. इसलिए, सबसे ऊपर मौजूद ऐप्लिकेशन बार, अंदर मौजूद कॉन्टेंट को स्क्रोल करने पर कोई प्रतिक्रिया नहीं देता.
नतीजा
![सबसे ऊपर मौजूद छोटे ऐप्लिकेशन बार का उदाहरण.](https://developer.android.google.cn/static/develop/ui/compose/images/components/appbar-small.png?hl=hi)
बीच में अलाइन किया गया सबसे ऊपर मौजूद ऐप्लिकेशन बार
बीच में अलाइन किया गया सबसे ऊपर मौजूद ऐप्लिकेशन बार, छोटे ऐप्लिकेशन बार जैसा ही होता है. हालांकि, इसमें टाइटल कॉम्पोनेंट के बीच में होता है. इसे लागू करने के लिए, CenterAlignedTopAppBar
के लिए बने खास कॉम्पोज़ेबल का इस्तेमाल करें.
इस उदाहरण में, enterAlwaysScrollBehavior()
का इस्तेमाल करके वह वैल्यू हासिल की जाती है जो scrollBehavior
के लिए पास की जाती है. जब उपयोगकर्ता स्काफ़़ल के अंदर मौजूद कॉन्टेंट को स्क्रोल करता है, तब बार छोटा हो जाता है.
नतीजा
![यहां अपना वैकल्पिक लेख लिखें](https://developer.android.google.cn/static/develop/ui/compose/images/components/appbar-centered.png?hl=hi)
मीडियम साइज़ का टॉप ऐप्लिकेशन बार
मीडियम साइज़ के टॉप ऐप्लिकेशन बार में, टाइटल को अन्य आइकॉन के नीचे रखा जाता है. एक बनाने के लिए, MediumTopAppBar
कॉम्पोज़ेबल का इस्तेमाल करें.
पिछले कोड की तरह ही, यह उदाहरण enterAlwaysScrollBehavior()
का इस्तेमाल करके, scrollBehavior
के लिए पास की गई वैल्यू पाता है.
नतीजा
enterAlwaysScrollBehavior
में स्क्रोल करने के तरीके को दिखाने वाला, ऊपर मौजूद मीडियम ऐप्लिकेशन बार.सबसे ऊपर मौजूद बड़ा ऐप्लिकेशन बार
सबसे ऊपर मौजूद ऐप्लिकेशन बार का बड़ा साइज़, मीडियम साइज़ से मिलता-जुलता है. हालांकि, टाइटल और आइकॉन के बीच का पैडिंग ज़्यादा होता है और यह स्क्रीन पर ज़्यादा जगह लेता है. इसे बनाने के लिए, LargeTopAppBar
) कॉम्पोनेंट का इस्तेमाल करें.
इस उदाहरण में, scrollBehavior
के लिए पास की गई वैल्यू पाने के लिए, exitUntilCollapsedScrollBehavior()
का इस्तेमाल किया गया है. जब उपयोगकर्ता स्कैफ़ोल्ड के अंदरूनी कॉन्टेंट को स्क्रोल करता है, तो बार छोटा हो जाता है. हालांकि, जब उपयोगकर्ता अंदरूनी कॉन्टेंट के आखिर तक स्क्रोल करता है, तो बार बड़ा हो जाता है.
नतीजा
![किसी ऐप्लिकेशन की स्क्रीन, जिसमें सबसे नीचे ऐप्लिकेशन बार है. इस बार में बाईं ओर ऐक्शन आइकॉन और दाईं ओर फ़्लोटिंग ऐक्शन बटन है.](https://developer.android.google.cn/static/develop/ui/compose/images/components/appbar-large.png?hl=hi)
बॉटम ऐप्लिकेशन बार लागू करना
सबसे नीचे मौजूद ऐप्लिकेशन बार बनाने के लिए, BottomAppBar
कॉम्पोज़ेबल का इस्तेमाल करें. यह सबसे ऊपर मौजूद ऐप्लिकेशन बार कॉम्पोज़ेबल से मिलता-जुलता है.
इन मुख्य पैरामीटर के लिए, कॉम्पोज़ेबल पास किए जाते हैं:
actions
: आइकॉन की एक सीरीज़, जो बार की बाईं ओर दिखती है. आम तौर पर, ये किसी स्क्रीन के लिए मुख्य कार्रवाइयां या नेविगेशन आइटम होती हैं.floatingActionButton
: बार की दाईं ओर दिखने वाला फ़्लोटिंग ऐक्शन बटन.
नतीजा
![किसी ऐप्लिकेशन की स्क्रीन, जिसमें सबसे नीचे ऐप्लिकेशन बार है. इस बार में बाईं ओर ऐक्शन आइकॉन और दाईं ओर फ़्लोटिंग ऐक्शन बटन है.](https://developer.android.google.cn/static/develop/ui/compose/images/components/appbar-bottom.png?hl=hi)
प्रमुख बिंदु
- आम तौर पर, ऐप्लिकेशन बार को
Scaffold
कॉम्पोज़ेबल में पास किया जाता है. इसमें, उन्हें पाने के लिए खास पैरामीटर होते हैं. ऐप्लिकेशन के सबसे ऊपर मौजूद बार लागू करने के लिए इस्तेमाल किए जाने वाले कॉम्पोज़ेबल, ये मुख्य पैरामीटर शेयर करते हैं:
title
: ऐप्लिकेशन बार में दिखने वाला टेक्स्ट.navigationIcon
: नेविगेशन के लिए मुख्य आइकॉन, जो ऐप्लिकेशन बार के बाईं ओर दिखता है.actions
: ये ऐसे आइकॉन होते हैं जिनसे उपयोगकर्ता को मुख्य कार्रवाइयों का ऐक्सेस मिलता है. ये आइकॉन, ऐप्लिकेशन बार की दाईं ओर दिखते हैं.scrollBehavior
: इससे यह तय होता है कि स्कैफ़ोल्ड के अंदर मौजूद कॉन्टेंट को स्क्रोल करने पर, सबसे ऊपर मौजूद ऐप्लिकेशन बार कैसे काम करता है.colors
: इससे यह तय होता है कि ऐप्लिकेशन बार कैसा दिखेगा.
आपके पास यह कंट्रोल करने का विकल्प होता है कि जब उपयोगकर्ता स्काफ़़ल के अंदर मौजूद कॉन्टेंट को स्क्रोल करे, तो ऐप्लिकेशन बार कैसा दिखे. ऐसा करने के लिए,
TopAppBarScrollBehavior
का एक इंस्टेंस बनाएं और इसेscrollBehavior
पैरामीटर के लिए, अपने सबसे ऊपर मौजूद ऐप्लिकेशन बार में पास करें.TopAppBarScrollBehavior
तीन तरह के होते हैं:enterAlwaysScrollBehavior
: जब उपयोगकर्ता स्कैफ़ोल्ड के अंदरूनी कॉन्टेंट को ऊपर खींचता है, तो सबसे ऊपर मौजूद ऐप्लिकेशन बार छोटा हो जाता है. जब उपयोगकर्ता अंदर मौजूद कॉन्टेंट को नीचे की ओर खींचता है, तो ऐप्लिकेशन बार बड़ा हो जाता है.exitUntilCollapsedScrollBehavior
: यहenterAlwaysScrollBehavior
जैसा ही है. हालांकि, जब उपयोगकर्ता स्काफ़़ल के अंदरूनी कॉन्टेंट के आखिर तक पहुंचता है, तब ऐप्लिकेशन बार भी बड़ा हो जाता है.pinnedScrollBehavior
: ऐप्लिकेशन बार अपनी जगह पर बना रहता है और स्क्रीन पर स्क्रोल करने पर भी नहीं हिलता.
ऐसे संग्रह जिनमें यह गाइड शामिल है
यह गाइड, चुने गए क्विक गाइड के कलेक्शन का हिस्सा है. इसमें Android डेवलपमेंट के बड़े लक्ष्यों के बारे में बताया गया है:
![](https://developer.android.google.cn/static/images/quick-guides/collection-illustration.png?hl=hi)