बॉटम शीट बनाना
संग्रह की मदद से व्यवस्थित रहें
अपनी प्राथमिकताओं के आधार पर, कॉन्टेंट को सेव करें और कैटगरी में बांटें.
बॉटम शीट में, स्क्रीन के सबसे नीचे ऐंकर किया गया सेकंडरी कॉन्टेंट दिखता है.
वर्शन के साथ काम करना
इसे लागू करने के लिए, ज़रूरी है कि आपके प्रोजेक्ट का minSDK एपीआई लेवल 21 या उससे ज़्यादा पर सेट हो.
डिपेंडेंसी
बॉटम शीट लागू करना
बॉटम शीट लागू करने के लिए, ModalBottomSheet
कॉम्पोज़ेबल का इस्तेमाल करें:
शीट को बड़ा और छोटा करना
शीट को बड़ा और छोटा करने के लिए, SheetState
का इस्तेमाल करें:
प्रमुख बिंदु
content
स्लॉट का इस्तेमाल करें. यह स्लॉट, कॉलम में शीट कॉन्टेंट के कॉम्पोनेंट को लेआउट करने के लिए, ColumnScope
का इस्तेमाल करता है.
SheetState
का ऐसा इंस्टेंस बनाने के लिए rememberSheetState
का इस्तेमाल करें जिसे sheetState
पैरामीटर के साथ ModalBottomSheet
को पास किया जाता है.
SheetState
, show
और hide
फ़ंक्शन के साथ-साथ, मौजूदा शीट की स्थिति से जुड़ी प्रॉपर्टी का ऐक्सेस देता है. इन फ़ंक्शन के लिए, CoroutineScope
की ज़रूरत होती है — उदाहरण के लिए, rememberCoroutineScope
— और इन्हें यूज़र इंटरफ़ेस (यूआई) इवेंट के जवाब में कॉल किया जा सकता है.
सबसे नीचे मौजूद शीट को छिपाने पर, कॉम्पोज़िशन से ModalBottomSheet
को ज़रूर हटाएं.
नतीजे
पहली इमेज. स्टैंडर्ड बॉटम शीट (बाईं ओर) और मॉडल बॉटम शीट (दाईं ओर).
ऐसे संग्रह जिनमें यह गाइड शामिल है
यह गाइड, चुने गए क्विक गाइड के कलेक्शन का हिस्सा है. इसमें Android डेवलपमेंट के बड़े लक्ष्यों के बारे में बताया गया है:
इंटरैक्टिव कॉम्पोनेंट दिखाना
जानें कि कॉम्पोज़ेबल फ़ंक्शन की मदद से, Material Design डिज़ाइन सिस्टम के आधार पर, आसानी से खूबसूरत यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट कैसे बनाए जा सकते हैं.
इस पेज पर मौजूद कॉन्टेंट और कोड सैंपल कॉन्टेंट के लाइसेंस में बताए गए लाइसेंस के हिसाब से हैं. Java और OpenJDK, Oracle और/या इससे जुड़ी हुई कंपनियों के ट्रेडमार्क या रजिस्टर किए हुए ट्रेडमार्क हैं.
आखिरी बार 2025-02-06 (UTC) को अपडेट किया गया.
[[["समझने में आसान है","easyToUnderstand","thumb-up"],["मेरी समस्या हल हो गई","solvedMyProblem","thumb-up"],["अन्य","otherUp","thumb-up"]],[["वह जानकारी मौजूद नहीं है जो मुझे चाहिए","missingTheInformationINeed","thumb-down"],["बहुत मुश्किल है / बहुत सारे चरण हैं","tooComplicatedTooManySteps","thumb-down"],["पुराना","outOfDate","thumb-down"],["अनुवाद से जुड़ी समस्या","translationIssue","thumb-down"],["सैंपल / कोड से जुड़ी समस्या","samplesCodeIssue","thumb-down"],["अन्य","otherDown","thumb-down"]],["आखिरी बार 2025-02-06 (UTC) को अपडेट किया गया."],[],[],null,["\u003cbr /\u003e\n\nA bottom sheet shows secondary content, anchored to the bottom of the screen.\n\nVersion compatibility\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\nDependencies\n\nImplement a bottom sheet\n\nTo implement a [bottom sheet](https://m3.material.io/components/bottom-sheets/overview), use the [`ModalBottomSheet`](/reference/kotlin/androidx/compose/material3/package-summary#ModalBottomSheet(kotlin.Function0,androidx.compose.ui.Modifier,androidx.compose.material3.SheetState,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Color,kotlin.Function0,kotlin.Function0,androidx.compose.material3.ModalBottomSheetProperties,kotlin.Function1))\ncomposable:\n\nExpand and collapse the sheet\n\nTo expand and collapse the sheet, use [`SheetState`](/reference/kotlin/androidx/compose/material3/SheetState):\n\nKey points\n\n- Use the `content` slot, which uses a [`ColumnScope`](/reference/kotlin/androidx/compose/foundation/layout/ColumnScope) to lay out sheet content composables in a column.\n- Use [`rememberSheetState`](/reference/kotlin/androidx/compose/material3/package-summary#rememberSheetState(kotlin.Boolean,kotlin.Function1)) to create an instance of `SheetState` that you pass to `ModalBottomSheet` with the `sheetState` parameter.\n- `SheetState` provides access to the [`show`](/reference/kotlin/androidx/compose/material3/SheetState#show()) and [`hide`](/reference/kotlin/androidx/compose/material3/SheetState#hide()) functions\n and to properties related to the current sheet state. These functions\n require a `CoroutineScope` --- for example, [`rememberCoroutineScope`](/reference/kotlin/androidx/compose/runtime/package-summary#remembercoroutinescope) ---\n and can be called in response to UI events.\n\n- Make sure to remove the `ModalBottomSheet` from composition when you hide\n the bottom sheet.\n\nResults\n\n\n**Figure 1.** A standard bottom sheet (left) and a modal bottom sheet (right).\n\n\u003cbr /\u003e\n\nCollections that contain this guide\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\nDisplay interactive components \nLearn how composable functions can enable you to easily create beautiful UI components based on the Material Design design system. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-interactive-components) \n\nHave questions or feedback \nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]