این راهنما نشان میدهد که چگونه میتوانید نماد پیمایش را در نوار بالای برنامه انجام دهید تا اقدامات ناوبری را انجام دهد.
مثال
قطعه زیر یک نمونه حداقلی از نحوه پیاده سازی نوار بالای برنامه با نماد ناوبری کاربردی است. در این حالت، نماد کاربر را به مقصد قبلی خود در برنامه می برد:
@Composable fun TopBarNavigationExample( navigateBack: () -> Unit, ) { Scaffold( topBar = { CenterAlignedTopAppBar( title = { Text( "Navigation example", ) }, navigationIcon = { IconButton(onClick = navigateBack) { Icon( imageVector = Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Localized description" ) } }, ) }, ) { innerPadding -> Text( "Click the back button to pop from the back stack.", modifier = Modifier.padding(innerPadding), ) } }
نکات کلیدی در مورد کد
در این مثال به موارد زیر توجه کنید:
-
TopBarNavigationExample
قابل ترکیب یک پارامترnavigateBack
از نوع() -> Unit
را تعریف می کند. -
navigateBack
برای پارامترnavigationIcon
CenterAlignedTopAppBar
ارسال می کند.
به این ترتیب، هر زمان که کاربر روی نماد پیمایش در برنامه بالا کلیک کند، آن navigateBack()
فراخوانی میکند.
یک تابع را پاس کنید
این مثال از یک فلش عقب برای نماد استفاده می کند. به این ترتیب، آرگومان navigateBack()
باید کاربر را به مقصد قبلی برساند.
برای انجام این کار، یک تماس TopBarNavigationExample
را به NavController.popBackStack()
ارسال کنید. شما این کار را در جایی که نمودار ناوبری خود را می سازید انجام می دهید. به عنوان مثال:
NavHost(navController, startDestination = "home") {
composable("topBarNavigationExample") {
TopBarNavigationExample{ navController.popBackStack() }
}
// Other destinations...
منابع اضافی
برای کسب اطلاعات بیشتر در مورد نحوه اجرای ناوبری در برنامه خود، سری از راهنماهای زیر را ببینید:
- پیمایش با نوشتن
- یک NavController ایجاد کنید
- نمودار ناوبری خود را طراحی کنید
- به یک کامپوزیشن پیمایش کنید