আংশিক স্ক্রিনের নিচে অ্যাটাচ করা শিট

আপনি আংশিকভাবে স্ক্রিনের নিচে অ্যাটাচ করা শিট দেখাতে পারেন এবং তারপরে ব্যবহারকারীকে এটি ফুল-স্ক্রিন করতে বা বাতিল করতে দিতে পারেন।

এটি করতে, আপনার ModalBottomSheet পাস করুন, SheetState-এর একটি ইনস্ট্যান্স যেখানে skipPartiallyExpanded-কে false হিসেবে সেট করা হয়েছে।

উদাহরণ

এই উদাহরণ থেকে বোঝা যায় যে প্রথমে শিটটি আংশিকভাবে দেখানোর জন্য আপনি কীভাবে ModalBottomSheet-এর sheetState প্রপার্টি ব্যবহার করতে পারেন:

@Composable
fun PartialBottomSheet() {
    var showBottomSheet by remember { mutableStateOf(false) }
    val sheetState = rememberModalBottomSheetState(
        skipPartiallyExpanded = false,
    )

    Column(
        modifier = Modifier.fillMaxWidth(),
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Button(
            onClick = { showBottomSheet = true }
        ) {
            Text("Display partial bottom sheet")
        }

        if (showBottomSheet) {
            ModalBottomSheet(
                modifier = Modifier.fillMaxHeight(),
                sheetState = sheetState,
                onDismissRequest = { showBottomSheet = false }
            ) {
                Text(
                    "Swipe up to open sheet. Swipe down to dismiss.",
                    modifier = Modifier.padding(16.dp)
                )
            }
        }
    }
}

কোড সম্পর্কে গুরুত্বপূর্ণ পয়েন্ট

এই উদাহরণে, নিম্নলিখিত বিষয়গুলি লক্ষ্য করুন:

  • অ্যাপটি স্ক্রিনের নিচে অ্যাটাচ করা শিট দেখাবে কিনা তা showBottomSheet নিয়ন্ত্রণ করে।
  • sheetState হল SheetState-এর একটি উদাহরণ যেখানে skipPartiallyExpanded মিথ্যা।
  • ModalBottomSheet একটি মডিফায়ার নেয় যা নিশ্চিত করে যে এটি সম্পূর্ণভাবে প্রসারিত হলে স্ক্রিনটি পূরণ করে।
  • ModalBottomSheet তার sheetState প্যারামিটারের ভ্যালু হিসেবে sheetState নেয়।
    • এর ফলে, প্রথমবার খোলার সময় শিটটি আংশিকভাবে দেখা যায়। ব্যবহারকারী সেটি ফুল-স্ক্রিন করতে বা বাতিল করতে টেনে আনতে বা সোয়াইপ করতে পারবেন।
  • ব্যবহারকারী স্ক্রিনের নিচে অ্যাটাচ করা শিট বাতিল করার চেষ্টা করলে কী হবে তা onDismissRequest ল্যাম্বডা নিয়ন্ত্রণ করে। এই ক্ষেত্রে, এটি শুধুমাত্র শিটটি সরিয়ে দেয়।

ফলাফল

ব্যবহারকারী প্রথমবার বোতামটি প্রেস করলে, শিটটি আংশিকভাবে দেখা যায়:

স্ক্রিনের নিচে অ্যাটাচ করা শিট যা প্রথমে স্ক্রিনের শুধুমাত্র একটি অংশ পূরণ করে। ব্যবহারকারী সোয়াইপ করে স্ক্রিনটি এটি দিয়ে পূরণ করতে পারেন অথবা এটি বাতিল করতে পারেন
ছবি ১. স্ক্রিনের নিচে অ্যাটাচ করা শিট আংশিকভাবে দেখানো হয়েছে।

ব্যবহারকারী শিটে উপরের দিকে সোয়াইপ করলে, এটি স্ক্রিন জুড়ে দেখানো হয়:

স্ক্রিনের নিচে অ্যাটাচ করা শিট যা ব্যবহারকারী স্ক্রিন পূরণ করার জন্য বড় করেছেন।
ছবি ২. ফুল-স্ক্রিন বটম শিট।

অতিরিক্ত রিসোর্স