নীচের শীট

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

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

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

SheetState ব্যবহার করে প্রোগ্রামগতভাবে শীটটি প্রসারিত করা এবং ভেঙে ফেলা হয়। sheetState প্যারামিটার সহ ModalBottomSheet এ পাস করা উচিত এমন SheetState এর একটি উদাহরণ তৈরি করতে আপনি rememberSheetState ব্যবহার করতে পারেন। 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")
            }
        }
    }
}