UI একসাথে ধরে রাখতে একটি স্ক্যাফোল্ড উপাদান তৈরি করুন
সেভ করা পৃষ্ঠা গুছিয়ে রাখতে 'সংগ্রহ' ব্যবহার করুন
আপনার পছন্দ অনুযায়ী কন্টেন্ট সেভ করুন ও সঠিক বিভাগে রাখুন।
মেটেরিয়াল ডিজাইনে, একটি স্ক্যাফোল্ড একটি মৌলিক কাঠামো যা জটিল ব্যবহারকারী ইন্টারফেসের জন্য একটি প্রমিত প্ল্যাটফর্ম প্রদান করে। এটি UI এর বিভিন্ন অংশকে একত্রে ধরে রাখে, যেমন অ্যাপ বার এবং ফ্লোটিং অ্যাকশন বোতাম, অ্যাপগুলিকে একটি সুসংগত চেহারা এবং অনুভূতি দেয়।
সংস্করণ সামঞ্জস্য
এই বাস্তবায়নের জন্য আপনার প্রজেক্ট minSDK এপিআই লেভেল 21 বা তার উপরে সেট করা প্রয়োজন।
নির্ভরতা
একটি ভারা তৈরি করুন
নিম্নলিখিত উদাহরণটি আপনি কীভাবে Scaffold বাস্তবায়ন করতে পারেন তার একটি সম্পূর্ণ উদাহরণ প্রদান করে। এটিতে একটি শীর্ষ অ্যাপ বার, নীচের অ্যাপ বার এবং একটি ভাসমান অ্যাকশন বোতাম রয়েছে যা Scaffold অভ্যন্তরীণ অবস্থার সাথে ইন্টারঅ্যাক্ট করে।
ফলাফল
চিত্র 1. ভারা একটি বাস্তবায়ন.
মূল পয়েন্ট
Scaffold কম্পোজেবল একটি সহজবোধ্য API প্রদান করে যা আপনি মেটেরিয়াল ডিজাইনের নির্দেশিকা অনুযায়ী আপনার অ্যাপের গঠনকে দ্রুত একত্রিত করতে ব্যবহার করতে পারেন। Scaffold পরামিতি হিসাবে বেশ কিছু কম্পোজেবল গ্রহণ করে। এর মধ্যে নিম্নলিখিতগুলি হল:
topBar : স্ক্রিনের উপরের অংশ জুড়ে অ্যাপ বার।
bottomBar : স্ক্রিনের নীচের অংশ জুড়ে অ্যাপ বার।
floatingActionButton : একটি বোতাম যা স্ক্রিনের নীচে-ডান কোণায় ঘোরে যা আপনি কী ক্রিয়াগুলি প্রকাশ করতে ব্যবহার করতে পারেন।
আপনি কীভাবে উপরের এবং নীচের উভয় অ্যাপ বার প্রয়োগ করতে পারেন তার আরও বিশদ উদাহরণের জন্য, অ্যাপ বার পৃষ্ঠাটি দেখুন।
আপনি অন্যান্য পাত্রে যেমন Scaffold সামগ্রী পাস করতে পারেন। এটি content ল্যাম্বডাতে একটি innerPadding মান পাস করে যা আপনি শিশু কম্পোজেবলগুলিতে ব্যবহার করতে পারেন।
এই নির্দেশিকা ধারণকারী সংগ্রহ
এই নির্দেশিকাটি এই কিউরেট করা কুইক গাইড সংগ্রহের অংশ যা বৃহত্তর অ্যান্ড্রয়েড উন্নয়ন লক্ষ্যগুলি কভার করে:
একটি হোম স্ক্রীন স্ক্যাফোল্ড তৈরি করুন
জটিল ইউজার ইন্টারফেস তৈরি করতে একটি প্রমিত প্ল্যাটফর্ম কীভাবে ব্যবহার করবেন তা খুঁজে বের করুন। স্ক্যাফোল্ড UI এর বিভিন্ন অংশকে একত্রিত করে, অ্যাপগুলিকে একটি সুসংগত চেহারা এবং অনুভূতি দেয়।
এই পৃষ্ঠার কন্টেন্ট ও কোডের নমুনাগুলি Content License-এ বর্ণিত লাইসেন্সের অধীনস্থ। Java এবং OpenJDK হল Oracle এবং/অথবা তার অ্যাফিলিয়েট সংস্থার রেজিস্টার্ড ট্রেডমার্ক।
2025-02-06 UTC-তে শেষবার আপডেট করা হয়েছে।
[null,null,["2025-02-06 UTC-তে শেষবার আপডেট করা হয়েছে।"],[],[],null,["# Create a scaffold component to hold the UI together\n\n\u003cbr /\u003e\n\nIn Material Design, a scaffold is a fundamental structure that provides a\nstandardized platform for complex user interfaces. It holds together different\nparts of the UI, such as app bars and floating action buttons, giving apps a\ncoherent look and feel.\n\nVersion compatibility\n---------------------\n\nThis implementation requires that your project minSDK be set to API level 21\nor higher.\n\n### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n \n```\n\n\u003cbr /\u003e\n\nCreate a scaffold\n-----------------\n\nThe following example provides a full example of how you might implement\n[`Scaffold`](/reference/kotlin/androidx/compose/material/package-summary#Scaffold(androidx.compose.foundation.layout.WindowInsets,androidx.compose.ui.Modifier,androidx.compose.material.ScaffoldState,kotlin.Function0,kotlin.Function0,kotlin.Function1,kotlin.Function0,androidx.compose.material.FabPosition,kotlin.Boolean,kotlin.Function1,kotlin.Boolean,androidx.compose.ui.graphics.Shape,androidx.compose.ui.unit.Dp,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,kotlin.Function1)). It contains a top app bar, bottom app bar, and a floating action\nbutton that interacts with `Scaffold`'s internal state.\n\n\u003cbr /\u003e\n\n```kotlin\n@Composable\nfun ScaffoldExample() {\n var presses by remember { mutableIntStateOf(0) }\n\n Scaffold(\n topBar = {\n TopAppBar(\n colors = topAppBarColors(\n containerColor = MaterialTheme.colorScheme.primaryContainer,\n titleContentColor = MaterialTheme.colorScheme.primary,\n ),\n title = {\n Text(\"Top app bar\")\n }\n )\n },\n bottomBar = {\n BottomAppBar(\n containerColor = MaterialTheme.colorScheme.primaryContainer,\n contentColor = MaterialTheme.colorScheme.primary,\n ) {\n Text(\n modifier = Modifier\n .fillMaxWidth(),\n textAlign = TextAlign.Center,\n text = \"Bottom app bar\",\n )\n }\n },\n floatingActionButton = {\n FloatingActionButton(onClick = { presses++ }) {\n Icon(Icons.Default.Add, contentDescription = \"Add\")\n }\n }\n ) { innerPadding -\u003e\n Column(\n modifier = Modifier\n .padding(innerPadding),\n verticalArrangement = Arrangement.spacedBy(16.dp),\n ) {\n Text(\n modifier = Modifier.padding(8.dp),\n text =\n \"\"\"\n This is an example of a scaffold. It uses the Scaffold composable's parameters to create a screen with a simple top app bar, bottom app bar, and floating action button.\n\n It also contains some basic inner content, such as this text.\n\n You have pressed the floating action button $presses times.\n \"\"\".trimIndent(),\n )\n }\n }\n}\n \n https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/components/Scaffold.kt#L47-L100\n \n```\n\n\u003cbr /\u003e\n\nResults\n-------\n\n**Figure 1.** An implementation of scaffold.\n\nKey points\n----------\n\nThe [`Scaffold`](/reference/kotlin/androidx/compose/material/ScaffoldState) composable provides a straightforward API you can use to\nquickly assemble your app's structure according to Material Design guidelines.\n`Scaffold` accepts several composables as parameters. Among these are the\nfollowing:\n\n- `topBar`: The app bar across the top of the screen.\n- `bottomBar`: The app bar across the bottom of the screen.\n- `floatingActionButton`: A button that hovers over the bottom-right corner of the screen that you can use to expose key actions.\n\nFor more detailed examples on how you can implement both top and bottom\napp bars, see the app bars page.\n\nYou can also pass `Scaffold` content as you would to other containers. It passes\nan `innerPadding` value to the `content` lambda that you can then use in child\ncomposables.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Create a home screen scaffold\n\nFind out how to use a standardized platform to build complex user interfaces. The scaffold holds together different parts of the UI, giving apps a coherent look and feel. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/create-a-home-screen-scaffold) \n\n### Display interactive components\n\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\n--------------------------\n\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)"]]
