במדריך הזה מוסבר איך להגדיר שסמל הניווט בסרגל האפליקציות העליון יבצע פעולות ניווט.
דוגמה
קטע הקוד הבא הוא דוגמה מינימלית לאופן שבו אפשר להטמיע סרגל אפליקציות בחלק העליון עם סמל ניווט פונקציונלי. במקרה כזה, הסמל מעביר את המשתמש ליעד הקודם באפליקציה:
@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...
מקורות מידע נוספים
מידע נוסף על אופן הטמעת הניווט באפליקציה זמין בסדרת המדריכים הבאה: