ورق پایین جزئی

می توانید تا حدی یک صفحه پایین را نشان دهید و سپس به کاربر اجازه دهید آن را تمام صفحه کند یا آن را رد کند.

برای انجام این کار، ModalBottomSheet خود را یک نمونه از SheetState با skipPartiallyExpanded که روی false تنظیم شده است، ارسال کنید.

مثال

این مثال نشان می‌دهد که چگونه می‌توانید از ویژگی sheetState ModalBottomSheet برای نمایش دادن صفحه در ابتدا فقط به صورت جزئی استفاده کنید:

@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)
                )
            }
        }
    }
}
BottomSheet.kt

نکات کلیدی در مورد کد

در این مثال به موارد زیر توجه کنید:

• showBottomSheet کنترل می کند که آیا برنامه صفحه پایین را نمایش می دهد یا خیر.
• sheetState نمونه ای از SheetState است که در آن skipPartiallyExpanded نادرست است.
• ModalBottomSheet یک اصلاح کننده می گیرد که تضمین می کند وقتی به طور کامل باز می شود صفحه را پر می کند.
• ModalBottomSheet sheetState به عنوان مقدار پارامتر sheetState خود می گیرد.
  • در نتیجه، صفحه فقط تا حدی در اولین باز شدن نمایش داده می شود. سپس کاربر می تواند آن را بکشد یا بکشد تا تمام صفحه شود یا آن را رد کند.
• لامبدا onDismissRequest کنترل می کند که وقتی کاربر سعی می کند صفحه پایین را رد کند چه اتفاقی می افتد. در این حالت فقط ورق را جدا می کند.

نتایج

هنگامی که کاربر برای اولین بار دکمه را فشار می دهد، صفحه تا حدی نمایش داده می شود:

اگر کاربر صفحه را به سمت بالا بکشد، صفحه را پر می کند:

منابع اضافی

• ورق های پایین