নীচের শীট

ম্যাটেরিয়াল ডিজাইন ৩ মোডাল বটম শীটের একটি উদাহরণ।

আপনি যদি একটি বটম শীট প্রয়োগ করতে চান, তাহলে ModalBottomSheet কম্পোজেবলটি ব্যবহার করতে পারেন।

আপনি content স্লট ব্যবহার করতে পারেন, যা একটি কলামে শীট কন্টেন্ট কম্পোজেবলগুলোকে লেআউট করার জন্য ColumnScope ব্যবহার করে:

ModalBottomSheet(onDismissRequest = { /* Executed when the sheet is dismissed */ }) {
    // Sheet content
}

প্রোগ্রাম্যাটিকভাবে শীটের অবস্থা নিয়ন্ত্রণ করুন

প্রোগ্রামের মাধ্যমে শীটটি প্রসারিত এবং সংকুচিত করতে SheetState ব্যবহার করুন। আপনি rememberModalBottomSheetState ব্যবহার করে SheetState এর একটি ইনস্ট্যান্স তৈরি করতে পারেন, যা অবশ্যই sheetState প্যারামিটারের সাথে ModalBottomSheet এ পাস করতে হবে। SheetState show এবং hide ফাংশনগুলোর পাশাপাশি বর্তমান শীটের অবস্থা সম্পর্কিত প্রোপার্টিগুলোতে অ্যাক্সেস দেয়। এই সাসপেন্ডিং ফাংশনগুলোর জন্য একটি CoroutineScope প্রয়োজন — উদাহরণস্বরূপ, rememberCoroutineScope ব্যবহার করে — এবং আপনি UI ইভেন্টের প্রতিক্রিয়ায় এগুলো কল করতে পারেন। বটম শীটটি হাইড করার পর কম্পোজিশন থেকে ModalBottomSheet টি সরিয়ে ফেলতে ভুলবেন না।

val sheetState = rememberModalBottomSheetState()
val scope = rememberCoroutineScope()
var showBottomSheet by remember { mutableStateOf(false) }
Scaffold(
    floatingActionButton = {
        ExtendedFloatingActionButton(
            text = { Text("Show bottom sheet") },
            icon = { Icon(Icons.Filled.Add, contentDescription = "") },
            onClick = {
                showBottomSheet = true
            }
        )
    }
) { contentPadding ->
    // Screen content

    if (showBottomSheet) {
        ModalBottomSheet(
            onDismissRequest = {
                showBottomSheet = false
            },
            sheetState = sheetState
        ) {
            // Sheet content
            Button(onClick = {
                scope.launch { sheetState.hide() }.invokeOnCompletion {
                    if (!sheetState.isVisible) {
                        showBottomSheet = false
                    }
                }
            }) {
                Text("Hide bottom sheet")
            }
        }
    }
}

জেটপ্যাক কম্পোজে কন্টেন্ট প্রদর্শনকারী একটি মোডাল বটম শীট।